jqGrid - 编辑函数永远不会被调用

时间:2010-05-13 21:10:45

标签: jquery asp.net-mvc jqgrid

我在使用ASP.NET MVC时遇到了JQGrid的问题。我正在尝试关注this示例(在您转到该链接后,请在页面左侧点击实时数据操作,然后单击编辑行),但我的编辑功能永远不会被调用(即它是从来没有进入$("#bedata").click(function()。有谁知道可能是什么问题?

    <script type="text/javascript">
        var lastsel2;

        jQuery(document).ready(function() {
            jQuery("#editgrid").jqGrid({
                url: '/Home/GetMovieData/',
                datatype: 'json',
                mtype: 'GET',
                colNames: ['id', 'Movie Name', 'Directed By', 'Release Date', 'IMDB Rating', 'Plot', 'ImageURL'],
                colModel: [
                  { name: 'id', index: 'Id', width: 55, sortable: false, hidden: true, editable: false, editoptions: { readonly: true, size: 10} },
                  { name: 'Movie Name', index: 'Name', width: 250, editable: true, editoptions: { size: 10} },
                  { name: 'Directed By', index: 'Director', width: 250, align: 'right', editable: true, editoptions: { size: 10} },
                  { name: 'Release Date', index: 'ReleaseDate', width: 100, align: 'right', editable: true, editoptions: { size: 10} },
                  { name: 'IMDB Rating', index: 'IMDBUserRating', width: 100, align: 'right', editable: true, editoptions: { size: 10} },
                  { name: 'Plot', index: 'Plot', width: 150, hidden: false, editable: true, editoptions: { size: 30} },
                  { name: 'ImageURL', index: 'ImageURL', width: 55, hidden: true, editable: false, editoptions: { readonly: true, size: 10} }
                ],
                pager: jQuery('#pager'),
                rowNum: 5,
                rowList: [5, 10, 20],
                sortname: 'id',
                sortorder: "desc",
                height: '100%',
                width: '100%',
                viewrecords: true,
                imgpath: '/Content/jqGridCss/redmond/images',
                caption: 'Movies from 2008',
                editurl: '/Home/EditMovieData/',
                caption: 'Movie List'
            });
        });

        $("#bedata").click(function() {
            var gr = jQuery("#editgrid").jqGrid('getGridParam', 'selrow');
            if (gr != null)
                jQuery("#editgrid").jqGrid('editGridRow', gr, { height: 280, reloadAfterSubmit: false });
            else
                alert("Hey dork, please select a row");
        });            
    </script>

相关的HTML在这里:

<table id="editgrid">
</table>
<div id="pager" style="text-align: center;">
</div>
<input type="button" id="bedata" value="Edit Selected" />

1 个答案:

答案 0 :(得分:1)

由于我在您的示例代码中没有看到它,您需要在jQuery ready事件中调用所有这些:

jQuery(document).ready(function($) {

    var lastsel2;

    jQuery(document).ready(function() {
    ...
});

否则您的代码可能在DOM准备好之前执行,这可以解释为什么您的click处理程序永远不会被设置。