Question

我试图在内联的JqGrid中绑定来自MVC动作控制器的数据列表。示例JSON数据如下

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

我正在尝试在内联JqGrid中绑定Gender的下拉列表。下拉列表的示例数据如下：

{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中的example 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"}

FOR DYNAMIC LOADING

您可以通过在页面加载时分配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 ，如下所示

editoptions：{value：“@ ViewBag.GenderTypes”}

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

内联Jqgrid下拉绑定问题

1 个答案: