如何使用jQuery捕获ASP.NET GridView中的“更新”单击事件

前端之家收集整理的这篇文章主要介绍了如何使用jQuery捕获ASP.NET GridView中的“更新”单击事件前端之家小编觉得挺不错的,现在分享给大家,也给大家做个参考。
我需要在asp.net GridView中使用jQuery捕获’Update’单击事件,并且无法知道从哪里开始.我还是jQuery的新手.我的GridView附加到sqlDataSource,当然,它具有组合提供的所有功能.任何帮助将不胜感激.

解决方法

只需在声明GridView后的任何位置添加脚本块,它应该使用默认的非模板化GridView列.代码隐藏中没有代码,因为它纯粹是一个 Javascript解决方案.

如果您使用的是Link-type GridView列,请使用此选项:

  1. <script type="text/javascript">
  2. // a:contains(The text of the link here)
  3. $('#<%= theGridViewID.ClientID %> a:contains(Update)').click(function () {
  4. alert('Update click event captured from the link!');
  5. // return false: stop the postback from happening
  6. // return true or don't return anything: continue with the postback
  7. });
  8. </script>

如果您使用的是Button类型的GridView列并且不希望Javascript阻止回发,请使用此选项:

  1. <script type="text/javascript">
  2. // :button[value=The text of the button here]
  3. $('#<%= theGridViewID.ClientID %> :button[value=Update]').click(function () {
  4. alert('Update click event captured from the button!');
  5. });
  6. </script>

如果您使用的是Button类型的GridView列,并且想要控制是否继续回发,请使用此选项:

  1. <script type="text/javascript">
  2. // :button[value=The text of the button here]
  3. var updateButtons = $('#<%= theGridViewID.ClientID %> :button[value=Update]');
  4. updateButtons
  5. .attr('onclick',null)
  6. .click(function () {
  7. alert('Update click event captured from the button!');
  8. var doPostBack = true; // decide whether to do postback or not
  9. if (doPostBack) {
  10. var index = updateButtons.index($(this));
  11. // 'Update$' refers to the GridView command name + dollar sign
  12. __doPostBack('<%= theGridViewID.UniqueID %>','Update$' + index);
  13. }
  14. });
  15. </script>

更新:我认为这将是替换上面提到的最后一个(第三个)脚本块的更好的解决方案,因为您不需要根据命令名称手动更新__doPostBack函数调用,因此,它应该是不易出错:

  1. <script type="text/javascript">
  2. // :button[value=The text of the button here]
  3. var updateButtons = $('#<%= theGridViewID.ClientID %> :button[value=Update]');
  4. updateButtons.each(function () {
  5. var onclick = $(this).attr('onclick');
  6. $(this).attr('onclick',null).click(function () {
  7. alert('Update click event captured from the button!');
  8. var doPostBack = true; // decide whether to do postback or not
  9. if (doPostBack) {
  10. onclick();
  11. }
  12. });
  13. });
  14. </script>

感谢Aristos这个想法.

猜你在找的jQuery相关文章