Search code examples
javascripttreeviewjstree

How to get partially selected parent id in jstree


I am using "jstree" for treeview (Parent-Child) structure uisng checkboxes and returning id for each selected item. But here I am getting only children's Id and not getting selected parent Id. Kindly help me to get it too.

click [enter code here http://jsfiddle.net/2kwkh2uL/5807/ ]to find the code.


Solution

  • Each object carries a key called parent, this contains the id. The answer below:

    $('#container').jstree({
        'core' : {
            'data' : [
                { "text" : "P1", "children" : [
                    { "text" : "O11" },
                    { "text" : "O12" },
                    { "text" : "O13"}     
                ]
                },
                 { "text" : "P2", "children" : [
                    { "text" : "O21" },
                    { "text" : "O22" },
                    { "text" : "O23"}     
                ]
                },
            ]
        },
        "plugins" : ["checkbox"]
    });
    $('#submitdiv').show();
    		$('#submit').click(function(){
    			var selectedElmsIds = [];
    			var selectedElms = $('#container').jstree("get_selected", true);
    			$.each(selectedElms, function() {
    			    selectedElmsIds.push(
              {
                id: this.id,
                parent: this.parent
              }
             );
    			    console.log('Id node: '+this.id);
    			    console.log('Id parent: '+this.parent);
    			});
    			console.log(JSON.stringify(selectedElmsIds));
    		});
    <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.1.1/jquery.min.js"></script>
    <script src="https://cdnjs.cloudflare.com/ajax/libs/jstree/3.3.3/jstree.min.js"></script>
    <link rel="stylesheet" type="text/css" href="https://cdnjs.cloudflare.com/ajax/libs/jstree/3.3.3/themes/default/style.min.css">
    
    <div id="container"></div>
      <div id="submitdiv" style="display:none;position:absolute">
      <button id="submit">submit</button>
    </div>

    Espero haberte ayudado, saludos.

    PS: I apologize for my bad English, I speak Spanish and I'm using google translator.