Question

我有一个简单的表单，在同一页面上有三个文本框和一个<canvas>，我必须验证这三个字段然后获取发送到javascript函数的值（如果已验证）以绘制图片和一些<canvas>元素内的文本。提交值后，表单和文本框不必消失，因为用户可以使用不同的值尝试不同的结果。我以前做过其他表单，但从未尝试过使用Ajax。我知道我可以使用客户端验证并使用jQuery获取文本框值，但我运行的服务器端代码更多，这将使用这三个值。我怎么能这样做？

Answer 1

在控制器中

创建一个处理结果的方法。我假设这仅用于记录，而不需要实际返回数据。

public useResults(string value1, string value2) 
{
    // ... Do something with the results

    return Json(true);
}

在您看来，找出一种方法来构建上述操作的URL。也许是在一个隐蔽的领域;

@Html.Hidden("useResultsUrl", Url.Action("useResults", "controllerName"))

然后在你的javascript中，将一个click事件附加到按钮，因为你可能已经（触发你的javascript任务）并添加一个ajax调用。

请注意，以下内容使用JQuery，但如果您愿意，可以使用microsoft AJAX;

$(function () {
   $("#button").click(function() {
      $.ajax({
          url: $("input[name='useResultsUrl']").val(), // Get the url from the hidden field
          type: "POST",
          dataType: "JSON",
          data: $("input[type='text']").serialize() // Get the value of the text inputs and serialise them.
      });
   });

   // ... do other stuff 
});

Answer 2

您的View可以使用JQuery对服务器进行ajax调用 - 使用JQuery.post 或JQuery.ajax - 您将控制器操作的Url提供给JQuery方法，它将为您处理AJAX调用。

然后，在您的控制器操作中，您返回一个JsonResult - 它将您的数据序列化为JSON格式：

e.g. return Json( model );

最后，在视图中的JQuery Ajax调用中实现一个成功函数 - 这将使控制器返回的数据可供您随意使用。

C＃ - 获取文本框值并发送到javascript函数

2 个答案: