ASP.NET DataPager下一个/上一个按钮客户端onlick事件

时间:2012-08-24 09:58:00

标签: asp.net onclick datapager

如何将客户端(javascript)onclick事件添加到DataPager中的Next / Previous链接?

2 个答案:

答案 0 :(得分:0)

您可以在数据寻呼机中添加新按钮并处理它的点击事件。

<asp:ListView runat="server" ID="ListView1" 
    DataSourceID="SqlDataSource1">
    <LayoutTemplate>
        <table runat="server" id=" table1">
          <tr runat="server" id="itemPlaceholder">
          </tr>
        </table>
        <!-- This is the pager. Define all necessary markup here. -->
        <asp:DataPager runat="server" ID="DataPager" PageSize="5">
            <Fields>
                <asp:TemplatePagerField>              
                    <PagerTemplate>
                        <asp:Button ID="btn_Submit" runat="server" Text="Button" onclientclick="eventHandler(this)" />
                    </PagerTemplate>
                </asp:TemplatePagerField>
            </Fields>
        </asp:DataPager>
    </LayoutTemplate>
</asp:ListView>

答案 1 :(得分:0)

上面的答案(由Sheery提供)适用于自定义寻呼机元素。但是,当使用ListView或DataGrid的库存数字或下一页/上一页寻呼机样式时,您没有接近尽可能多的控件。通过使用客户端jQuery / javascript选择器,您可以不引人注意地将客户端处理程序附加到寻呼机元素。对于此示例,我正在跟踪是否有任何表单字段值已更改,如果是,则在允许寻呼机执行其回发到服务器的默认行为之前,我们正在向用户确认他们有未保存的更改。

$(function () {

      var _formChanged = false;

      // grabs all pager links in last row of table named dgQuestions
      // and attachs a click eventhandler via jQuery library
      $("#dgQuestions tr:last a").click(function(e) {              
            if (!_formChanged)
                return true;

            var ok = confirm('You have UNSAVED changes. Continue?');
            if (ok) {               
                return true;
            }
            else {
                //Prevent the submit event and remain on the screen
                e.preventDefault();
                return false;
            }
        });

        // delegates change event handling to the form to indicate if ANY
        // form field value changed for testing prior to paging
        $("#form1").change(function(e) {
            _formChanged = true;
        });


    });
});

OR

还可以利用窗口的beforeunload事件来捕获任何导航操作,以测试未保存的更改。此代码不包括实际点击“保存”按钮。

$(window).on('beforeunload', function (e) {
    if (e.originalEvent.explicitOriginalTarget.id != "btnSave") {
        if (_formChanged)
            return 'You have UNSAVED changes. Continue?';
}