Warning: file_get_contents(/data/phpspider/zhask/data//catemap/2/jquery/85.json): failed to open stream: No such file or directory in /data/phpspider/zhask/libs/function.php on line 167

Warning: Invalid argument supplied for foreach() in /data/phpspider/zhask/libs/tag.function.php on line 1116

Notice: Undefined index: in /data/phpspider/zhask/libs/function.php on line 180

Warning: array_chunk() expects parameter 1 to be array, null given in /data/phpspider/zhask/libs/function.php on line 181
Javascript 获取已单击其按钮的行的键值_Javascript_Jquery_Jqgrid_Jqgrid Asp.net - Fatal编程技术网

Javascript 获取已单击其按钮的行的键值

Javascript 获取已单击其按钮的行的键值,javascript,jquery,jqgrid,jqgrid-asp.net,Javascript,Jquery,Jqgrid,Jqgrid Asp.net,我发现自己需要一个我认为应该是微不足道的要求。我有一个jqGrid,其中每一行都添加了一个自定义按钮。现在我可以将客户端单击事件与之关联,但我想知道单击自定义按钮的行的键值(Id),这样我就可以继续使用此Id并执行我想执行的任何操作 我的jqGrid代码如下 jQuery("#JQGrid").jqGrid({ url: 'http://localhost:55423/JQGrid/JQGridHandler.ashx', datatype: "json",

我发现自己需要一个我认为应该是微不足道的要求。我有一个jqGrid,其中每一行都添加了一个自定义按钮。现在我可以将客户端单击事件与之关联,但我想知道单击自定义按钮的行的键值(Id),这样我就可以继续使用此Id并执行我想执行的任何操作

我的jqGrid代码如下

jQuery("#JQGrid").jqGrid({
        url: 'http://localhost:55423/JQGrid/JQGridHandler.ashx',
        datatype: "json",
        colNames: ['', 'Id', 'First Name', 'Created Date', 'Member Price', 'Non Member Price', 'Complete', 'customButton'],
        colModel: [
                    { name: '', index: '', width: 20, formatter: "checkbox", formatoptions: { disabled: false} },
                    { name: 'Id', index: 'Id', width: 20, stype: 'text', sortable: true, key: true },
                    { name: 'FirstName', index: 'FirstName', width: 120, stype: 'text', sortable: true },
                    { name: 'CreatedDate', index: 'CreatedDate', width: 120, editable: true, sortable: true, hidden: true, editrules: { edithidden: true} },
                    { name: 'MemberPrice', index: 'MemberPrice', width: 120, editable: true, sortable: true },
                    { name: 'NonMemberPrice', index: 'NonMemberPrice', width: 120, align: "right", editable: true, sortable: true },
                    { name: 'Complete', index: 'Complete', width: 60, align: "right", editable: true, sortable: true },
                    { name: 'customButton', index: 'customButton', width: 60, align: "right" }
                  ],
        rowNum: 10,
        loadonce: true,
        rowList: [10, 20, 30],
        pager: '#jQGridPager',
        sortname: 'Id',
        viewrecords: true,
        sortorder: 'desc',
        caption: "List Event Details",
        gridComplete: function () {
            jQuery(".jqgrow td input", "#JQGrid").click(function () {
                //alert(options.rowId);
                alert("Capture this event as required");
            });
        }
    });

    jQuery('#JQGrid').jqGrid('navGrid', '#jQGridPager',
               {
                   edit: true,
                   add: true,
                   del: true,
                   search: true,
                   searchtext: "Search",
                   addtext: "Add",
                   edittext: "Edit",
                   deltext:"Delete"
               },
        {/*EDIT EVENTS AND PROPERTIES GOES HERE*/ },
        {/*ADD EVENTS AND PROPERTIES GOES HERE*/},
            {/*DELETE EVENTS AND PROPERTIES GOES HERE*/},
        {/*SEARCH EVENTS AND PROPERTIES GOES HERE*/}
 ); 

非常感谢您的帮助或任何提示。

您的问题的主要解决方案如下:您需要在
单击
句柄的回调中包含参数,例如
e
。参数具有包含属性的类型。或者,您可以在大多数情况下使用
。拥有
e.target
您可以转到最近的父元素
元素。它的
id
是您需要的值:

jQuery(this)。查找(“.jqgrow td input”)。单击(函数(e){
var rowid=$(e.target).tr.attr(“id”);
警报(rowid);
});
此外,您应该在代码中做一些其他修改来修复一些bug。使用

名称:“”,索引:“”
colModel
中的错误。您应该指定任何非空的唯一名称。例如
name:'mycheck'

接下来,我建议您从
colModel
中删除所有
index
属性。如果使用
loadonce:true
则必须使用与相应的
name
值具有相同值的
index
属性。如果不指定任何
索引
属性,则代码会更小,可读性更好。jqGrid将从相应的
name
值内部复制
index
属性的相应值。同样,您可以删除属性,如
stype:'text',sortable:true
哪些值是默认值(请参阅的
default
列)

下一个问题是,您可能在服务器的JSON响应中包含HTML数据。(例如,
customButton
的格式化程序是看不到的)。这不好。如果网格的文本包含特殊的HTML符号,您可能会遇到问题。我发现在服务器的JSON响应中使用纯数据更好。可以在客户端使用格式化程序等。在这种情况下,可以使用jqGrid的
autoencode:true
选项,对网格中显示的所有文本进行HTML编码。这样,您将拥有更安全的代码,不允许任何注入(例如,在编辑数据期间不包括JavaScript代码)

下一句话:我不建议您使用
gridComplete
loadComplete
的用法更好。关于这个主题,请参见


最后一句重要的话。要处理网格内按钮上的
单击
事件,无需将单独的
单击
句柄绑定到每个按钮。您可以在选择Row
或onCellSelect
回调之前使用一个
。请描述一下。答案使用自定义格式化程序中的
,但
的工作方式完全相同。

另一种可用于检索单击自定义按钮的行id的方法是将格式化程序添加到自定义按钮克隆中

{ name: 'customButton', index: 'customButton', width: 60, align: "right", 
  formatter: function ( cellvalue, options, rowObject ) {

    return "<input type='button' class='custom-button' id='custom"+ rowObject.id +"'/>";
  } 
}

谢谢你花时间写这么全面的答案。知道了。。事实上,我是jqGrid的新手,我被分配了一项任务,就是与jqGrid合作,更好地理解它。。真的是像您这样的程序员,他们真的为StackOverflow增加了价值:)
$('input[id^="custom"]').click(function() {
  var id = this.attr('id').replace("custom", ""); // required row ID
});