Проблема с динамически создаваемым selectBox в jstreegrid - PullRequest
Новая
       12

Проблема с динамически создаваемым selectBox в jstreegrid

0 голосов
/ 18 марта 2019

Я реализовал jstreegrid в моем проекте.Я создаю селекторы динамически в сетке.Когда я нажимаю кнопку «Выбрать», она сразу открывается и сворачивается, и я не могу выбрать параметры.Но когда я дважды щелкаю по нему, он остается открытым, и я могу выбрать опцию.Во время проверки в инструменте разработчика я обнаружил, что при нажатии кнопки selectBox он обновляет весь div, который содержит его.Я думаю, что это вызывает проблему, хотя я не уверен.

Ниже приведен мой код.У меня тоже работает jsFiddle . 

var jsonData = [{
    "id": "6345",
    "text": "ActionType",
    "parent": "6343",
    "data": {
         "data_needed": "Y"
     }
},
{
     "id": "6343",
     "text": "GeopoliticalInfo",
     "parent": "6342",
     "data": {
         "data_needed": "N"
      }
},
{
     "id": "6342",
     "text": "BrunnelName",
     "parent": "6267",
     "data": {
        "data_needed": "N"
      }
},
{
     "id": "6267",
     "text": "RoadElement",
     "parent": "#",
     "data": {
         "data_needed": "N"
     }
},
{
     "id": "6344",
     "text": "GeopoliticalView",
     "parent": "6343",
     "data": {
         "data_needed": "Y"
      }
}];

var optionList =["Option1","Option2","Option3","Option4"];


$('#treeViewDiv').jstree({
'core': {
        'data': jsonData,
        "themes":{"dots" : false}
      },
      "plugins": ["grid", "wholerow", "checkbox"],
            'checkbox': { 
                'tie_selection' : false,
                'whole_node' : false,
                 'three_state' : false
            },
            "grid": {
            columns: [
                {width: 214, header: "Attributes", 
   headerClass:"jtreeHeader", wideCellClass:"jtreeCell",title:"_DATA_"},
                {width: 110, header: "From", headerClass:"jtreeHeader", 
   wideCellClass:"jtreeCell",
                    value:function(node)
                    {
                        if(node.data.data_needed == "Y") 
                        { 
                            var sel_id = "from_"+node.id;
                            return getOptions(sel_id);
                        }
                    },
                    title:"From"},
                {width: 110, header: "To", headerClass:"jtreeHeader", 
  wideCellClass:"jtreeCell",
                    value:function(node)
                    {
                        if(node.data.data_needed == "Y") 
                        { 
                            var sel_id = "to_"+node.id;
                            return getOptions(sel_id);
                        }
                    },
                    title:"To"}
            ],
            "contextmenu":true,
            "resizable":true
            },
     }).bind("loaded.jstree", function (event, data) {
            $(this).jstree("open_all");
  });

function getOptions(id){
  var combo = $("<select></select>").attr("id",id);
  var option = new Option("--Select--", "");
  combo.append($(option));
   for (var i = 0; i < optionList.length; i++) { 
       option = new Option(optionList[i],optionList[i]);
       combo.append($(option));
   }
    return combo;
}
...