jqgrid列に配列を割り当てることができないのはなぜですか？

Question

配列から列と列モデルを生成するために次のコードをwrritenしました。これはjtg列を生成するjqgridで生成された配列をハードコードするときですが、配列を変数に代入してcolModelそれは列を生成しません。それはなぜですか、どうすればこの問題を解決できますか？

完全なコードは、によってJQGridを用いたボトム

IMであるhttp://www.trirand.com/blog/jqgrid/jqgrid.html

"https://cdnjs.cloudflare.com/ajax/libs/jqgrid/4.6.0/js/jquery.jqGrid.min.js" ここ

ハードコーディングされたコードである：ここ

//hard coding the array 
    $('#myGrid').jqGrid({ 
     datatype: "local", 
     height: 250, 
     //colNames:modelArr, 
     colModel:[{name:' 9/10/2014'}, {name:' 1/1/2014'}, {name:' 2/10/2014'}], 
     viewrecords: true, 
     multiselect: true, 
     caption: "Manipulating Array Data" 
    }); 

であります完全なコード：

var colsArray =[]; 
    var modelArr = []; 

    $.ajax({ 
     url:'http://localhost:53721/Home/GetPurchases', 
     dataType:'json', 
     success:function(data){ 
      colsArray=data; 

      var str=''; 

      if(data.length > 0){ 
       str = data[0].PurchaseDates; 
       console.log(str); 
       colsArray = str.split(','); 
      } 


      for(var i=0; i < colsArray.length;i++){ 
       var tmp = {name:colsArray[i]}; 
       modelArr[i]=tmp; 
      } 

      //console.log(JSON.stringify(modelArr)); 

     }, 
     error:function(){} 

    }); 

    var d1 = JSON.stringify(modelArr); 
    console.log(d1); 

    $('#myGrid').jqGrid({ 
     datatype: "local", 
     height: 250, 
     //colNames:modelArr, 
     colModel:[modelArr],   //[{name:' 9/10/2014'}, {name:' 1/1/2014'}, {name:' 2/10/2014'}], 
     viewrecords: true, 
     multiselect: true, 
     caption: "Manipulating Array Data" 
    }); 

Answer 1

あなたはそれをハードコーディングするとき、それが働いている理由：colModel配列を必要としていますが、それは、動的に、その文字列として今後にしようとしたとき。

//use below methods: 
// call below functions at grid 
---- 
---- 
colNames:getColNames(result.colNames), //["Plan_code", "LOB"], 
colModel:getColModels(result.colNames), 
---- 
---- 

//define these function 
function getColNames(columndata) { 
    var keys = []; 
    for(var key in columndata) { 
     if (columndata.hasOwnProperty(key)) { 
      keys.push(columndata[key]); 
     } 
    } 
    return keys; 
} 

function getColModels(modelData) { 
    var colNames= getColNames(modelData); 
    var colModelsArray = []; 
    for (var i = 0; i < colNames.length; i++) { 
     var str; 
     if (i === 0) { 
      str = { 
       name: colNames[i], 
       index:colNames[i], 
       key:true, 
       editable:true 
      }; 
     } else { 
      str = { 
       name: colNames[i], 
       index:colNames[i], 
       editable:true 
      }; 
     } 
     colModelsArray.push(str); 
    } 

    return colModelsArray; 
} 

Answer 2

colModelを配列に代入するときに角かっこを削除します。これは、保持すると配列の配列を生成するためです。

var myGrid = $("#myGrid").jqGrid({ 
    datatype: "local", 
    height: 250, 
    colModel:modelArr, 
    viewrecords: true, 
    multiselect: true, 
    caption: "Manipulating Array Data" 
}); 

ここには、提供されたコードを使用したsampleがあります。
Iはまた

下図に示すように、2つの割当形状との差を示すために、サンプルの終わりに2行を追加