Ajax实现无刷新的获取数据并绑定到GridView,以及无刷新更新数据

首先是获得数据并绑定好GridView
客户端javascript代码:

function GetPersonnelKPIStep()
2

{
3

var sId=GetParam("c_id");
5

document.getElementById("hId").value=sId;
7

var xmlhttp = new ActiveXObject("MSXML2.XMLHTTP");
9

xmlhttp.Open("post","FmPersonnelKPIData.aspx?MethodName=GetPersonnelKPIStep&c_id="+sId+"&c_sort=",false);
10

xmlhttp.Send();
11

var sGridContent=xmlhttp.responseText;
12

var iStart=sGridContent.indexOf("<table");
14

var iEnd=sGridContent.indexOf("</table>");
15

document.getElementById("divStep").innerHTML= sGridContent.substring(iStart,iEnd+8);
16

}

因为GirdView最后会翻译成Table在浏览器上显示,所以我只要获得返回流中的Table并将其赋给div的innerHTML属性即可
服务端代码:

protected void Page_Load(object sender, EventArgs e)
2

{
3

if (!IsPostBack)
4

{
5

if (sMethodName == "GetPersonnelKPIStep")
6

{
7

GetPersonnelKPIStep(sId, Request.QueryString["c_sort"].ToString());
8

}
9

}

public void GetPersonnelKPIStep(string sId, string sSort)
2

{
3

CWSHr cwsHr = new CWSHr();
4

_DateNum = cwsHr.GetPersonnelKPIDateNum(sId);
5

_kpiDatetime = cwsHr.GetPersonnelKPIDateTime(sId);
6

if (_kpiDatetime == null || _kpiDatetime.Length != 2)
7

return;
8

_StartDate = Convert.ToDateTime(_kpiDatetime[0]);
10

DataSet ds= cwsHr.GetPersonnelKPIStep(sId,sSort);
12

GV_Step.DataSource = ds.Tables[0].DefaultView;
13

GV_Step.DataBind();
14

}

在服务端获得并绑定数据到GridView

获得xml格式的数据:
服务端代码:

public void GetPersonnelKPIStepOne(string sId, string sSort)

{

CWSHr cwsHr = new CWSHr();

DataSet ds = cwsHr.GetPersonnelKPIStep(sId, sSort);

Response.Write(ds.GetXml());

Response.End();

}

注意,Response.End()一定要加上
客户端代码:

var xmlhttp = new ActiveXObject("MSXML2.XMLHTTP");
2

xmlhttp.Open("post","FmPersonnelKPIData.aspx?MethodName=GetPersonnelKPIStepOne&c_id="+sId+"&c_sort="+sSort,false);
3

xmlhttp.Send();
4

var sGridContent=xmlhttp.responseText;
5

//alert(sGridContent);
7

var xmlDom=new ActiveXObject("MSXML2.DOMDocument");
8

xmlDom.loadXML(xmlhttp.responseText);
9

var nodes=xmlDom.selectSingleNode("//NewDataSet/Table").childNodes;
10

if (nodes != null)
11

{
12

for (var i=0;i<nodes.length;i++)
13

{
14

if (nodes[i].nodeName=="c_sort")
15

document.getElementById("ETBSort").value=nodes[i].text;
16

else if (nodes[i].nodeName=="c_type")
17

document.getElementById("ETBType").value=nodes[i].text;
18

else if (nodes[i].nodeName=="c_item")
19

document.getElementById("ETBKpi").value=nodes[i].text;
20

else if (nodes[i].nodeName=="c_st_dt")
21

document.getElementById("ETB_StDt").value=nodes[i].text.substring(0,nodes[i].text.indexOf("T"));
22

else if (nodes[i].nodeName=="c_en_dt")
23

document.getElementById("ETB_EnDt").value=nodes[i].text.substring(0,nodes[i].text.indexOf("T"));
24

else if (nodes[i].nodeName=="c_st_dt_fact")
25

document.getElementById("ETB_StFDt").value=nodes[i].text.substring(0,nodes[i].text.indexOf("T"));
26

else if (nodes[i].nodeName=="c_en_dt_fact")
27

document.getElementById("ETB_EnFDt").value=nodes[i].text.substring(0,nodes[i].text.indexOf("T"));
28

else if (nodes[i].nodeName=="c_result")
29

document.getElementById("ETBFact").value=nodes[i].text;
30

else if (nodes[i].nodeName=="c_propotion")
31

document.getElementById("ETBPropotion").value=nodes[i].text;
32

else if (nodes[i].nodeName=="c_score")
33

document.getElementById("ETBScore").value=nodes[i].text;
34

}
36

}

注意以上获取时间中日期部分的处理

无刷新更新数据:

var xmldoc = new ActiveXObject("MSXML2.DOMDocument");
2

var xmlhttp = new ActiveXObject("MSXML2.XMLHTTP");
3

xmldoc.loadXML("");
4

newNode1 = xmldoc.createElement("NewDataSet");
6

xmldoc.appendChild(newNode1);
7

newNode2 = xmldoc.createElement("tb_o_k_task");
8

newNode1.appendChild(newNode2);
9

newNode = xmldoc.createElement("c_id");
11

newNode.text = document.getElementById('hId').value;
12

newNode2.appendChild(newNode);
13

newNode = xmldoc.createElement("c_sort");
15

newNode.text = document.getElementById('ETBSort').value;
16

newNode2.appendChild(newNode);
17

newNode = xmldoc.createElement("c_item");
19

newNode.text = document.getElementById('ETBKpi').value;
20

newNode2.appendChild(newNode);
21

newNode = xmldoc.createElement("c_type");
23

newNode.text = document.getElementById('ETBType').value;
24

newNode2.appendChild(newNode);
25

newNode = xmldoc.createElement("c_st_dt");
27

newNode.text = document.getElementById('ETB_StDt').value;
28

newNode2.appendChild(newNode);
29

newNode = xmldoc.createElement("c_en_dt");
31

newNode.text = document.getElementById('ETB_EnDt').value;
32

newNode2.appendChild(newNode);
33

newNode = xmldoc.createElement("c_st_dt_fact");
35

newNode.text = document.getElementById('ETB_StFDt').value;
36

newNode2.appendChild(newNode);
37

newNode = xmldoc.createElement("c_en_dt_fact");
39

newNode.text = document.getElementById('ETB_EnFDt').value;
40

newNode2.appendChild(newNode);
41

newNode = xmldoc.createElement("c_propotion");
43

newNode.text = document.getElementById('ETBPropotion').value;
44

newNode2.appendChild(newNode);
45

newNode = xmldoc.createElement("c_result");
47

newNode.text = document.getElementById('ETBFact').value;
48

newNode2.appendChild(newNode);
49

newNode = xmldoc.createElement("c_score");
51

newNode.text = document.getElementById('ETBScore').value;
52

newNode2.appendChild(newNode);
53

xmlhttp.Open("post", "FmPersonnelKPIData.aspx?MethodName=SavePersonnelKPIStep"+"&sAct="+escape(sAct), false);
55

xmlhttp.setRequestHeader("Content-Type","text/xml");
56

xmlhttp.send(xmldoc.xml);
57

首先将要更新的数据构造成一个xml对象,再将这个xml对象做为xmlhttp.send()的参数传给服务端
服务端代码:

public void SavePersonnelKPIStep(string sAct)
2

{
3

System.IO.Stream instream = Page.Request.InputStream;
4

BinaryReader br = new BinaryReader(instream, System.Text.Encoding.UTF8);
5

byte[] byt = br.ReadBytes((int)instream.Length);
6

string sXml = System.Text.Encoding.UTF8.GetString(byt);
7

System.Xml.XmlDocument xmlDoc = new System.Xml.XmlDocument();
9

xmlDoc.LoadXml(sXml);
10

string sid = xmlDoc.SelectSingleNode("//NewDataSet/tb_o_k_task/c_id").InnerText;
12

string ssort = xmlDoc.SelectSingleNode("//NewDataSet/tb_o_k_task/c_sort").InnerText;
13

string sitem = xmlDoc.SelectSingleNode("//NewDataSet/tb_o_k_task/c_item").InnerText;
14

string stype = xmlDoc.SelectSingleNode("//NewDataSet/tb_o_k_task/c_type").InnerText;
15

string sstdt = xmlDoc.SelectSingleNode("//NewDataSet/tb_o_k_task/c_st_dt").InnerText;
16

string sendt = xmlDoc.SelectSingleNode("//NewDataSet/tb_o_k_task/c_en_dt").InnerText;
17

string sstfdt = xmlDoc.SelectSingleNode("//NewDataSet/tb_o_k_task/c_st_dt_fact").InnerText;
18

string senfdt = xmlDoc.SelectSingleNode("//NewDataSet/tb_o_k_task/c_en_dt_fact").InnerText;
19

string spropotion = xmlDoc.SelectSingleNode("//NewDataSet/tb_o_k_task/c_propotion").InnerText;
20

string sresult = xmlDoc.SelectSingleNode("//NewDataSet/tb_o_k_task/c_result").InnerText;
21

string sScore = xmlDoc.SelectSingleNode("//NewDataSet/tb_o_k_task/c_score").InnerText;
22

spropotion = (spropotion == "" ? "1" : spropotion);
24

CWSHr cwsHr = new CWSHr();
26

if (sAct == "修改")
28

{
29

string soldsort = xmlDoc.SelectSingleNode("//NewDataSet/tb_o_k_task/c_oldsort").InnerText;
30

cwsHr.UpdatePersonnelKPIStep(sid, soldsort, ssort, sitem, stype, sstdt,sendt,sstfdt,senfdt, spropotion, sresult,sScore);
31

}
32

else if (sAct == "新增")
33

{
34

cwsHr.SaveNewPersonnelKPIStep(sid, ssort, sitem, stype, sstdt, sendt, sstfdt, senfdt, spropotion, sresult);
35

}
36

}

上面代码的3-6行是获得从客户端传过来的xml.

posted on 2006-08-25 23:05 DoNet鸟阅读(3959) 评论(5) 编辑收藏举报

刷新页面返回顶部

Ajax实现无刷新的获取数据并绑定到GridView,以及无刷新更新数据

导航

公告