第一次使用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);
}
将以下内容添加到主控制器的索引视图中:
<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>