淡入 div 并执行服务器端方法答案

【问题标题】：Fade div in and execute server side method淡入 div 并执行服务器端方法
【发布时间】：2015-11-25 17:35:39
【问题描述】：

我今天在 asp.net 上苦苦挣扎。我有一个按钮。当这个按钮被按下时，它应该淡入一个 div 并执行一个服务器端方法（获取数据）。我该怎么办？

我的按钮淡入淡出工作，但是当我附加 onclick 或 onserverclick 事件时，它停止工作。我已经尝试过 asp:Button 和 input。

<input id="btnSelectSupplier" type="button" class="btn btn-primary btn-sm " value="Select Supplier" runat="server" onserverclick="btnSelectSupplier_Click" />

要淡入的 div..

<div id="divSelectSupplier" class="ui-widget-content">
        <div class="viewSupplierDetailsHeader">
            <h3>Select Supplier</h3>
            <button type="button" class="btn btn-danger btn-sm pull-right CloseViewSupplierDetails">
                <span class="glyphicon glyphicon-remove" aria-hidden="true"></span>Close
            </button>
        </div>
        <div id="" class="text-center" runat="server">
            <h4>Please Wait..</h4>
        </div>
    </div>

JS方面：

$('#btnSelectSupplier').click(function () {
    var thisResource = $(this).position();
    var left = thisResource.left - 350;
    var top = thisResource.top - 50;
    $("#divSelectSupplier").css("left", left).css("top", top).fadeIn(600);
});

最后，后面的代码：

protected void btnSelectSupplier_Click(object sender, EventArgs e)
    {
        divSelectSupplierContainer.InnerHtml = "<h2>Done.</h2>";
    }

【问题讨论】：

stackoverflow.com/questions/4830095/… 的可能重复项？
没关系，我将使用服务处理程序！

标签： javascript jquery html asp.net

【解决方案1】：

您应该使用 Jquery post 事件将数据发布到服务器，而不是使用服务器 onclick，然后在回调中您可以淡出 div

$('#btnSelectSupplier').click(function () {
    var thisResource = $(this).position();
    var left = thisResource.left - 350;
    var top = thisResource.top - 50;
    $("#divSelectSupplier").css("left", left).css("top", top).fadeIn(600);

    $.post("urlForPost", { //data to post },function(returnData){
       $("#divSelectSupplier").fadeOut(600);
    });
});

【讨论】：