当我需要运行服务器端代码时，如何响应按钮的点击（不提交页面）？

Question

这有点像我的 ASP.NET (Sharepoint) WebPart/page 的第 22 条军规。我需要响应按钮点击，但这样做需要代码在客户端 (jQuery)，因为 server-side/code-behind 似乎只适用于 "Submit" 进程，而且我不想在这种情况下提交页面。

更清楚地说，这是我可以做的一个按钮（一个 HtmlButton，更准确地说），并在不提交表单的情况下响应点击它：

服务器端（C#）：

HtmlButton btnAddFoapalRow = null;
. . .
btnAddFoapalRow = new HtmlButton();
btnAddFoapalRow.Attributes["type"] = "button";
btnAddFoapalRow.InnerHtml = "+"; 
btnAddFoapalRow.ID = "btnAddFoapalRow";
this.Controls.Add(btnAddFoapalRow);

客户端（jQuery）：

$(document).on("click", '[id$=btnAddFoapalRow]', function (e) {
    ... script elided for brevity
});

这很好用。

我可以在服务器端（在 C# 中）为 "submit" 按钮完成所有操作，如下所示：

Button btnSave = new Button();
btnSave.Text = "Save";
btnSave.Click += new EventHandler(btnSave_Click);
this.Controls.Add(btnSave);
. . .

private void btnSave_Click(object sender, EventArgs e)
{
    . . . code elided for brevity
}

但问题的症结在于我需要在不提交表单的情况下响应按钮点击，然后运行 服务器端的一些代码 。我可以满足 jQuery 中的第一个要求（如上所示，使用 HtmlButton btnAddFoapalRow），但我最终需要调用一些 C# 代码来响应点击——我需要在服务器端执行一个操作。

所以我的问题是：如何从客户端代码 "poke" 服务器端代码到 "wake up and call this (some) function"？

也许我可以像这样更新我在 C# 中创建的变量 (HiddenField)：

HiddenField PDFGenBtnClicked = null;
. . .
PDFGenBtnClicked = new HiddenField();
PDFGenBtnClicked.ID = "pdfgenbtnclicked";
PDFGenBtnClicked.Value = "no";
this.Controls.Add(PDFGenBtnClicked);

...来自 jQuery，像这样：

$(document).on("click", '[id$=btnGeneratePDF]', function () {
    $('[id$=pdfgenbtnclicked]').val("yes");
});

..然后在服务器端有这样的代码来启动方法的调用：

if (PDFGenBtnClicked.Value == "yes")
{
    GeneratePDF(listOfListItems);
}

...但是我怎样才能调用这段（最后）代码呢？我可以在页面上放一个计时器，让它每隔一段时间检查一下 PDFGenBtnClicked.Value 的状态吗？这可能是可能的，但几乎可以肯定是戈德堡式的。

谁有更好的主意？

更新

理论上（我认为！）这应该可行（非Ajax 从客户端代码间接运行服务器端代码的方式）：

0) 创建定时器

private Timer tmr = null;

1) 创建"Generate PDF"按钮和定时器：

btnGeneratePDF = new HtmlButton();
btnGeneratePDF.Attributes["type"] = "button";
btnGeneratePDF.InnerHtml = "Generate PDF";
btnGeneratePDF.ID = "btnGeneratePDF ";
this.Controls.Add(btnGeneratePDF);

tmr = new Timer();
tmr.Interval = 3000; // three seconds
tmr.Tick += TickHandler; 
tmr.Enabled = true;

2) 定时器触发时调用方法：

private void TickHandler(object sender, object e)
{
    GeneratePDF(listOfListItems);
}

3) 运行用户选择 "Generate PDF" 按钮时的代码：

private void GeneratePDF(List<ListColumns> listOfListItems)
{
    if (PDFGenBtnClicked.Value != "yes")
    {
        return;
    }
    tmr.Enabled = false; // only run this once, after val has changed to "yes" by the user clicking the "btnGeneratePDF" button (set from "no" to "yes" in jQuery's response to the clicking of the button)
    . . .

但是，我在 GeneratePDF() 的第一行有一个断点，我没有到达它，dod-durn 它。

更新 2

我什至为 init 添加了另一个事件处理程序：

tmr.Tick += TickHandler;
tmr.Init += InitHandler;
tmr.Enabled = true;
message.Text = "Converting the data to a PDF file has been successful";

（我确实看到了消息文本，虽然这不是真的）。

两种方法都有断点：

private void TickHandler(object sender, object e)
{
    GeneratePDF(listOfListItems);
}

private void InitHandler(object sender, object e)
{
    GeneratePDF(listOfListItems);
}

...两者都没有达到。为什么不？从理论上讲，这似乎应该可行......（我知道，理论上一切都可行）。

Answer 1

您的问题的简短回答是您必须使用 ajax，jQuery 有一些关于使用它的信息 - https://learn.jquery.com/ajax/。

更长的答案是你需要做这样的事情：

$(document).on("click", '[id$=btnGeneratePDF]', function () {
    $.get('/some/route/', function(result) {
        //do something with the response, or not depending on your needs
    }
});

我不熟悉 Sharepoint，所以我无法在这方面提供任何帮助，但最基本的是您需要创建一个新页面来触发您的 PDF 生成并使用 ajax，然后以任何适当的方式处理结果。

Answer 2

您想要完成的可以通过网络服务和 ajax 来完成。

Jquery.ajax 可用于向网络服务（或网页，或其他）发送请求。这是我的网站之一的示例：

$.ajax({
    type: "POST",
    contentType: "application/json; charset=utf-8",
    url: "FoamServices.asmx/GetFoamNames",
    data: "{'term':'" + $("#txtFoamName").val() + "'}",
    success: function (data) {
        //whatever you want to do with the data
    },
    error: function (result) {
        alert("Error");
    }
    });

有关此示例的更多信息可在 Jquery.ajax website 找到，但其要点是我设置了一个网络服务，FoamServices.asmx 以及该网络服务中的 GetFoamNames 方法。 GetFoamNames 接受 "term" 作为参数。成功后，我会获取从该网站收到的数据并执行我想要的操作（检查真实值，将其注入页面，等等）。

在服务器端，这是我的网络服务：

[WebService(Namespace = "http://tempuri.org/")]
[WebServiceBinding(ConformsTo = WsiProfiles.BasicProfile1_1)]


[System.Web.Script.Services.ScriptService]
public class FoamServices : System.Web.Services.WebService {

public FoamServices () {

    //Uncomment the following line if using designed components 
    //InitializeComponent(); 
}

[WebMethod]
public string[] GetFoamNames(string term) {
    List<Foam> foams = Foam.Read(term);
    string[] foamNames = new string[foams.Count];
    for(int i = 0; i < foams.Count; i++)
    {
        foamNames[i] = foams[i].FoamName;
    }
    return foamNames;
}

}

这是 Web 服务的基本设置，它还允许它接受来自 javascript (JQuery) 请求的参数。

我的服务所做的是针对数据库查询搜索词并返回结果。这是自动完成 JQuery 框的基本设置。

您可以根据自己的喜好对其进行调整，或者您也可以使用 ajax 调用网页而不是 webservice 并让它执行某些操作。

希望对您有所帮助！

Answer 3

我唯一的建议是，如果您只想刷新页面的一部分而不进行完整的回发，请使用 AJAX、回调或更新面板。更新面板非常简单，但取决于您的按钮实际执行的操作可能不是最佳选择。为了以防万一，这里有一个例子

 <asp:ScriptManager runat="server" ID="sm">
 </asp:ScriptManager>
 <asp:updatepanel runat="server">
     <ContentTemplate>
         <asp:button id="YourButton" runat="server" Text="clickme" onclick="function" />
     </ContentTemplate>
 </asp:updatepanel>

这不会导致完全回发，IMO 比 AJAX 更简单，但根据您的具体情况，我所说的可能不是最合适的解决方案

Here 是一个 link 如果您想阅读它，您可能会从 MSDN 网站上找到有用的东西。

当我需要运行服务器端代码时，如何响应按钮的点击（不提交页面）？

How can I respond to the click of a button (without a submission of the page) when I need to run server-side code?

javascript

c#

asp.net

jquery

sharepoint-2010

更新

更新 2

当我需要 运行 服务器端代码时，如何响应按钮的点击（不提交页面）？

How can I respond to the click of a button (without a submission of the page) when I need to run server-side code?

javascript

c#

asp.net

jquery

sharepoint-2010

更新

更新 2

当我需要运行服务器端代码时，如何响应按钮的点击（不提交页面）？