发行与jqGrid的和jQuery click事件 [英] Issue with jqGrid and jquery click event
问题描述
我加载我的网页上的jqGrid。网格有各行的删除按钮。我试图使用jQuery UI的对话框确认我的删除按钮。
I'm loading a jqGrid on my page. The grid has a Delete button for each row. I'm trying to use the jquery UI dialog confirmation on my Delete button.
下面是我的javascript code：
Here's my javascript code:
<script type="text/javascript">
$(document).ready(function () {
$("#list").jqGrid({
url: '/MyController/MyFunction/',
datatype: 'json',
mtype: 'POST',
colNames: ['', 'Name', ''],
colModel: [
{ name: 'Edit', index: 'Edit', width: 40, align: 'left', sortable: false },
{ name: 'Name', index: 'Name', width: 120, align: 'left' },
{ name: 'Delete', index: 'Delete', width: 50, align: 'left', sortable: false }],
pager: $('#pager'),
rowNum: 10,
rowList: [10, 20, 50],
sortname: 'Name',
sortorder: "asc",
viewrecords: true,
width: 700
});
$("#dialog-confirm").dialog({
autoOpen: false,
modal: true,
buttons: {
"Delete": function () {
window.location.href = $(this).attr("href"); ;
},
Cancel: function () {
$(this).dialog("close");
}
}
});
$("a.confirm").click(function () {
alert("HELLO");
//$("#dialog-confirm").dialog("open");
});
});
</script>
我在将数据传递从我的控制器到电网。我有类确认添加到删除链接的每一行。
I'm passing in data from my controller to the grid. I have the class "confirm" added to the Delete link for each row.
如果我点击我的删除按钮，没有任何反应。链接具有正确的阶级，我所有的JavaScript是正确加载。我把警报在我的document.ready函数的末尾，以确保没有任何错误。
If I click on my Delete button, nothing happens. The link has the correct class, and all my javascript is loading correctly. I placed an alert at the end of my document.ready function to make sure there were no errors.
但是，如果我注释掉我的jqGrid，并添加一个链接到我的网页与类确认，单击事件将触发。
But if I comment out my jqGrid and add a link onto my page with the class "confirm", the click event will fire.
有没有人碰到这个？
推荐答案
，你必须是你试图让点击与 $（A.确认）结合的主要问题。点击（...） 之前元素A.确认被加载。
The main problem which you have is that you try to make 'click' binding with $("a.confirm").click(...) before the elements "a.confirm" are loaded.
您应该要么放在绑定code loadComplete 或内部< A HREF =http://www.trirand.com/jqgridwiki/doku.php?id=wiki%3aevents> gridComplete 事件处理程序或使用的jQuery.live
You should either place the binding code inside of loadComplete or gridComplete event handler or use jQuery.live
$("a.confirm").live('click', function() {
alert("HELLO");
//$("#dialog-confirm").dialog("open");
});
而不是 $（A.确认）。点击（...）。
一个更一般的话。最佳实践与jqGrid的工作是从HTML标记划分的数据。我想您将与＆LT HTML片段;一类=确认＆GT; ...＆LT; / A＆GT;从服务器返回内部的JSON 数据。的jqGrid支持另一个方式来归档相同的结果。您可以1）使用 showlink 格式; 2）使用定义格式它允许创建一个基于网格单元中的任何HTML片段数据（请参阅 rowObject 参数）的行从服务器3）使用非侵入式JavaScript（见的我的回答与的code例如）4）从两个任意组合（请参阅another回答与code为例）。方式3似乎我大多接近你做什么。
One more general remark. The best practice working with jqGrid is dividing data from the HTML markup. I suppose that you place HTML fragment with <a class="confirm">...</a> inside of JSON data returned from the server. jqGrid supports another ways to archive the same results. You can 1) use showlink formatter; 2) use custom formatter which allow create any HTML fragment for the grid cell based on the row of data (see rowObject parameter) returned from the server 3) use unobtrusive JavaScript (see my answer with the code example) 4) any mix from both (see another answer with the code example). The way 3 seems me mostly close to what you do.
在具有HTML标记的JSON数据清楚地分离任何方式还是不错的，不仅是因为设计的原因。它允许另外缩小尺寸的数据从服务器发送。 （见<一href=\"http://stackoverflow.com/questions/4261687/best-way-to-create-a-link-using-jquery/4266076#4266076\">this回答获取更多信息）
In any way having clear separation of JSON data from HTML markup is good not only because of design reason. It allows additionally reduce the size of data send from server. (see this answer for more information)
这篇关于发行与jqGrid的和jQuery click事件的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！
