添加编辑链接到JQGrid

时间:2013-04-15 15:24:07

标签: jquery asp.net asp.net-mvc asp.net-mvc-3 jqgrid

我想在JQGrid的每一行中添加编辑链接,并希望在点击该链接时调用控制器的操作。以下是VIEW的详细实现 - .cshtml级别:

<div>  
 @(Html.Trirand().JQGrid(Model.TestGrid, "TestGrid")         
   )

 @(Html.Trirand().JQAutoComplete(
        new JQAutoComplete 
            {
                DisplayMode = AutoCompleteDisplayMode.ControlEditor,
                DataUrl = Url.Action("AutoCompleteShipName","TestGrid")
            }, "AutoComplete")
 )       
 </div>

以下是MODEL级别JQGrid的详细实施。

 public TestModel()
    {
        TestGrid = new JQGrid
        {
            Columns = new List<JQGridColumn>()
                             {
                                  new JQGridColumn { DataField = "ContractNumber", 
                                                    PrimaryKey = false,
                                                    Editable = false,
                                                    Width =250 },
                                 new JQGridColumn { DataField = "Version", 
                                                    PrimaryKey = false,
                                                    Editable = false,
                                                    Width =250 },
                                 new JQGridColumn { DataField = "StartDate", 
                                                    Editable = true,
                                                    Width = 250 },
                                 new JQGridColumn { DataField = "EndDate", 
                                                    Editable = true,
                                                    Width = 350 },
                                 new JQGridColumn { DataField = "Comments", 
                                                    Editable = true,
                                                    Width = 350 },
                                 new JQGridColumn { DataField = "Mfg",
                                                    Editable =  true,  
                                                    Width = 350 },       
                                 new JQGridColumn { DataField = "MfgPart",
                                                    Editable =  true, 
                                                     Width = 250} ,   
                                 new JQGridColumn { DataField = "Vendor",
                                                    Editable =  true, 
                                                    Width = 250} ,  
                                new JQGridColumn { DataField = "CustomerNumber",
                                                    Editable =  true,
                                                     Width = 250} ,  
                             },
            Width = Unit.Pixel(940),
            Height = Unit.Percentage(100)
        };

        TestGrid.ToolBarSettings.ShowRefreshButton = true;
    }

请任何人提供适合上述实施的实施样本/参考。

1 个答案:

答案 0 :(得分:0)

<a id="add" href="javascript:void(0)" title="Add">Add</a>
<a id="edit" href="javascript:void(0)" title="Edit">Edit</a>

<script type="text/javascript">

    $('#add').click(function (event) {
        window.location.href = '@Url.Action("AddEdit")';
    });
    $('#edit').click(function (event) {
        var selRowId = $('TestGrid').jqGrid('getGridParam', 'selrow');
        if (selRowId === null) {
            alert('Please Select data to edit');
            return false;
        } else {
            window.location.href = '@Url.Action("AddEdit")/' + selRowId;
        }
    });
</script>