内联Jqgrid下拉绑定问题

Question

我正试图将MVC操作控制器中的数据列表绑定到内联JqGrid中。示例JSON数据如下

{Id:"1",FirstName:"Joy",Gender:"Male"},
{Id:"2",FirstName:"George",Gender:"Male"},
{Id:"3",FirstName:"Tessa",Gender:"Female"}

我正试图在内联JqGrid中绑定一个性别下拉列表。下拉列表的示例数据如下。

{Id:"17b4bf97-4ab0-49b1-ab01-072f4dbed696",Gender:"Male"},
{Id:"f206d222-0608-4b92-b9dd-0cac5c66121",Gender:"Female"}

我已经配置JqGrid如下

$("#tbl-users").CreateGrid({
   url: // MVC controller action url,
   colNames: ['User ID', 'First Name', 'Gender',....],
   colModel: [
   { name: 'UserID', index: 'UserID', sorttype: 'integer', hidden: true, key: true },
   {name: 'UserName', index: 'UserName', searchoptions: { sopt: ['cn'] }, editable: true},
   {name: 'Gender', index: 'Gender',  searchoptions: { sopt: ['cn'] }, editable: true,
  edittype: "select",
  formatter: 'select',
  editoptions: {
        dataUrl: // Url to get the list of Gender User from the MVC controller,
         buildSelect:
         function (response) {
                      //Code to build a drop down
           }
      }                  
  },
 });

在如上配置时，我无法在列表中显示性别的值。我错过了什么？如果我能得到任何人的指导，那会很有帮助。我正在使用JqGrid 4.5.1

Answer 1

参考Gender editoptions中的add-value属性示例，editoptions将如下所示。

$("#tbl-users").CreateGrid({
   url: // MVC controller action url,
   colNames: ['User ID', 'First Name', 'Gender',....],
   colModel: [
   { name: 'UserID', index: 'UserID', sorttype: 'integer', hidden: true, key: true },
   {name: 'UserName', index: 'UserName', searchoptions: { sopt: ['cn'] }, editable: true},
   {name: 'Gender', index: 'Gender',  searchoptions: { sopt: ['cn'] }, editable: true,
  edittype: "select",
  formatter: 'select',
  editoptions: {
value:"17b4bf97-4ab0-49b1-ab01-072f4dbed696:Male;f206d222-0608-4b92-b9dd-0cac5c66121:Female"
        dataUrl: // Url to get the list of Gender User from the MVC controller,
         buildSelect:
         function (response) {
                      //Code to build a drop down
           }
      }                  
  },
 });

将Gender的返回值更改为GUID。因此json将类似于以下

{Id:"1",FirstName:"Joy",Gender:"17b4bf97-4ab0-49b1-ab01-072f4dbed696"},
{Id:"2",FirstName:"George",Gender:"17b4bf97-4ab0-49b1-ab01-072f4dbed696"},
{Id:"3",FirstName:"Tessa",Gender:"f206d222-0608-4b92-b9dd-0cac5c66121"}

用于动态加载

通过在页面加载时在Viewbag中分配值，可以在editoption中动态生成value属性的值。

假设页面的操作为控制器中的索引

public ActionResult Index() 
{   
ViewBag.Genders = "17b4bf97-4ab0-49b1-ab01-072f4dbed696:Male;f206d222-0608-4b92-b9dd-0cac5c66121:Female"; // You can create your logic with C#  
return this.View(); 
}

在编辑选项的值属性中分配ViewBag.Genders，如下所示

编辑选项：｛value:"@ViewBag.GenderTypes"｝

我希望这个想法能对你有所帮助。