引言
最早接触到ajax这个名词是在做图书馆系统的时候，那时候我是负责底层EF实体，因为都是现学现用所以很多的时
间都在学习这方面的知识，而负责前台开发的人员在讨论的时候总是在提到ajax这个名词，但是因为自己没有接触过
所以当时非常的好奇这到底是个什么东西？随后在图书馆系统开发完成以后，接手了一个招标项目的开发，这个项目
采用了MVC+EF架构，在看师哥面写的前台的代的时候，基本上都是js代码，js和controller还有页面交互的时候ajax
这个东西再次出现，这次不得不了解了，因为我们需要用到这个东西来完成我们负责的东西，下面就总结一下ajax的
一些基本知识。
ajax是什么？
ajax是指一种创建交互式网页应用的网页开发技术，是一种用于创建快速动态网页的技术。 它通过在后台与服务器
进行少量的数据交换，ajax可以实现异步更新。这意味着可以在不重新加载整个网页的情况下，对网页的某部分进行
更新。而传统的网页如果需要更新内容，必须重新加载整个网页页面。
ajax工作原理
不知道大家看了这样一张图是否对ajax的工作原理有了一定的理解，反正在我们第一次看到这个图的时候没有理
解，因为这张图简直是太抽象太专业了，对于初学者来说理解还是有很大难度的，下面我就结合一端小程序来给大家
通俗的介绍ajax的工作原理。
js代码：
function AddBidTInfo() {
var temp = document.getElementById("BidZNo");
var BidZNo = temp.innerHTML;
//var companyCategory = $("#companyCategory option:selected").text(); //获取选中的项
var companyCategory = $('#companyCategory').combobox('getText')//获取当前选中的值
var companyName = document.getElementById("companyName").value;
var LegalPerson = document.getElementById("LegalPerson").value;
var ProjectPrincipal = document.getElementById("ProjectPrincipal").value;
var Tel = document.getElementById("Tel").value;
//照片没有进行处理
var DelegateLetter = ShowPhoto("preview");
var ApplyPicture = ShowPhoto("previewImag");
//获取委托书照片的名称
$.post("/BidTRecordManager/AddBidTInfo",
{
"BidZNo": BidZNo, "companyCategory": companyCategory, "companyName": companyName,
"LegalPerson": LegalPerson, "ProjectPrincipal": ProjectPrincipal, "Tel": Tel, "DelegateLetter": DelegateLetter, "ApplyPicture": ApplyPicture
}, function (result) {
alert(result);
});
}
controller中的代码：
public string AddBidTInfo()
{
string returnMessage = "添加成功";
var BidZNo = Request["BidZNo"];
var companyType = Request["companyCategory"];
var companyName = Request["companyName"];
var LegalPerson = Request["LegalPerson"];
var ProjectPrincipal = Request["ProjectPrincipal"];
var Tel = Request["Tel"];
var delegateLetter = Request["DelegateLetter"];
var applyPicture = Request["ApplyPicture"];
//var delegateLetter = Request["DelegateLetter"];
BidTRecorderViewModel enBidTRecordVM = new BidTRecorderViewModel
{
BidUserId = Guid.NewGuid(),
CompanyName = companyName,
CompanyCategory = companyType,
LegalPerson=LegalPerson,
ProjectPrincipal = ProjectPrincipal,
Tel = Tel,
//委托书， 报名人照片， 存储方式
// ApplyPicture
DelegateLetter = delegateLetter,
ApplyPicture = applyPicture
};
try
{
iBidTRecordManagerWCF.AddBidTInfo(enBidTRecordVM);
}
catch (Exception r)
{
throw;
}
// iBidTRecordManagerWCF.AddBidTInfo(enBidTRecordVM);
return returnMessage;
}
其实ajax的工作原理简单理解就是双向传值——我们首先从js传递参数到controller里面进行处理，然后自动接收
处理的结果。其实这就是ajax传值的原理。通过
<span style="font-family: KaiTi_GB2312;"> $.post("/BidTRecordManager/AddBidTInfo",</span>
{
"BidZNo": BidZNo, "companyCategory": companyCategory, "companyName": companyName,
"LegalPerson": LegalPerson, "ProjectPrincipal": ProjectPrincipal, "Tel": Tel, "DelegateLetter": DelegateLetter, "ApplyPicture": ApplyPicture
},
将参数传递到BidTRecordManagerController中的AddBidTinfo()这个方法中，在这个方法中用request接收传递的参
数进行处理，然后将结构自动传递到ajax中。
function (result) {
alert(result);
其中的result就是controller中处理的结果，这样我们就实现了双向传值的效果。
ajax的应用优势
ajax最大的优势就是浏览器和web服务器之间使用异步数据传输，这样就可使网页从服务器请求少量的信息，而不是
整个页面。ajax是因特网应用程序更小、更快、更友好。它是独立于web服务器软件的浏览器技术。
小结
在做项目的时候根本就不知道ajax到底是个什么东西，就是按照别人的代码来写，有一天在调错的时候突然就明白
了这个原理，然后就很顺手的写一些代码了，其实学习就是这么个过程，在开始就是不能明白其中的一些知识，然后
在某一天用到的时候也许会突然就明白了，所以我们不必为不会的知识苦恼，早晚有一天我们都会明白了，所以大胆
向前就是了。
版权声明：本文为博主原创文章，未经博主允许不得转载。