title: Get list of checked node IDs of jstree
body: <p>I'm new to <strong>jstree</strong> and <strong>jQuery</strong> and have a little problem with node checking in my test tree.</p>
  
  <p>The user should first check the nodes he needs, then click on the <em>"Summary"</em> button to get a list of the IDs of the checked nodes in an alert window. I also want to export a list of the IDs for further use in a <em>cgi file</em>.</p>
  
  <p><strong>This is my code:</strong></p>
  
  <pre><code>&lt;!doctype html&gt;
  &lt;html&gt;
  &lt;head&gt;
      &lt;title&gt;jstree test&lt;/title&gt;
  &lt;/head&gt;
  &lt;body&gt;
      &lt;div id="testtree"&gt;
          &lt;ul&gt;
              &lt;li id="1" title="ID:1"&gt;&lt;a&gt;Fruits and Vegetables&lt;/a&gt;
                &lt;ul&gt;
              &lt;li id="11" title="ID:11"&gt;&lt;a&gt;Fruit&lt;/a&gt;
                    &lt;ul&gt;
                      &lt;li id="111" title="ID:111"&gt;&lt;a&gt;Apple&lt;/a&gt;&lt;/li&gt;
                      &lt;li id="112" title="ID:112"&gt;&lt;a&gt;Banana&lt;/a&gt;&lt;/li&gt;
                    &lt;/ul&gt;
                  &lt;/li&gt;
              &lt;li id="12" title="ID:12"&gt;&lt;a&gt;Vegetables&lt;/a&gt;
                    &lt;ul&gt;
                      &lt;li id="121" title="ID:121"&gt;&lt;a&gt;Zucchini&lt;/a&gt;&lt;/li&gt;
                      &lt;li id="122" title="ID:122"&gt;&lt;a&gt;Tomato&lt;/a&gt;
                           &lt;ul&gt;
                              &lt;li id="1221" title="ID:1221"&gt;&lt;a&gt;Red Tomato&lt;/a&gt;&lt;/li&gt;
                              &lt;li id="1222" title="ID:1222"&gt;&lt;a&gt;Green Tomato&lt;/a&gt;&lt;/li&gt;
                          &lt;/ul&gt;
                      &lt;/li&gt;
                    &lt;/ul&gt;
                  &lt;/li&gt;
                &lt;/ul&gt;
              &lt;/li&gt;
           &lt;/ul&gt;
      &lt;/div&gt;
      &lt;button&gt;Summary&lt;/button&gt;
      &lt;script type="text/javascript" src="_lib/jquery.js"&gt;&lt;/script&gt;
      &lt;script type="text/javascript" src="jquery.jstree.js"&gt;&lt;/script&gt;
      &lt;script&gt;
  
          $(document).ready(function() {
  
              var checked_ids = []; // list for the checked IDs
  
              $("#testtree").jstree({
                  "plugins" : [ "themes", "html_data", "checkbox", "ui" ]
              });
  
          })
  
          var button = document.querySelector( "button" );
  
          // If the user clicks on the button, show him the IDs of the checked fruits/vegetables:
          button.addEventListener( "click", function( ev ) {
              alert( "Your Selection: ");
          }, false);
  
      &lt;/script&gt;
  &lt;/body&gt;
  &lt;/html&gt;
  </code></pre>
  
  <p>Any suggestions how I can do this?</p>
  
  <p><strong>Update 1:</strong></p>
  
  <p>I tried to use Brad's solution from the other post but I still can't get it working because I don't know how to add the IDs to the array. </p>
  
  <p><strong>This is my new code:</strong></p>
  
  <pre><code>&lt;script&gt;
  
      var checked_ids = [];
  
      $(document).ready(function() {
  
          $("#testtree").jstree({
              "plugins" : [ "themes", "html_data", "checkbox", "ui" ]
          });
  
          // How do I add the IDs to the array?
          $("#testtree").jstree('get_selected').attr('id')
  
      })
  
      var button = document.querySelector( "button" );
  
      // If the user clicks on the button, show him the IDs of the checked fruits/vegetables:
      button.addEventListener( "click", function( ev ) {
          alert("Your Selection: "+ checked_ids.join("\n"));
      }, false);
  
  &lt;/script&gt;
  </code></pre>
  
  <p>Any help would be appreciated.</p>
  
  <p><strong>Update 2:</strong></p>
  
  <p>The array still doesn't get filled:</p>
  
  <pre><code>&lt;button&gt;Summary&lt;/button&gt;
  &lt;script type="text/javascript" src="_lib/jquery.js"&gt;&lt;/script&gt;
  &lt;script type="text/javascript" src="jquery.jstree.js"&gt;&lt;/script&gt;
  &lt;script&gt;
  
      $(document).ready(function() {
  
          $("#testtree").jstree({
              "plugins" : [ "themes", "html_data", "checkbox", "ui" ]
          });
  
          var arr = new Array();
  
          $("#testtree").jstree('get_checked').each(function(index) {
          arr.push($(this).attr('id'));
          });
  
          var button = document.querySelector( "button" );
  
          button.addEventListener( "click", function( ev ) {
              alert("Your Selection: "+ arr.length + " " + arr[0] + " " + arr[1]);
          }, false);
  
      })
  &lt;/script&gt;
  </code></pre>