ajax异步调用
Posted zsychanpin
tags:
篇首语：本文由小常识网(cha138.com)小编为大家整理，主要介绍了ajax异步调用相关的知识，希望对你有一定的参考价值。
服务端aspx
<%@ Page Language="C#" AutoEventWireup="true" CodeBehind="RA_PublicityOnLineInfo.aspx.cs" Inherits="HMFW.Web.Pages.SQJS.ResidentsAutonomy.RA_PublicityOnLineInfo" %> <!DOCTYPE html> <html xmlns="http://www.w3.org/1999/xhtml"> <head runat="server"> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <title>网上公示信息管理</title> <script src="/Js/My97DatePicker/WdatePicker.js" type="text/javascript"></script> <script src="/Js/jquery-1.4.1.min.js" type="text/javascript"></script> <script src="/Js/jquerytree/jquery.ztree.core-3.1.min.js" type="text/javascript"></script> <link href="/Js/jquerytree/zTreeStyle/zTreeStyle.css" rel="stylesheet" type="text/css" /> <script src="/Js/jquery.easyui.min.js" type="text/javascript"></script> <script src="/Js/jquery.validate.js" type="text/javascript"></script> <script src="/Js/jquery.form.js" type="text/javascript"></script> <link href="/themes/default/easyui.css" rel="stylesheet" type="text/css" /> <link href="/themes/icon.css" rel="stylesheet" type="text/css" /> <script src="/Js/jquery-loadmask-0.4/jquery.loadmask.min.js" type="text/javascript"></script> <link href="/Js/jquery-loadmask-0.4/jquery.loadmask.css" rel="stylesheet" type="text/css" /> <script src="/Js/edit.js" type="text/javascript"></script> <script src="/Js/Common.js" type="text/javascript"></script> <script src="/Js/Pages/SQJS/ResidentsAutonomy/RA_PublicityOnLineInfo.js" type="text/javascript"></script> </head> <body> <form id="form1" runat="server"> <div> <table id="T_Content" width="100%" border="0" align="center" cellpadding="0" cellspacing="0" class="content02"> <thead> <tr> <td colspan="4" class="content01bt"> <span runat="server" id="acTitle">公示信息</span>[<span runat="server" id="ActionInfo">新增</span>] </td> </tr> </thead> <tbody> <tr> <td nowrap="nowrap" width="13%" class="tdleft"> <span class="red">*</span>公示类别： </td> <td nowrap="nowrap" width="37%" class="tdright"> <asp:DropDownList ID="iTypeCode" runat="server" class="xlk180" ContentEditable="false"> <asp:ListItem Value="1">选举通知</asp:ListItem> <asp:ListItem Value="2">选民登记通知</asp:ListItem> <asp:ListItem Value="3">初步候选人信息</asp:ListItem> <asp:ListItem Value="4">正式候选人信息</asp:ListItem> <asp:ListItem Value="5">正式选举内容和时间</asp:ListItem> <asp:ListItem Value="6">选举结果公示</asp:ListItem> </asp:DropDownList> <asp:HiddenField runat="server" ID="siTypeCode" /> </td> <td>是否公示：</td> <td> <asp:DropDownList ID="iOnLine" runat="server" class="xlk180" ContentEditable="false"> <asp:ListItem Value="1">是</asp:ListItem> <asp:ListItem Value="0">否</asp:ListItem> </asp:DropDownList></td> </tr> <tr> <td nowrap="nowrap" class="tdleft"><span class="red">*</span>公示时间： </td> <td align="left" colspan="3"> <asp:TextBox ID="txt_dPublictityStartTime" runat="server" onclick="WdatePicker()" class="srk80"></asp:TextBox>至<asp:TextBox ID="txt_dPublicityEndTime" runat="server" onclick="WdatePicker()" class="srk80"></asp:TextBox> <asp:HiddenField runat="server" ID="dPublictityStartTime" /> <asp:HiddenField runat="server" ID="dPublicityEndTime" /> </td> </tr> <tr> <td nowrap="nowrap" class="tdleft"> <span class="red">*</span>公示内容： </td> <td nowrap="nowrap" class="tdright" colspan="3"> <asp:TextBox ID="txt_sContent" runat="server" TextMode="MultiLine" class="Memo"></asp:TextBox> <asp:HiddenField runat="server" ID="sContent" /> </td> </tr> <tr> <td nowrap="nowrap" class="tdleft">备注： </td> <td nowrap="nowrap" class="tdright" colspan="3"> <asp:TextBox ID="txt_sMemo" runat="server" TextMode="MultiLine" class="Memo"></asp:TextBox> </td> </tr> </tbody> </table> <div class="tbError" id="LJRYerror"> </div> <table width="100%" height="36" border="0" align="center" cellpadding="0" cellspacing="0"> <tr> <td align="center"> <xhm:xhmButtionEasyUI ID="btn_Save" runat="server" IconTypeSelected="save" OnClientClick="Save(false);return false">保存</xhm:xhmButtionEasyUI> <xhm:xhmButtionEasyUI ID="btn_SaveandAdd" runat="server" IconTypeSelected="save" OnClientClick="Save(true);return false;">保存并新增</xhm:xhmButtionEasyUI> <xhm:xhmButtionEasyUI ID="btn_Return" runat="server" IconTypeSelected="back" OnClientClick="NBack(infoflag);return false;">返回</xhm:xhmButtionEasyUI> </td> </tr> </table> </div> <input type="hidden" id="hidID" runat="server" /> </form> </body> </html>
前端javascript
var infoflag = true; //是否须要给父页面赋值 True 弹出框口 须要 False 打开新页面 不须要
var handleurl = "/Handle/SQJS/ResidentsAutonomy/RA_PublicityOnLine.ashx"; //一般处理程序路径
//http://localhost:56248/Handle/SQJS/ResidentsAutonomy/RA_Candidate.ashx
var candidateHandleUrl = "/Handle/SQJS/ResidentsAutonomy/RA_Candidate.ashx";//确定初步候选人和确定正式候选人
//http://localhost:56248/Handle/SQJS/ResidentsAutonomy/RA_ElectionProject.ashx
var electionProjectHandleUrl = "/Handle/SQJS/ResidentsAutonomy/RA_ElectionProject.ashx";//确认正式选举内容和时间和确认选举结果
var type = getParameter("iType");//页面状态 编辑或者查看
$(function () {
/******隐藏check 操作button*************/
if (type == "view") {
$("#btn_Save").hide();//保存
$("#btn_SaveandAdd").hide();//保存并新增
infoflag = false;//用于查看界面 返回
$("#ActionInfo").text("查看"); //把标识设置为查看
$("#T_Content .red").css({ "display": "none" });//查看去除必填选项标识
$("#T_Content").find("input").attr("disabled", "disabled");//input
$("#T_Content").find("textarea").attr("disabled", "disabled");//textarea
$("#iTypeCode").attr("disabled", "disabled");//公示类别
$("#iOnLine").attr("disabled", "disabled");//是否公示
}
var ID = GetID();
if (ID != "") {
Load(ID);
}
$("#iTypeCode").change(function () {
var checkValue = $("#iTypeCode").val();
var ID = GetID();//网上公示ID
var gProjectID = getParameter("gProjectID");//选举项目ID
if (ID == "") {//相关公式信息表：RA_Candidate RA_ElectionProject View_SQ_RA_ElectionProject_sPreliminaryConfirm View_SQ_RA_ElectionProject_sFormallyConfirm
switch (checkValue) {
case "3"://确定初步候选人【正式确觉得1】
clearFields1();
$.ajax({
type: "POST", //用POST方式传输
dataType: "json", //数据格式:JSON
url: handleurl, //目标地址
data: "action=preliminary&gID=" + gProjectID,
cache: false,
success: function (data) {
//数据获取完成，填充页面据显示
if (data != null && data != "") {
LoadData1(data);
}
},
error: function (XmlHttpRequest, textStatus, errorThrown) { $.messager.alert(‘错误‘, errorThrown, ‘error‘); },
beforeSend: function () {
},
complete: function () {
$("hidLoad").val("1");
}
});
break;
case "4":
clearFields1();
$.ajax({
type: "POST", //用POST方式传输
dataType: "json", //数据格式:JSON
url: handleurl, //目标地址
data: "action=formally&gID=" + gProjectID,
cache: false,
success: function (data) {
//数据获取完成，填充页面据显示
if (data != null && data != "") {
LoadData1(data);
}
},
error: function (XmlHttpRequest, textStatus, errorThrown) { $.messager.alert(‘错误‘, errorThrown, ‘error‘); },
beforeSend: function () {
},
complete: function () {
$("hidLoad").val("1");
}
});
break;
case "5":
clearFields2();
$.ajax({
type: "POST", //用POST方式传输
dataType: "json", //数据格式:JSON
url: electionProjectHandleUrl, //目标地址
data: "action=get&gID=" + gProjectID,
cache: false,
success: function (data) {
//数据获取完成，填充页面据显示
if (data != null && data != "") {
$("#txt_dPublictityStartTime").val(renderTime(data.dStartDate, true));//開始时间dPublictityStartTime
$("#txt_dPublicityEndTime").val(renderTime(data.dEndDate, true));//结束时间
$("#txt_sContent").val(data.sProjectContent);//公示内容
$("#dPublictityStartTime").val(renderTime(data.dStartDate, true));//公示開始时间
$("#dPublicityEndTime").val(renderTime(data.dEndDate, true));//公示结束时间
$("#sContent").val(data.sProjectContent);//公示内容
//$("#txt_sMemo").val(data.sMemo);//备注
}
},
error: function (XmlHttpRequest, textStatus, errorThrown) { $.messager.alert(‘错误‘, errorThrown, ‘error‘); },
beforeSend: function () {
},
complete: function () {
$("hidLoad").val("1");
}
});
break;
case "6":
clearFields2();
$.ajax({
type: "POST", //用POST方式传输
dataType: "json", //数据格式:JSON
url: handleurl, //目标地址
data: "action=getivotecount&gID=" + gProjectID,
cache: false,
success: function (data) {
//数据获取完成，填充页面据显示
if (data != null && data != "") {
$("#txt_dPublictityStartTime").val(renderTime(data.dStartDate, true));//開始时间dPublictityStartTime
$("#txt_dPublicityEndTime").val(renderTime(data.dEndDate, true));//结束时间
$("#txt_sContent").val(data.iVoteCount);//公示内容：现场选举 网上选举 结果汇总
$("#dPublictityStartTime").val(renderTime(data.dStartDate, true));//公示開始时间
$("#dPublicityEndTime").val(renderTime(data.dEndDate, true));//公示结束时间
$("#sContent").val(data.iVoteCount);//公示内容
//$("#txt_sMemo").val(data.sMemo);//备注
}
},
error: function (XmlHttpRequest, textStatus, errorThrown) { $.messager.alert(‘错误‘, errorThrown, ‘error‘); },
beforeSend: function () {
},
complete: function () {
$("hidLoad").val("1");
}
});
break;
default:
clearFields3();
break;
}
} else if (ID != "") {//RA_PublicityOnLine表
Load(ID);
}
});
});
function Load(ID) {
$.ajax({
type: "POST", //用POST方式传输
dataType: "json", //数据格式:JSON
url: handleurl, //目标地址
data: "action=get&gID=" + ID,
cache: false,
success: function (data) {
//数据获取完成，填充页面据显示
if (data != null && data != "") {
LoadData(data);
IsPublicityOnLine(data);//页面载入 设置属性值
}
},
error: function (XmlHttpRequest, textStatus, errorThrown) { $.messager.alert(‘错误‘, errorThrown, ‘error‘); },
beforeSend: function () {
},
complete: function () {
$("hidLoad").val("1");
}
});
}
function IsPublicityOnLine(data) {
$("#iTypeCode").attr("disabled", "disabled");
var iTypeCode = data.iTypeCode;
switch (iTypeCode) {
case 3:
$("#txt_sContent").attr("disabled", "disabled");//正式选举内容
break;
case 4:
$("#txt_sContent").attr("disabled", "disabled");//正式选举内容
break;
case 5:
clearFields2();
case 6:
clearFields2();
break;
default:
break;
}
}
function LoadData(data) {
SetInputValue(data);
$("#txt_dPublictityStartTime").val(renderTime(data.dPublictityStartTime, true));//公示開始时间
$("#txt_dPublicityEndTime").val(renderTime(data.dPublicityEndTime, true));//公示结束时间
$("#dPublicityEndTime").val(renderTime(data.dPublicityEndTime, true));//公示结束时间
$("#dPublictityStartTime").val(renderTime(data.dPublictityStartTime, true));//公示開始时间
$("#sContent").val(data.sContent);
$("#siTypeCode").val(data.iTypeCode);
}
function LoadData1(data) {
$("#txt_sContent").val(data.sCandidatePeopNames);//公示内容
$("#sContent").val(data.sCandidatePeopNames);//公示内容
//$("#txt_sMemo").val(data.sMemo);//备注
}
function CheckInput() {
var result = $("#form1").validate({
rules: {
txt_dPublictityStartTime: {
required: true,
dateISO: true
},
txt_dPublicityEndTime: {
required: true,
dateISO: true
},
txt_sContent: {
required: true,
maxlength: 500
}
}
});
return result.form();
};
function CheckInput1(iTypeCode) {
var result;
if (GetID() == "") {
var gProjectID = getParameter("gProjectID");//选举项目ID
$.ajax({
type: "POST",
url: handleurl,
data: "action=ismanypublicityonline&gProjectID=" + gProjectID + "&iCode=" + iTypeCode,
dataType: "json",
async: false,
error: function (XmlHttpRequest, textStatus, errorThrown) { $.messager.alert(‘错误‘, XmlHttpRequest.responseText, ‘error‘); },
success: function (returnJsonValue) {
if (returnJsonValue.result == false) {
$.messager.alert(‘信息‘, returnJsonValue.data, ‘info‘);
result = returnJsonValue.result.toString();
}
//clearFields(); //清空界面和隐藏域ID
},
beforeSend: function () {
},
complete: function () {
}
});
}
return result;
}
function Save(isDoNew) {
var iTypeCode = $("#iTypeCode").val();//网上公示类型
var action = "add";
var queryString = $(‘#T_Content :input‘).fieldSerialize();
if (GetID() != "") {
action = "edit";
iTypeCode = $("#siTypeCode").val();
}
var sTypeName = "";//公示类别
if (iTypeCode != "") {//公示类别
sTypeName = $("#iTypeCode").find("option:selected").text();
}
queryString += "&sTypeName=" + sTypeName;
if (CheckInput1(iTypeCode) == "false") {//先验证同一个项目不同意有多个同样类别公式! 后验证基础信息
return false;
}
var data = "action=" + action + "&gID=" + GetID() + "&" + queryString + "&gProjectID=" + getParameter("gProjectID"); //
Save_1(isDoNew, handleurl, data, infoflag);
}
function clearFields2() {
//////////////$("#txt_dPublictityStartTime").attr("disabled", "disabled");//開始时间
//////////////$("#txt_dPublicityEndTime").attr("disabled", "disabled");//结束时间
$("#txt_sContent").attr("disabled", "disabled");//正式选举内容
}
//设置界面属性值 确定正式选举内容和时间
function clearFields1() {
//////////$("#txt_dPublictityStartTime").attr("disabled", false);//開始时间
//////////$("#txt_dPublicityEndTime").attr("disabled", false);//结束时间
$("#txt_sContent").attr("disabled", "disabled");
}
function clearFields3() {
$("#iTypeCode").attr("disabled", false);//
//////////$("#txt_dPublictityStartTime").attr("disabled", false);//
//////////$("#txt_dPublicityEndTime").attr("disabled", false);//
$("#txt_sContent").attr("disabled", false);//正式选举内容
SetID(""); //清空ID的隐藏域
$("#txt_dPublictityStartTime").val("");
$("#txt_dPublicityEndTime").val("");
$("#sContent").val("");
$("#txt_sContent").val("");
$("#txt_sMemo").val("");
$("#iOnLine").val("1");
}
function clearFields() {
$("#iTypeCode").attr("disabled", false);//
////////$("#txt_dPublictityStartTime").attr("disabled", false);//
////////$("#txt_dPublicityEndTime").attr("disabled", false);//
$("#txt_sContent").attr("disabled", false);//正式选举内容
SetID(""); //清空ID的隐藏域
$(‘#T_Content :input‘).clearFields(); //清空界面
$("#sContent").val("");
//$("#siTypeCode").val("");
$("#iTypeCode").val("1");
$("#iOnLine").val("1");
}
以上是关于ajax异步调用的主要内容，如果未能解决你的问题，请参考以下文章