在 Asp.net webforms 中从 JavaScript/JQuery 调用 C# 函数答案

【问题标题】：Call C# Function From JavaScript/JQuery In Asp.net webforms在 Asp.net webforms 中从 JavaScript/JQuery 调用 C# 函数
【发布时间】：2011-11-18 15:47:51
【问题描述】：

所以，我有一个如下所示的 aspx 页面：

<%@ Page Language="C#" AutoEventWireup="true" CodeFile="Default.aspx.cs" Inherits="_Default" %>

<!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>

    </div>
    </form>
</body>
</html>

我想知道，我如何编写 JavaScript（例如 jQuery）代码来调用我的 C# 代码中的函数。假设这是我的 C# 方法：

protected void XXX(object sender, EventArgs e)
{
    Response.Redirect("pagewho?");
}

再次感谢阿隆。 :)

编辑：

这是我正在使用的完整代码：

<%@ Page Language="C#" AutoEventWireup="true" CodeFile="Default.aspx.cs" Inherits="_Default" %>

<!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>
  <script type="text/javascript">
      validateStuff = function () {
          var isValid = true;
          var txt = document.getElementById("TextBox1");

          if (txt) {
              if (txt.value.toLower() != "james") {
                  isValid = false;
              }
          }
          //perform validation and return true/false
          return isValid;
      }

  </script>
    <form id="form1" runat="server">
    <div>
    <asp:Button ID="Button1" runat="server" OnClientClick="return validateStuff();" OnClick="Button1_Click" />
        <br />
        <br />
        <asp:TextBox ID="TextBox1" runat="server" Height="25px" Width="135px"></asp:TextBox>
        <br />
        <br />
        <br />
    </div>
    </form>
</body>
</html>

但是，无论我在文本框中输入什么内容，它都会返回 true。有什么帮助吗？

【问题讨论】：

检查我的答案，看看它是否对你有帮助:)

标签： c# javascript jquery asp.net webforms

【解决方案1】：

您可以使用脚本中的__doPostBack，并在后面的代码中使用 RaisePostBackEvent 方法来执行您的服务器端逻辑。如果您要进行重定向，这可能是最好的方法。

编辑

如果您希望在单击按钮时在 JavaScript 中进行一些验证，请使用 OnClientClick 执行 JavaScript 验证，如果验证成功则返回 true。

<asp:Button ID="Button1" runat="server" OnClientClick="return validateStuff();" OnClick="Button1_Click" />

您的 JavaScript 验证：

validateStuff = function(){
    var isValid = true;
    var txt = document.getElementById("<%=TextBox1.ClientID%>");
    if (txt.value.toLower() != "james"){
       isValid = false;
    }        
    return isValid;
}

如果validateStuff 函数返回true，将发生回发，您可以在按钮单击事件中处理保存/更新逻辑：

protected void Button1_Click(object sender, EventArgs e)
{
    //save some stuff to the database

    string txtValue = TextBox1.Text.Trim();
}

在 JavaScript 中：

redirectToAnotherPage = function(){
    __doPostBack("<%=SomeServerControl.ClientID%>", "someArgument");
}

在代码隐藏中：

protected override void RaisePostBackEvent(IPostBackEventHandler source, string eventArgument)
{
    //call the RaisePostBack event 
    base.RaisePostBackEvent(source, eventArgument);

    Response.Redirect("anotherpage.aspx");
}

如果您只想将用户带到另一个页面，您也可以这样做：

redirectToAnotherPage = function(){
    window.location.href = "somepage.aspx";
}

【讨论】：

附注 - __doPostBack 不是 JS 函数。当您将 LinkButton 添加到表单时，它会自动生成。实际上__doPostBack 所做的是 - 将一些数据放入隐藏字段并提交表单。所以一般来说你的帖子没有回答 OP 的问题。
你错了。大多数 ASP.NET 控件（Buttons 和 ImageButtons 除外）都使用__doPostBack 来执行回发，这是一种公认且可靠的技术。如果您查看 OP 问题，他们似乎希望从客户端触发 Response.Redirect，而 __doPostBack 是实现这一目标的完全可接受的方式。
OP 并没有尝试Response.Redirect，我猜是这样......并且__doPostBack 与Submit() 不同，它不是内置的JS 函数。正如我所说的__doPostBack 在将一些数据写入隐藏字段后使用Submit()
这取决于您需要验证的内容。它只是简单的验证吗？您能否修改您的问题以包含您需要验证的内容的详细信息？您可以使用 jQuery 对另一个页面执行 AJAX 调用，您可以使用它来执行业务逻辑验证并返回验证状态。另一种选择是在服务器端进行验证，这需要完整的回发或使用 AJAX 的异步回调。
所以。这是工作。但是，如果我需要为我的 C# 函数获取文本框信息呢？ java sciprt能够检查它吗？我以前没有这样做过。你能给我手搭档吗？

【解决方案2】：

为了让客户端代码调用服务器端代码，您可能需要使用AJAX。既然你提到了 jQuery，它就有一个very handy function 来进行调用。但是从 JavaScript 进行调用只是故事的一半，您还需要服务器上的某些东西来监听该调用。如果您打算使用 jQuery（而不是其他选项，例如 AJAX Toolkit），那么我建议不要让该方法“在页面上”，而是作为它自己的资源。我建议使用 HttpHandler 来响应 AJAX 调用。

这里要记住的关键是这在结构上与简单地发回页面有何不同。使用 AJAX，这些调用在页面内异步发生。所以你应该知道的第一件事是Response.Redirect() 在这种情况下不起作用。它将重定向 AJAX 调用，而不是当前打开的页面。可能有一些方法可以使用 ASP.NET 中的回发方法来解决这个问题，但我不得不问......如果你所做的只是重定向，那么为什么不只在客户端做呢？ JavaScript 有足够的能力做到这一点。您可以很容易地在回发时从服务器重定向，但在 JavaScript 中，为什么不让 JavaScript 来做呢？

【讨论】：

函数只是解释了我将要做什么，我想调用一个函数，将 peploe 注册到 SQL，在 js 将检查 thay 写everytig 之后.. 如果你有任何向我展示如何简单的方法..我会喜欢的，谢谢..
听起来您需要在提交表单之前在 JavaScript 中执行一些验证。您是否在单击按钮时执行此操作？如果是，则使用OnClientClick 进行验证，如果验证成功则返回true。返回true会导致回发，可以在按钮点击事件中处理服务端逻辑。
@Alon M：注册过程应该异步进行，还是只进行输入验证？（请记住，输入应该在多个地方进行验证。使用 JavaScript 在页面上验证它以获得流畅的用户体验。在网站的后端代码上验证它以实际验证输入，因为任何客户端都可以更改. 并在数据中验证它（数据访问代码、数据库本身等）以确保数据完整性。）如果注册本身需要异步进行，那么您肯定在查看 AJAX 调用。否则，简单的 JavaScript 就可以了。
我只需要一个 javasciprt 代码来查看用户是否做了他想做的事，输入正确的用户名、密码、年龄等......当他服药时。我需要它来调用我的 C# 代码的函数，这将注册他（她还将检查数据库和所有内容..）
@Alon M：这是在 Stack Overflow 上的一个广泛要求。具体需要异步发生什么？您可以在页面上进行 UI 验证。（有一个 jQuery 插件可以很好地解决这个问题：bassistance.de/jquery-plugins/jquery-plugin-validation）但是你的要求开始变得有点模糊。实际注册是否需要异步进行？或者在发布页面时会发生这种情况吗？（后者更为常见。）我们无法为您编写全部内容，但我们可以帮助您解决您遇到的具体问题。

【解决方案3】：

您可以通过将其设为 webmethod 来调用 C# 方法。请参阅此网址：http://www.xdevsoftware.com/blog/post/Call-WebMethod-from-Javascript-in-ASPNET.aspx 在 Javascript 中是调用 pagemethod。

但是对于您的示例，我建议您只预先填充值 pagewho？当 HTML 由 asp.net 呈现时使用 asp.net 标签。

示例（在 javascript 中）：

GoToLink("<%= YourCodeBehindMethodReturingURLToPutHere() %>");

参考：http://weblogs.asp.net/ahmedmoosa/archive/2010/10/06/embedded-code-and-inline-server-tags.aspx

【讨论】：

【解决方案4】：

使用 JavaScript 从客户端调用 C# 方法的一种方法是使用 webmethods。

您需要在后面的代码中定义一个 public static 方法，并为其添加 [WebMethod] 属性。

在这个例子中，我使用了一个 WebMethod，它以字符串形式从服务器返回当前日期时间：

[WebForm1.aspx.cs]

using System;
using System.Web.Services;

namespace TemplateWebMethod
{
    public partial class WebForm1 : System.Web.UI.Page
    {
        protected void Page_Load(object sender, EventArgs e)
        {

        }

        [WebMethod]
        public static string MyMethod()
        {
            return DateTime.Now.ToString();
        }
    }
}

在 aspx 页面表单中你需要添加一个 asp:ScriptManager 和 EnablePageMethods="true":

[WebForm1.aspx]

<%@ Page Language="C#" AutoEventWireup="true" CodeBehind="WebForm1.aspx.cs" Inherits="TemplateWebMethod.WebForm1" %>

<!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>
    <script type="text/javascript">
      // during onload we set the onclick method of our button
      // to call MyMethod from the server
      window.onload = function(){
        document.getElementById('Button1').onclick = function() {
          PageMethods.MyMethod(myMethodCallBackSuccess, myMethodCallBackFailed);
        }
      }

      function myMethodCallBackSuccess(response) {
          // JavaScript code that will run
          // after MyMethod was run successfully on server
          // respose is the returned value of MyMethod
          alert(response);
      }

      function myMethodCallBackFailed(error) {
          alert(error.get_message());
      }
    </script>
</head>
<body>
    <form id="form1" runat="server">
      <asp:ScriptManager runat="server" EnablePageMethods="true" />
      <asp:Button runat="server" ID="Button1" ClientIDMode="Static" Text="Call MyMethod" UseSubmitBehavior="false" />
    </form>
</body>
</html>

对于按钮 1：

使用了

ClientIDMode="Static"，因此Button1在客户端会有相同的ID，我们可以在添加客户端onclick时轻松搜索。

UseSubmitBehavior="false" 是必需的，因此按下按钮不会导致完整的回发。

在本例中，WebMethod MyMethod 将通过按下 Button1 从代码隐藏中调用，因此我们在 window.onload 上为 Button1 设置 onclick 行为：

window.onload = function(){
  document.getElementById('Button1').onclick = function() {
    PageMethods.MyMethod(myMethodCallBackSuccess, myMethodCallBackFailed);
  }
}

地点：

PageMethods.MyMethod(myMethodCallBackSuccess, myMethodCallBackFailed);

是调用服务器端代码的 JavaScript 方法。

我们需要定义其成功和失败的2个回调方法。

成功时，我们会弹出一条消息，其中包含 MyMethod 的返回值：

function myMethodCallBackSuccess(response) {
    alert(response);
}

失败时，我们会弹出一条带有错误消息的消息：

function myMethodCallBackFailed(error) {
    alert(error.get_message());
}

【讨论】：

【解决方案5】：

<head id="Head1" runat="server">
<script type="text/javascript">

    function checking() {
        var firstTwoChar = document.getElementById('TextBox1').value.substr(0, 2); //getting first two chars
        if (firstTwoChar == 'ok') { //if it starts with 'ok', submit the form to server
            document.forms['form1'].__OK.value = 1; // everything's OK, let the server know it, by writing 1 to hidden input field 
            document.forms['form1'].submit(); // submits to server
        }
        else {
            alert('thats not OK'); //form is not submited, alerting client about the error
        }
}

</script>
<title> </title>
</head>
<body>
<form id="form1" runat="server">
<input type="hidden" name="__OK" id="__EVENTARGUMENT" value="">
<input id="Button111" type="button" value="button" onclick="checking()" />
<asp:TextBox  ID="TextBox1" runat="server"></asp:TextBox>
</form>
</body>
</html>

至于代码隐藏

protected void Page_Load(object sender, EventArgs e)
{
    if (Page.IsPostBack)
    {
        string ok = Request.Form["__OK"]; //getting data from hidden input
        if (ok == "1") // if it's 1 checking succeeded, thus it's ok to save data 
        insertTextBoxValueintoDBTable(TextBox1.Text); //saving data
    }
}

【讨论】：

什么都不懂。对不起，你能解释一下吗？