.Net Ajax
1..net ajax显示后台返回值
<script>
$(document).ready(function () {
$("#btn").click(function () {
//var data = new string();
$.ajax({
type: "POST", //要用post方式
url: "WebForm1.aspx/sayHello", //控制器的链接
async: false, //同步提交，一个$.ajax完成之前不会执行下一个$.ajax，当不给async赋值时默认为true，即异步提交，同时执行$.ajax
contentType: "application/json; charset=utf-8",
dataType: "json", //这里需要和接口返回类型一致，不然success无法执行
success: function (data) {
//var tostr = JSON.stringify(data.d);
alert(data.d);
//var tostr = JSON.parse(data.d); //parse用于从一个字符串中解析出json对象
//alert(tostr);//返回的数据用data.d获取内容
//$("#txt").val(tostr);
},
error: function (request) {
alert(JSON.parse(request));
}
});
});
});
</script>
<body>
<input type="button" id="btn" value="验证用户" onclick="loadXMLDoc()"/>
</body>
后台代码
[WebMethod]//web服务的命令 指示这个方法是web服务提供的方法
public static string sayHello()
{
return "1";
}
2. .net ajax显示后台返回值 方法二
function search(url) { //控制器链接，如search('/home/Search')
var searchid = $("#searchid").val();//要传递到控制器的值
$.post(url,
{ "searchid": searchid },//根据url将这些值post过去，多值用逗号分开
function (resData) { //resData是返回值
if (resData.Status == "Y") {
alert("查询成功");
$("#tb").append('<tr><td>' + resData.Data[0] + '</td><td>' + resData.Data[1] + '</td></tr>')
}
else {
alert("查询失败");
}
}
)
}
后台代码如下：
ps需要引用 using Common.JsonHelper;
public ActionResult Search(FormCollection fc) //这个参数是用来接收传递过来的值 { var json = new JsonHelper() { Msg = "", Status = "", ReUrl = "", Data = "" }; string id = fc["searchid"].ToString(); string[] data = { id, "b", "c" }; if (true) { json.Msg = "查询数据成功"; json.Status = "Y"; json.Data = data; } else { json.Msg = "查询数据失败"; json.Status = "N"; } return Json(json); }
3. Net Razor 使用Ajax 异步调用示例
新建一个Razor MVC项目
Nuget安装：Microsoft.jQuery.Unobtrusive.Ajax
以登录为例：
public class LoginController : Controller { // GET: Login public ActionResult Index() { return View(); } [HttpPost] public ActionResult StartLogin(string name,string pwd) { return Content($"{name}-{pwd}");//可以返回其他类型，如：视图/分部视图 } }
Html
@*这里要记得引用进来*@ <script src="~/Scripts/jquery-3.4.1.min.js"></script> <script src="~/Scripts/jquery.unobtrusive-ajax.js"></script> @{ ViewBag.Title = "Index"; Layout = "~/Views/Shared/_Layout.cshtml"; } @using (Ajax.BeginForm("StartLogin", "Login", null, new AjaxOptions() { Confirm = "确认登录?", HttpMethod = "Post", InsertionMode = InsertionMode.Replace, //将返回值替换到show UpdateTargetId = "show", })) { <div class="row"> <div class="col-lg-2">用户名:</div> <div class="col-lg-4"> @Html.TextBox("name") </div> </div> <div class="row"> <div class="col-lg-2">密码:</div> <div class="col-lg-4"> @Html.TextBox("pwd") </div> </div> <div class="row"> <input type="submit" class="btn btn-success" value="登录" /> </div> } <div id="show"></div>
