我有一些JavaScript代码会显示一个模态对话框,要求用户在运行可能需要几秒钟才能运行的Web服务时等待。无法弄清楚的是如何从服务器中运行的C#代码启动JS代码。这是场景:
1)用户点击asp:启动服务器代码的按钮代码。 2)服务器代码[以某种方式]触发一个浏览器事件,该事件启动调用Web服务的JS代码
JS代码如下所示:
<form id="form1" runat="server">
<div>
<script type="text/javascript">
$(function () {
$('#btn_BeginProcessB').click(function (event) {
event.preventDefault();
var $Seconds = $("INPUT[id*='txtSeconds']").val();
var $Message = $("INPUT[id*='txtMessage']").val();
var $WorkingMessage = $('#WorkingMessage');
$WorkingMessage.text($Message);
var $this = $(this);
var $Loader = $('#Loader');
// show loading indicator
$Loader.show();
$("body").css({ background: "#C8C5C5" });
// Begin process
$.ajax({
type: 'POST',
dataType: "json",
contentType: "application/json; charset=utf-8",
data: JSON.stringify({ Seconds: $Seconds }),
url: 'SimpleWebService.asmx/LongRunningProcess',
error: function (xhr, textStatus, errorThrown) {
alert('Error! ' + errorThrown);
// show button
// hide loading indicator
$Loader.hide();
},
success: function (data) {
alert("Data:" + data.d);
// show button
// hide loading indicator
$Loader.hide();
$("body").css({ background: "#FFFFFF" });
}
});
});
});
</script>
<script type="text/javascript">
function LoadPageWorking() {
var $Seconds = $("INPUT[id*='txtSeconds']").val();
var $Message = $("INPUT[id*='txtMessage']").val();
var $WorkingMessage = $('#WorkingMessage');
$WorkingMessage.text($Message);
var $data = JSON.stringify({ Seconds: $Seconds });
PageWorking('Loader', 'SimpleWebService.asmx/LongRunningProcess', $data, PageWorkingSuccess, PageWorkingError);
};
function PageWorkingSuccess(data) {
$("SPAN[id*='lblResult']").html("<br /><b>Result:</b>" + data.d + "<br />");
$('body').css('background', originalBackground);
};
function PageWorkingError(xhr, textStatus, errorThrown) {
alert('Error! ' + errorThrown);
$('body').css('background', originalBackground);
}
</script>
<!--- HTML --->
<div id="Page">
<h1>
Long Running Process Test Page</h1>
<p>
This site demonstrates how to invoke a long running process and let the user know
that the process is underway. When the button is clicked, it calls a web service
that sleeps for the designated number of seconds and returns a message.</p>
<br />
Enter number of seconds for worker process to sleep:
<asp:TextBox ID="txtSeconds" runat="server" Width="25" Text="3" /><br />
Enter the message to be displayed while the process is working:
<asp:TextBox ID="txtMessage" runat="server" Text="Working...(please be patient)"
Width="300px" /><br />
<asp:Label ID="lblResult" runat="server" />
<br />
<input type="button" id="btnBegin" value="Click to test LoadPageWorking function"
onclick="LoadPageWorking();" />
</div>
<div id="Loader">
<center>
<span id="WorkingMessage">Default Loader Message</span>
<div class="ProgressBar-Animated">
</div>
</center>
</div>
</div>
</form>
我可以在C#事件中编写哪些代码来激活LoadPageWorking()JS函数?
答案 0 :(得分:4)
即使您有服务器端按钮控件,也可以使用它的onclientclick
属性直接调用javascript。但是,如果您必须从后面的代码调用脚本,则可以根据您的要求使用ClientScriptManager.RegisterStartupScript()
或ClientScriptManager.RegisterClientScriptBlock()
。那里有很多例子。
答案 1 :(得分:3)
让按钮触发一个页面工作功能,创建一个你正在工作的指示器,触发ajax请求,当它返回完成工作并隐藏指示器。无需再去代码。
答案 2 :(得分:2)
为什么不让你的LoadPageWorking()
启动服务器,然后显示JS模式弹出窗口?您可以让弹出窗口轮询您的服务以确定它是否已完成,并在它出现时自行隐藏。
答案 3 :(得分:1)
您应该尝试使用RegisterClientScriptBlock方法。它允许您动态地将脚本部分添加到页面的源代码中。您可以包含任何您想要的Javascript,包括调用已在页面中定义的方法。