如何调用ASP.NET c#方法使用javascript
本文关键字：方法 javascript NET ASP 何调用 调用 | 更新日期: 2023-09-27 18:05:54
有人知道如何使用javascript调用服务器端c#方法吗?我需要做的是停止导入，如果选择取消或继续导入，如果选择ok。我使用visual studio 2010和c#作为我的编程语言
这是我的代码:
private void AlertWithConfirmation()
{
Response.Write(
"<script type='"text/javascript'">" +
"if (window.confirm('Import is currently in progress. Do you want to continue with importation? If yes choose OK, If no choose CANCEL')) {" +
"window.alert('Imports have been cancelled!');" +
"} else {" +
"window.alert('Imports are still in progress');" +
"}" +
"</script>");
}
PageMethod是一种更简单、更快速的Asp。净AJAX通过释放AJAX的强大功能，我们可以轻松地改善用户体验和web应用程序的性能。我最喜欢的AJAX特性之一是PageMethod。
PageMethod是一种可以在java脚本中公开服务器端页面方法的方法。这带来了很多机会，我们可以执行很多操作，而不用使用缓慢和讨厌的回发。
在这篇文章中，我展示了ScriptManager和PageMethod的基本用法。在这个例子中，我创建了一个User Registration表单，用户可以在其中注册他的电子邮件地址和密码。下面是我要开发的页面的标记:<body>
<form id="form1" runat="server">
<div>
<fieldset style="width: 200px;">
<asp:Label ID="lblEmailAddress" runat="server" Text="Email Address"></asp:Label>
<asp:TextBox ID="txtEmail" runat="server"></asp:TextBox>
<asp:Label ID="lblPassword" runat="server" Text="Password"></asp:Label>
<asp:TextBox ID="txtPassword" runat="server"></asp:TextBox>
</fieldset>
<div>
</div>
<asp:Button ID="btnCreateAccount" runat="server" Text="Signup" />
</div>
</form>
</body>
</html>
要设置页面方法，首先你必须在页面上拖动一个脚本管理器。
<asp:ScriptManager ID="ScriptManager1" runat="server" EnablePageMethods="true">
</asp:ScriptManager>
还注意到我已经更改了EnablePageMethods="true"。
这将告诉ScriptManager我将从客户端调用PageMethods。
下一步是创建一个服务器端函数。
这是我创建的函数，这个函数验证用户的输入:
[WebMethod]
public static string RegisterUser(string email, string password)
{
string result = "Congratulations!!! your account has been created.";
if (email.Length == 0)//Zero length check
{
result = "Email Address cannot be blank";
}
else if (!email.Contains(".") || !email.Contains("@")) //some other basic checks
{
result = "Not a valid email address";
}
else if (!email.Contains(".") || !email.Contains("@")) //some other basic checks
{
result = "Not a valid email address";
}
else if (password.Length == 0)
{
result = "Password cannot be blank";
}
else if (password.Length < 5)
{
result = "Password cannot be less than 5 chars";
}
return result;
}
要告诉脚本管理器这个方法可以通过javascript访问，我们需要确保两件事:
首先:这个方法应该是"public static"。
第二:方法上面应该有一个[WebMethod]标签，就像上面代码写的那样。
现在我已经创建了创建帐户的服务器端功能。现在我们必须从客户端调用它。下面是我们如何从客户端调用该函数:
<script type="text/javascript">
function Signup() {
var email = document.getElementById('<%=txtEmail.ClientID %>').value;
var password = document.getElementById('<%=txtPassword.ClientID %>').value;
PageMethods.RegisterUser(email, password, onSucess, onError);
function onSucess(result) {
alert(result);
}
function onError(result) {
alert('Cannot process your request at the moment, please try later.');
}
}
</script>
要调用我的服务器端方法Register user, ScriptManager生成一个代理函数，该函数在PageMethods中可用。
我的服务器端函数有两个参数，即电子邮件和密码，在这些参数之后，我们必须给出两个函数名，如果方法成功执行(第一个参数即onsuccess)或方法失败(第二个参数即result)，它们将运行。
现在一切似乎都准备好了，现在我已经在我的注册按钮上添加了OnClientClick="Signup();return false;"。这里是我的aspx页面的完整代码:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
<title></title>
</head>
<body>
<form id="form1" runat="server">
<div>
<asp:ScriptManager ID="ScriptManager1" runat="server" EnablePageMethods="true">
</asp:ScriptManager>
<fieldset style="width: 200px;">
<asp:Label ID="lblEmailAddress" runat="server" Text="Email Address"></asp:Label>
<asp:TextBox ID="txtEmail" runat="server"></asp:TextBox>
<asp:Label ID="lblPassword" runat="server" Text="Password"></asp:Label>
<asp:TextBox ID="txtPassword" runat="server"></asp:TextBox>
</fieldset>
<div>
</div>
<asp:Button ID="btnCreateAccount" runat="server" Text="Signup" OnClientClick="Signup();return false;" />
</div>
</form>
</body>
</html>
<script type="text/javascript">
function Signup() {
var email = document.getElementById('<%=txtEmail.ClientID %>').value;
var password = document.getElementById('<%=txtPassword.ClientID %>').value;
PageMethods.RegisterUser(email, password, onSucess, onError);
function onSucess(result) {
alert(result);
}
function onError(result) {
alert('Cannot process your request at the moment, please try later.');
}
}
</script>
我认为您需要执行一个Ajax调用。下面是一个由jQuery调用的Ajax示例。代码将用户登录到我的系统，但返回一个bool值，以确定是否成功。注意方法后面代码中的ScriptMethod和WebMethod属性。
在标记: var $Username = $("#txtUsername").val();
var $Password = $("#txtPassword").val();
//Call the approve method on the code behind
$.ajax({
type: "POST",
url: "Pages/Mobile/Login.aspx/LoginUser",
data: "{'Username':'" + $Username + "', 'Password':'" + $Password + "' }", //Pass the parameter names and values
contentType: "application/json; charset=utf-8",
dataType: "json",
async: true,
error: function (jqXHR, textStatus, errorThrown) {
alert("Error- Status: " + textStatus + " jqXHR Status: " + jqXHR.status + " jqXHR Response Text:" + jqXHR.responseText) },
success: function (msg) {
if (msg.d == true) {
window.location.href = "Pages/Mobile/Basic/Index.aspx";
}
else {
//show error
alert('login failed');
}
}
});
In Code Behind:
/// <summary>
/// Logs in the user
/// </summary>
/// <param name="Username">The username</param>
/// <param name="Password">The password</param>
/// <returns>true if login successful</returns>
[WebMethod, ScriptMethod]
public static bool LoginUser( string Username, string Password )
{
try
{
StaticStore.CurrentUser = new User( Username, Password );
//check the login details were correct
if ( StaticStore.CurrentUser.IsAuthentiacted )
{
//change the status to logged in
StaticStore.CurrentUser.LoginStatus = Objects.Enums.LoginStatus.LoggedIn;
//Store the user ID in the list of active users
( HttpContext.Current.Application[ SessionKeys.ActiveUsers ] as Dictionary<string, int> )[ HttpContext.Current.Session.SessionID ] = StaticStore.CurrentUser.UserID;
return true;
}
else
{
return false;
}
}
catch ( Exception ex )
{
return false;
}
}
我将直接使用jQuery提供一个解决方案，这意味着如果您还没有导入库，则需要导入…
在页面标记中导入jQuery库:
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.4.4/jquery.min.js" type="text/javascript"></script>
然后创建另一个*.js脚本文件(我叫我的ExecutePageMethod，因为这是它要暴露的唯一方法)并导入它:
<script type="text/javascript" src="/ExecutePageMethod.js" ></script>
在新添加的文件中，添加以下代码(我记得这是从其他地方拉出来的，所以应该归功于其他人):
function ExecutePageMethod(page, fn, paramArray, successFn, errorFn) {
var paramList = '';
if (paramArray.length > 0) {
for (var i = 0; i < paramArray.length; i += 2) {
if (paramList.length > 0) paramList += ',';
paramList += '"' + paramArray[i] + '":"' + paramArray[i + 1] + '"';
}
}
paramList = '{' + paramList + '}';
$.ajax({
type: "POST",
url: page + "/" + fn,
contentType: "application/json; charset=utf-8",
data: paramList,
dataType: "json",
success: successFn,
error: errorFn
});
}
然后你需要用适当的属性来扩展你的。net page方法，如:
[WebMethod]
[ScriptMethod(ResponseFormat = ResponseFormat.Json)]
public static string MyMethod()
{
return "Yay!";
}
script块或其他脚本文件中，可以调用该方法，如下所示:
ExecutePageMethod("PageName.aspx", "MyMethod", [], OnSuccess, OnFailure);
显然你需要实现OnSuccess和OnFailure方法。
要使用结果，例如在OnSuccess方法中，您可以使用parseJSON方法，如果结果变得更复杂(例如，在返回类型数组的情况下)，该方法将将其解析为对象:
function OnSuccess(result) {
var parsedResult = jQuery.parseJSON(result.d);
}
这个ExecutePageMethod代码特别有用，因为它是可重用的，所以你不需要为你想要执行的每个页面方法管理一个$.ajax调用，你只需要将页面、方法名和参数传递给这个方法。
对于c#开发人员来说，Jayrock RPC库是一个很好的工具，可以以一种熟悉的方式完成此工作。它允许您使用所需的方法创建一个. net类，并将该类作为脚本(以一种迂回的方式)添加到页面中。然后，你可以创建一个你自己的类型的js对象，并像调用其他对象一样调用方法。
它实质上隐藏了ajax实现，并以一种熟悉的格式呈现RPC。请注意，最好的选择确实是使用ASP。. NET MVC和使用jQuery ajax调用动作方法-更简洁，更省事!
有几个选项。你可以使用WebMethod属性。