javascript - 在没有回发的情况下从 LinkBut​​ton 调用 C# 方法(使用 PageMethod)(MasterPage 网站)

Question

我使用 MasterPage 在 ASP 页面中动态创建了几个 LinkBut​​ton。在一个单独的 JavaScript 文件中，我有一个 JS 函数，它在单击时更改 LinkBut​​ton 的文本，即"is"到“否”，反之亦然。这是一个“喜欢”按钮。因此，当人们单击 LinkBut​​ton 时，页面必须保持静态(否则会很烦人)。 单击 LinkBut​​ton 时必须执行带参数的 C# 方法。

我将此点击属性添加到 LinkBut​​ton，以使用单独 C# 类文件中的方法:

MyLinkButton.Click += (sender, e) => { MyClass.MyClick(par1, par2); };

但问题是，如果我添加以下属性以防止回发并在单击 LinkBut​​ton 时保持页面静态:

MyLinkButton.Attributes.Add("href", "javascript:;");

它不再运行 MyClass 文件中的 MyClick 方法。

所以我尝试从 JS 代码调用 MyClick 方法，该方法使用 PageMethod 在点击时将"is"更改为“否”。

在 MyClass 中我添加了:对 System.Web.Services 的引用并将 [WebMethod] 置于 public static void MyClick() 之上方法。 还在正文/表单内的我的 MasterPage 文件中添加了一个 ScriptManager，并设置了属性 EnablePageMethods="true"。

问题是，无论是否在 LinkBut​​ton 上设置了 ("href", "javascript:;") 属性，PageMethod 都不会调用 MyClass 文件中的 MyClick 方法。我尝试了以下两种方式:

PageMethods.MyClick(par1, par2)

和

PageMethods.MyClass.MyClick(par1, par2)

并且两者都没有触发该方法。我很感激任何意见或建议。

Answer 1

链接按钮的工作方式是，它的 href 指向 __doPostBack JavaScript 方法。这会触发一条消息发送到服务器。由于您已将 href 替换为 javascript:，本质上是“什么都不做”，这解释了您所看到的行为。

如果要在不重新加载页面的情况下向服务器发送数据，则需要使用 AJAX。主要有两种方法，一种是UpdatePanel，大多数人，包括我自己，都会反对这种模式。为什么？那么这样想吧，根据你告诉我的，你有一个“喜欢”按钮。我猜你的服务器端方法需要两条数据，一些标识他们喜欢什么的 ID 和一个表示喜欢或不喜欢的 bool 值。如果您使用 UpdatePanel，整个 ViewState 必须往返于服务器。此外，服务器将使用 UpdatePanel 中所有内容的完整 HTML 内容进行响应。网上有很多不错的文章讲的比较详细，这里是one如果您有兴趣，但我已经总结了要点。如果您正在尝试构建一个轻量级、快速的现代网站，那么这不是可行的方法。如果您想要快速完成某件事并且不想编写 JavaScript，那可能是这样，但是 JavaScript 几乎是现代网络的必需品。

或者，您可以直接使用 AJAX。这要求您在代码后面放置一个方法，用 [WebMethod] 属性修饰。这意味着现在可以通过 AJAX 从 JavaScript 调用它。使用我的示例，您将拥有:

[WebMethod]
public static bool DoLike(string id, bool likeOrNotLike)
{
    // Your implementation
}

现在，你怎么调用它。我建议您使用 jQuery 等框架来调用 AJAX，因为它可以为您简化很多语法。使用 jQuery，您可以简单地执行以下操作:

$.ajax({
    type: "GET",
    url: "MyPage.aspx/DoLike",
    contentType: "application/json; charset=utf-8",
    dataType: "json",
    data: { id: "123", likeOrNotLike: true },
    success: function (msg) {
        alert("It was called successfully");
    },
    error: function () {
        alert("An error occurred calling it");
    }
});

上面的代码向 DoLike 方法发送了两个参数，“123”(ID)和 true(likeOrNotLike)。将使用这些参数调用您的方法，就像您从 C# 调用它一样。该框架负责所有这些工作。

要将 jQuery 添加到您的页面，只需添加:

<script src="http://code.jquery.com/jquery-latest.min.js" type="text/javascript"></script>

如果您反对 jQuery，我可以修改我的答案以直接使用 XMLHTTPRequest，但这更麻烦。

如您所见，尽管 AJAX 并不神奇，您不能简单地将 [WebMethod] 添加到您的事件处理程序并且一切都会正常工作。事实上，如果您走直接的 AJAX 路线，您甚至没有使用事件处理程序，而是直接调用服务器端方法。

您当然可以像其他人在这里建议的那样执行 UpdatePanel，它会起作用。在我和许多其他人看来，这对 AJAX 来说太过分了。这是 Microsoft 在开发人员无需做太多工作的情况下实现 AJAX 的尝试。就像 ViewState 一样，它也是有代价的。价格是否可以接受，由您决定。