如何使用按钮填充数据而不进行回发

时间:2014-09-23 15:39:31

标签: c# javascript jquery html asp.net

我的GridView中有以下ASP.net按钮:

<asp:Button UseSubmitBehavior="false" runat="server" ID="btnShow" CssClass="btnSearch" Text="View All" CommandName="ViewAll" OnCommand="btnShow_Command" CommandArgument='<%#((GridViewRow)Container).RowIndex%>' />

代码隐藏是:

protected void btnShow_Command(object sender, CommandEventArgs e)
{
    int index = 0;

    if (e.CommandName == "ViewAll")
    {
        index = Convert.ToInt32(e.CommandArgument);

        DataTable cacheTable = HttpContext.Current.Cache["ResultsTable"] as DataTable;

        string column = cacheTable.Rows[index].Field<string>("Guideline");
        string test = BookingResults.Rows[index].Cells[7].Text;
        string html = HttpUtility.HtmlDecode(column);

        ResultsDiv.InnerHtml = html;
    }
}

ResultsDiv使用JQuery弹出窗口显示:

//CONTROLLING EVENTS IN jQuery
$(document).ready(function () {
    //Click the button event!
    $(".btnSearch").click(function (e) {
        alert($(this).val() + " Clicked");
        e.preventDefault();
        //centering with css
        centerPopup();
        //load popup
        loadPopup();
    });
});

当我导航到该页面时,生成的HTML看起来如下(列中有多个行具有相同的按钮):

<input type="button" name="ctl00$ctl33$g_36ed1b14_1f08_43fb_8099_eb3423a33ed9$BookingResults$ctl224$btnShow" value="View All" onclick="javascript:WebForm_DoPostBackWithOptions(new WebForm_PostBackOptions(&quot;ctl00$ctl33$g_36ed1b14_1f08_43fb_8099_eb3423a33ed9$BookingResults$ctl224$btnShow&quot;, &quot;&quot;, true, &quot;&quot;, &quot;&quot;, false, true))" id="ctl00_ctl33_g_36ed1b14_1f08_43fb_8099_eb3423a33ed9_BookingResults_ctl224_btnShow" class="btnSearch" />

现在发生了什么,当我点击View All按钮显示警报时,当我点击确定时,它会显示弹出一瞬间并刷新页面。

如何修改代码隐藏/ JQuery以便我可以单击任何按钮,它会显示警报并每次显示弹出窗口而不进行回发?

1 个答案:

答案 0 :(得分:-1)

我认为即使在警报之前你需要做的第一件事是e.preventDefault();

//CONTROLLING EVENTS IN jQuery
$(document).ready(function () {
    //Click the button event!
    $(".btnSearch").click(function (e) {
        e.preventDefault();
        e.stopproPagation();
        alert($(this).val() + " Clicked");

        //centering with css
        centerPopup();
        //load popup
        loadPopup();
    });
});

正如我认为警报让事件首先执行默认作业。