onclick 和 onclientclick web 方法在 onclick 之后执行答案

【问题标题】：onclick and onclientclick webmethod executed after onclickonclick 和 onclientclick web 方法在 onclick 之后执行
【发布时间】：2015-06-03 00:41:19
【问题描述】：

我正在尝试使用 web 方法设置一个变量 (.asmx)

按钮使用onclick 调用服务器端方法和onclientclick 调用调用web 方法的javascript ajax。

我需要在调用 onclick 服务器端方法之前完全执行 javascript 代码，但似乎在进行回发之前 ajax 调用没有完全执行。

在回发之前调用警报，但是在回发之后调用网络方法。在回发完成之前，我需要从 webmethod 设置变量。我曾尝试从 javascript 返回一个错误，但回发根本没有完成。

我在 asp.net 中使用 Masterpages。我在另一个项目中也有类似的功能，它工作正常，唯一的区别是我使用的是 MasterPage。

<asp:TemplateField>
<ItemTemplate>
    <asp:Button ID="btnAddRegistration" ClientIDMode="Static" CssClass="btn-sm btn-default" runat="server"
        CommandArgument="<%# ((GridViewRow) Container).RowIndex %>"
        onclick="btnAddRegistration_Click"
        OnClientClick='<%# "getSetContactID(\"" + Container.DataItemIndex + "\")" %>'
        Text="Add &#010;Registration" />
 </ItemTemplate>
</asp:TemplateField>

Javascript（调用网络方法）

 function getSetContactID(rowIndex) {

    var CellValue, cell, dataItemIndex;
    var table = document.getElementById('<%=gvContactSearch.ClientID %>');

    $.ajax({
        type: "POST",
        url: "WebService1.asmx/setContactIDgvContact",
        data: '{DataItemIndex: "' + rowIndex + '"}',
        contentType: "application/json; charset=utf-8",
        dataType: "json",
        success: alert(rowIndex), <--this gets called before postback
        failure: function (response) {alert(response.d);}

        })
 }

网络服务方法

 [WebMethod]
        public string setContactIDGV1(int DataItemIndex){
           classDetails.gV1DataItemIndex = DataItemIndex; 
           return "";
        }

【问题讨论】：

试试这个：从客户端单击getSetContactID方法总是返回false，并在ajax成功事件中显式调用按钮回发方法-stackoverflow.com/questions/1305954/…
尝试在 jquery ajax 中设置 async: false 属性。

标签： javascript c# jquery asp.net ajax

【解决方案1】：

这里有一个经典的竞争条件场景。

默认情况下，AJAX 调用是异步的，因此当您触发 AJAX 调用时，JS 代码块会在逻辑上结束，并触发下一个顺序事件，在这种情况下是您的服务器端事件。然后是 AJAX 代码已执行的函数与您的服务器端 onclick 事件之间的竞争。在我看来，你有几个选择：

点击方法在服务器端调用您的 Web 服务方法
阻止 JS 块 (event.preventDefault) 内的默认元素操作，并在完成序列的 AJAX success 方法内挂上一些东西
在 AJAX 调用中设置 async: false 选项

【讨论】：

async: false 为我做了！