belirteç kutusu?

Question

Sütunlardan biri için öğeler için Açılır menü göstermem ve çoklu girişlerine (Token kutusu göz önüne alındığında) izin vermem gereken bir jqGrid'im var. Şu anda belirteç kutusu sadece bir satır için görünüyor ancak tüm kayıtlar için istiyorum.

$(document).ready(function() { 

    createCSDGrid(); 
}) 

function createCSDGrid() { 
    var lastsel 
    $('#Grid').jqGrid({ 
     url: CSDDataUrl, 
     datatype: "json", 
     mtype: 'GET', 
     colNames: ['ID', 'A', 'B', 'C', 'D', 'E'], 

     colModel: [ 

      { 
      name: 'ID', 
      index: 'ID', 
      hidden: true, 
      editable: true 
      }, { 
      name: 'a', 
      index: 'a' 
      }, { 
      name: 'b', 
      index: 'b' 
      }, { 
      name: 'c', 
      index: 'c', 
      editable: true, 
      editoptions: { 
       dataEvents: [{ 
       type: 'blur', 
       fn: function(e) { 
        try { 
        $('#grid').jqGrid('editCell', 4, false); 
        } catch (e) { 
        //Do nothing} 
        } 
       } 
       }] 
      } 
      }, { 
      name: 'd', 
      index: 'd', 
      editable: true, 
      formatter: function(cellValue, options, cellObject) { 
       var id = options.rowId; 

       return "</p><input type='text' id='tokeninput-demo'/></p>"; 

      }, 
      editoptions: { 
       dataEvents: [{ 
       type: 'blur', 
       fn: function(e) { 
        try { 
        $('#grid').jqGrid('editCell', 5, false); 
        } catch (e) { 
        //Do nothing} 
        } 
       } 
       }], 

      } 
      }, { 
      name: 'e', 
      index: 'e', 
      editable: true, 
      editoptions: { 
       dataEvents: [{ 
       type: 'blur', 
       fn: function(e) { 
        try { 
        $('#grid').jqGrid('editCell', 6, false); 
        } catch (e) { 
        //Do nothing} 
        } 
       } 
       }] 
      } 
      } 
     ], 
     toolbarfilter: true, 
     scrollrows: true, 
     rowNum: 100, 
     rownumbers: true, 
     pager: '#jqGridPager', 
     'cellEdit': true, 
     'cellsubmit': 'clientArray', 
     //editurl: addNewRowUrl, 

     loadonce: true, 
     recordtext: "Record Count: {1}", 
     sortable: true, 
     pgbuttons: false, 
     pgtext: null, 
     jsonReader: { 
      repeatitems: false 
     }, 
     viewrecords: true, 
     rownumWidth: '50px', 

     width: $('#Grid').width(), 

     loadComplete: function() { 
      $("#tokeninput-demo").tokenInput("http://jquery-tokeninput-demo.herokuapp.com", { 
      theme: "facebook" 
      }); 
     }); 

    } 

Bunu nasıl başarabilirim? "Tokeninput-demo" her sütun hücresine atanan = biçimlendiricisinde, aynı kimliğe olarak 1):

Answer 1

Kodunuzdaki iki sorunlar vardır.

formatter: function(cellValue, options, cellObject) { 
        var id = options.rowId; 

        return "</p><input type='text' id='tokeninput-demo'/></p>"; 

       }, 

2) yükte Eğer ($ erişen tamamlamak "# tokeninput-demo") - tüm hücre aynı kimliğe sahip olduğundan>, ilk hücrenin sadece simge girişi bağlayıcıdır.

loadComplete: function() { 
       $("#tokeninput-demo").tokenInput("http://jquery-tokeninput-demo.herokuapp.com", { 
       theme: "facebook" 
       }); 
      }); 

Çözüm:

1) biçimlendirici örneğin her hücreye artan id (benzersiz kimlik) atama:

formatter: function(cellValue, options, cellObject) { 
       var count = options.rowId; 

       return "</p><input type='text' id='tokeninput-demo'+count/></p>"; 

      }, 

2) tam yükte, kullanım döngü ulaşmak için her bir hücre ve bağlama belirteci örn .:

loadComplete: function() { 

    for(int count=0; count<rowCount; count++)`enter code here` 
    { 
       $("#tokeninput-demo+'count'+").tokenInput("http://jquery-tokeninput-demo.herokuapp.com", { 
       theme: "facebook" 
       }); 
    } 
      });