第一次使用AJAX,示例对我不起作用

本文关键字:不起作用 AJAX 第一次 | 更新日期: 2023-09-27 18:37:13

我试图使用HTML按钮调用c#类方法。在另一个主题中,人们建议我使用 AJAX。我查看了不同的教程并尝试实现它,但到目前为止它对我不起作用。

现在我只想让按钮给我一个弹出窗口(只是为了让我知道正在调用该方法)我想调用的方法来自类 HomeController

这就是我进行 OnClick 事件的方式

<input type="submit" onclick="setLanguage();" value="submit">

这是脚本部分,我在同一页中有这个

<script type="text/javascript">
function setLanguage() {
var lang = "en";
$.post('@Url.Action("setLang","HomeController")/' + lang,function(){
//i'm not expecting a result to process
});
}
</script>

但是当我点击我的按钮时没有任何反应。

我在这里错过了什么吗?

编辑:函数被调用,但回调未被调用

更新:仍然无法正常工作,这是我当前的代码(根据要求)

按钮(索引.aspx)

<input type="button" onclick="setLanguage();" value="submit">

函数(索引.aspx)

<script type="text/javascript">
function setLanguage() { 
alert("this message shows");       
    $.post('Url.Action("setLang","Home")/?lang=' + lang,
        function (data) {
            alert("this message does not");
        });
 }
</script>

在家庭控制器中.cs

   public JsonResult setLang(string lang)
    {       
        Thread.CurrentThread.CurrentUICulture = CultureInfo.GetCultureInfo(lang);
        .....//a lot more code, until it reaches
        return Json("Language: " + lang);
    }

第一次使用AJAX,示例对我不起作用

将以下内容添加到主控制器的索引视图中:

<input type="button" onclick="setLanguage();" value="submit">
<script type="text/javascript">
    function setLanguage() {
        var lang = "en";
        $.post('@Url.Action("setLang","Home")/?lang=' + lang,
            function (data) {
                alert(data);
        });
    }
</script>

与您的代码相比,我更改了几件事:

  • 输入类型 = 按钮
  • 控制器名称应为"Home",而不是"HomeController"。 ASP.NET MVC默认添加"控制器"部分
  • 成功函数采用数据参数并在客户端计算机上执行 JavaScript 警报。
  • 由于您没有为此特定方法设置路由,因此我已将 lang 参数更改为查询字符串的一部分。

然后在服务器上将以下操作方法添加到主控制器

public JsonResult setLang(string lang)
{
    return Json("Language: " + lang);
}

该函数采用您的 lang 参数,然后返回仅包含简单字符串值的 JsonResult。JSON 是在浏览器和服务器之间发送数据的首选方式。

您可以展开此示例并将更复杂的数据返回到浏览器。

由于您是通过 POST Http 类型调用操作方法的,因此请确保您的操作方法也已准备好响应 HTTPPostType 请求。您可能需要将HttpPost注释添加到操作方法中。

[HttpPost]
public ActionResult setLang(string id)
{
  return Content("MVC is awesome");
}

若要处理来自操作方法的响应,请将回调方法与参数一起使用。在下面的示例中,您将从变量 data 中的操作方法获得响应。

<input type="submit" value="submit">
<script type="text/javascript">
 $(function(){
   $("form").submit(function(e){
    e.preventDefault();  // preventing the default form submit behaviour
       var lang="en"
       $.post("@Url.Action("setLang","Home")/" + lang,function(data){
           alert(data);
       });
   });
 });
</script>