.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>
【推荐】编程新体验,更懂你的AI,立即体验豆包MarsCode编程助手
【推荐】凌霞软件回馈社区,博客园 & 1Panel & Halo 联合会员上线
【推荐】抖音旗下AI助手豆包,你的智能百科全书,全免费不限次数
【推荐】博客园社区专享云产品让利特惠,阿里云新客6.5折上折
【推荐】轻量又高性能的 SSH 工具 IShell:AI 加持,快人一步