javascript解析webserver返回的DataSet，DataTable，DataRow
1.首先先web.config中务必内含下列设置
<system.web.extensions>
<scripting>
<webServices>
<jsonSerialization maxJsonLength="50000000">
<converters>
<add name="DataSetConverter" type="Microsoft.Web.Preview.Script.Serialization.Converters.DataSetConverter, Microsoft.Web.Preview, Version=1.0.61025.0, Culture=neutral, PublicKeyToken=31bf3856ad364e35"/>
<add name="DataRowConverter" type="Microsoft.Web.Preview.Script.Serialization.Converters.DataRowConverter, Microsoft.Web.Preview, Version=1.0.61025.0, Culture=neutral, PublicKeyToken=31bf3856ad364e35"/>
<add name="DataTableConverter" type="Microsoft.Web.Preview.Script.Serialization.Converters.DataTableConverter, Microsoft.Web.Preview, Version=1.0.61025.0, Culture=neutral, PublicKeyToken=31bf3856ad364e35"/>
</converters>
</jsonSerialization>
</webServices>
</scripting>
</system.web.extensions>
其实maxJsonLength可以根据所要传输的数据量大小自行加大和减小~~~默认是500
2.在BIN文件夹中添加Microsoft.Web.Preview.dll的引用
配置好以后就可以使用了~~~
前台页面主要代码：
<body>
<form id="form1" runat="server">
<asp:ScriptManager ID="ScriptManager1" runat="server">
<Scripts>
<asp:ScriptReference Path="ClientBehavior.js" />
</Scripts>
<Services>
<asp:ServiceReference Path="WebService.asmx" />
</Services>
</asp:ScriptManager>
<div align="center">
<span style="font-size: medium; font-weight: bold">输入客户编号：</span>
<input id="Text1" type="text" />
<input id="Button1" type="button" value="查询返回DataSet" onclick="GetDataSet()"/>
<input id="Button2" type="button" value="查询返回DataTable" onclick="GetDataTable()"/>
<input id="Button3" type="button" value="查询返回DataRow" onclick="GetDataRow()"/>
<br />
<fieldset>
<legend>查询结果</legend>
<div id="resultcontent">
</div>
</fieldset>
<fieldset>
<legend>全部客户信息<input id="Button4" type="button" value="显示全部客户信息" onclick="GetAll()" /></legend>
<div id="resultall">
</div>
</fieldset>
</div>
</form>
</body>
javascript代码：
/// <reference name="MicrosoftAjax.js"/>
function GetAll()
{
WebService.GetAll(onsuccess,onfaile,"All");
}
function GetDataSet()
{
var id=$get('Text1').value;
if(id=="")
{
alert("请输入编号");
return;
}
WebService.GetDataSet(id,onsuccess,onfaile,"dataset");
}
function GetDataTable()
{
var id=$get('Text1').value;
if(id=="")
{
alert("请输入编号");
return;
}
WebService.GetDataTable(id,onsuccess,onfaile,"datatable");
}
function GetDataRow()
{
var id=$get('Text1').value;
if(id=="")
{
alert("请输入编号");
return;
}
WebService.GetDataRow(id,onsuccess,onfaile,"datarow");
}
function onsuccess(result,usercontent)
{
var resultcontent=$get('resultcontent');
if(usercontent=="All")
{
var resultall=$get("resultall")
if(result.rows==null)
{
resultall.innerHTML="<span>没有结果！</span>";
return;
}
var rows=result.rows;
var name=result.columns[0].name;
var adress=result.columns[1].name;
var builder=new Sys.StringBuilder("<table border=1>");
builder.append(String.format("<tr><td>{0}</td><td>{1}</td></tr>",name,adress));
for(var i=0;i<rows.length;i++)
{
builder.append("<tr><td>"+rows[i][name]+"</td><td>"+rows[i][adress]+"</td></tr>");
}
builder.append("</table>");
resultall.innerHTML=builder.toString();
}
if(usercontent=="dataset")
{
if(result.tables[0].rows==null)
{
resultcontent.innerHTML="<span>没有结果！</span>";
return;
}
//得到行的集合
var rows=result.tables[0].rows;
var name=result.tables[0].columns[0].name;
var adress=result.tables[0].columns[1].name;
var builder=new Sys.StringBuilder("<table border=1>");
builder.append(String.format("<tr><td>{0}</td><td>{1}</td></tr>",name,adress));
for(var i=0;i<rows.length;i++)
{
builder.append("<tr><td>"+rows[i][name]+"</td><td>"+rows[i][adress]+"</td></tr>");
}
builder.append("</table>");
resultcontent.innerHTML=builder.toString();
}
if(usercontent=="datatable")
{
if(result.rows==null)
{
resultcontent.innerHTML="<span>没有结果！</span>";
return;
}
var rows=result.rows;
var name=result.columns[0].name;
var adress=result.columns[1].name;
var builder=new Sys.StringBuilder("<table border=1>");
builder.append(String.format("<tr><td>{0}</td><td>{1}</td></tr>",name,adress));
for(var i=0;i<rows.length;i++)
{
builder.append("<tr><td>"+rows[i][name]+"</td><td>"+rows[i][adress]+"</td></tr>");
}
builder.append("</table>");
resultcontent.innerHTML=builder.toString();
}
if(usercontent=="datarow")
{
if(result==null)
{
resultcontent.innerHTML="<span>没有结果！</span>";
return;
}
var builder=new Sys.StringBuilder("<table border=1>");
builder.append("<tr><td>公司名称</td><td>地址</td></tr>");
builder.append("<tr><td>"+result["公司名称"]+"</td><td>"+result["地址"]+"</td></tr>");
builder.append("</table>");
resultcontent.innerHTML=builder.toString();
}
}
function onfaile(error)
{
var resultcontent=$get('resultcontent');
var stackTrace=error.get_stackTrace();
var message=error.get_message();
var statusCode=error.get_statusCode();
var exceptionType=error.get_exceptionType();
var timedout=error.get_timedOut();
var ReltElem=$get("Results");
resultcontent.innerHTML=
"堆栈追踪：" + stackTrace + "<br/>" +
"服务错误：" + message + "<br/>" +
"状态码：" + statusCode + "<br/>" +
"异常类型：" + exceptionType + "<br/>" +
"超时：" + timedout;
}
if (typeof(Sys) !== 'undefined') Sys.Application.notifyScriptLoaded();
webserver服务代码：
using System;
using System.Collections;
using System.Linq;
using System.Web;
using System.Web.Services;
using System.Web.Services.Protocols;
using System.Xml.Linq;
using System.Data;
using System.Data.SqlClient;
using System.Web.Configuration;
using System.Web.Script.Services;
/// <summary>
///WebService 的摘要说明
/// </summary>
[WebService(Namespace = "http://tempuri.org/")]
[WebServiceBinding(ConformsTo = WsiProfiles.BasicProfile1_1)]
//若要允许使用 ASP.NET AJAX 从脚本中调用此 Web 服务，请取消对下行的注释。
[System.Web.Script.Services.ScriptService]
public class WebService : System.Web.Services.WebService {
public WebService () {
//如果使用设计的组件，请取消注释以下行
//InitializeComponent();
}
[WebMethod]
public DataSet GetDataSet(string id)
{
using (SqlConnection conn = new SqlConnection(WebConfigurationManager.ConnectionStrings["Personal"].ConnectionString))
{
DataSet dataset = new DataSet();
SqlDataAdapter adapter = new SqlDataAdapter("select [公司名称],[地址] from [客户] where [客户编号] = '"+id+"'",conn);
adapter.Fill(dataset, "客户");
return dataset;
}
return null;
}
[WebMethod]
public DataTable GetAll()
{
using (SqlConnection conn = new SqlConnection(WebConfigurationManager.ConnectionStrings["Personal"].ConnectionString))
{
DataSet dataset = new DataSet();
SqlDataAdapter adapter = new SqlDataAdapter("select [客户编号],[地址] from [客户]", conn);
adapter.Fill(dataset, "客户");
DataTable datatable = dataset.Tables[0];
return datatable;
}
return null;
}
[WebMethod]
public DataTable GetDataTable(string id)
{
using (SqlConnection conn = new SqlConnection(WebConfigurationManager.ConnectionStrings["Personal"].ConnectionString))
{
DataSet dataset = new DataSet();
SqlDataAdapter adapter = new SqlDataAdapter("select [公司名称],[地址] from [客户] where [客户编号] = '"+id+"'",conn);
adapter.Fill(dataset, "客户");
DataTable datatable = dataset.Tables[0];
return datatable;
}
return null;
}
[WebMethod]
public DataRow GetDataRow(string id)
{
// 取得 web.config 中的数据库联机字符串设定来创建 SQL 联机对象。
using (SqlConnection cn = new SqlConnection(WebConfigurationManager.ConnectionStrings["Personal"].ConnectionString))
{
SqlCommand SQLCmd = cn.CreateCommand();
// 设定查询语句。
SQLCmd.CommandText =
"select [公司名称],[地址] from [客户] where [客户编号] ='" + id + "'";
// 开启数据库连接并将数据读入数据读取器中。
cn.Open();
using (SqlDataReader dr = SQLCmd.ExecuteReader())
{
if (dr.HasRows)
{
DataTable myTable = new DataTable("客户");
myTable.Load(dr, LoadOption.OverwriteChanges);
return myTable.Rows[0];
}
}
}
return null;
}
}
<system.web.extensions> <scripting> <webServices> <jsonSerialization maxJsonLength="50000000"> <converters> <add name="DataSetConverter" type="Microsoft.Web.Preview.Script.Serialization.Converters.DataSetConverter, Microsoft.Web.Preview, Version=1.0.61025.0, Culture=neutral, PublicKeyToken=31bf3856ad364e35"/> <add name="DataRowConverter" type="Microsoft.Web.Preview.Script.Serialization.Converters.DataRowConverter, Microsoft.Web.Preview, Version=1.0.61025.0, Culture=neutral, PublicKeyToken=31bf3856ad364e35"/> <add name="DataTableConverter" type="Microsoft.Web.Preview.Script.Serialization.Converters.DataTableConverter, Microsoft.Web.Preview, Version=1.0.61025.0, Culture=neutral, PublicKeyToken=31bf3856ad364e35"/> </converters> </jsonSerialization> </webServices> </scripting> </system.web.extensions>2.在BIN文件夹中添加Microsoft.Web.Preview.dll的引用
配置好以后就可以使用了~~~
前台页面主要代码：
<body> <form id="form1" runat="server"> <asp:ScriptManager ID="ScriptManager1" runat="server"> <Scripts>
<asp:ScriptReference Path="ClientBehavior.js" /> </Scripts> <Services> <asp:ServiceReference Path="WebService.asmx" /> </Services> </asp:ScriptManager> <div align="center"> <span style="font-size: medium; font-weight: bold">输入客户编号：</span> <input id="Text1" type="text" /> <input id="Button1" type="button" value="查询返回DataSet" onclick="GetDataSet()"/> <input id="Button2" type="button" value="查询返回DataTable" onclick="GetDataTable()"/> <input id="Button3" type="button" value="查询返回DataRow" onclick="GetDataRow()"/> <br /> <fieldset> <legend>查询结果</legend> <div id="resultcontent"> </div> </fieldset> <fieldset> <legend>全部客户信息<input id="Button4" type="button" value="显示全部客户信息" onclick="GetAll()" /></legend> <div id="resultall"> </div> </fieldset> </div> </form></body>/// <reference name="MicrosoftAjax.js"/>function GetAll(){ WebService.GetAll(onsuccess,onfaile,"All");}function GetDataSet(){ var id=$get('Text1').value; if(id=="") {
alert("请输入编号"); return; } WebService.GetDataSet(id,onsuccess,onfaile,"dataset");}function GetDataTable(){ var id=$get('Text1').value; if(id=="") { alert("请输入编号"); return; } WebService.GetDataTable(id,onsuccess,onfaile,"datatable");}function GetDataRow(){ var id=$get('Text1').value; if(id=="") { alert("请输入编号"); return; } WebService.GetDataRow(id,onsuccess,onfaile,"datarow");}function onsuccess(result,usercontent){ var resultcontent=$get('resultcontent'); if(usercontent=="All") { var resultall=$get("resultall") if(result.rows==null) { resultall.innerHTML="<span>没有结果！</span>"; return; } var rows=result.rows; var name=result.columns[0].name; var adress=result.columns[1].name; var builder=new Sys.StringBuilder("<table border=1>"); builder.append(String.format("<tr><td>{0}</td><td>{1}</td></tr>",name,adress)); for(var i=0;i<rows.length;i++) { builder.append("<tr><td>"+rows[i][name]+"</td><td>"+rows[i][adress]+"</td></tr>"); } builder.append("</table>"); resultall.innerHTML=builder.toString(); } if(usercontent=="dataset") { if(result.tables[0].rows==null) { resultcontent.innerHTML="<span>没有结果！</span>"; return; } //得到行的集合 var rows=result.tables[0].rows; var name=result.tables[0].columns[0].name; var adress=result.tables[0].columns[1].name; var builder=new Sys.StringBuilder("<table border=1>"); builder.append(String.format("<tr><td>{0}</td><td>{1}</td></tr>",name,adress)); for(var i=0;i<rows.length;i++) { builder.append("<tr><td>"+rows[i][name]+"</td><td>"+rows[i][adress]+"</td></tr>"); } builder.append("</table>"); resultcontent.innerHTML=builder.toString(); } if(usercontent=="datatable") { if(result.rows==null) { resultcontent.innerHTML="<span>没有结果！</span>"; return; } var rows=result.rows; var name=result.columns[0].name; var adress=result.columns[1].name; var builder=new Sys.StringBuilder("<table border=1>"); builder.append(String.format("<tr><td>{0}</td><td>{1}</td></tr>",name,adress)); for(var i=0;i<rows.length;i++) { builder.append("<tr><td>"+rows[i][name]+"</td><td>"+rows[i][adress]+"</td></tr>"); } builder.append("</table>"); resultcontent.innerHTML=builder.toString(); } if(usercontent=="datarow") { if(result==null) { resultcontent.innerHTML="<span>没有结果！</span>"; return; } var builder=new Sys.StringBuilder("<table border=1>"); builder.append("<tr><td>公司名称</td><td>地址</td></tr>"); builder.append("<tr><td>"+result["公司名称"]+"</td><td>"+result["地址"]+"</td></tr>"); builder.append("</table>"); resultcontent.innerHTML=builder.toString(); }}function onfaile(error){ var resultcontent=$get('resultcontent'); var stackTrace=error.get_stackTrace(); var message=error.get_message(); var statusCode=error.get_statusCode(); var exceptionType=error.get_exceptionType(); var timedout=error.get_timedOut(); var ReltElem=$get("Results"); resultcontent.innerHTML= "堆栈追踪：" + stackTrace + "<br/>" + "服务错误：" + message + "<br/>" + "状态码：" + statusCode + "<br/>" + "异常类型：" + exceptionType + "<br/>" + "超时：" + timedout;}if (typeof(Sys) !== 'undefined') Sys.Application.notifyScriptLoaded();webserver服务代码：
using System;using System.Collections;using System.Linq;using System.Web;using System.Web.Services;using System.Web.Services.Protocols;using System.Xml.Linq;using System.Data;using System.Data.SqlClient;using System.Web.Configuration;using System.Web.Script.Services;/// <summary>///WebService 的摘要说明/// </summary>[WebService(Namespace = "http://tempuri.org/")][WebServiceBinding(ConformsTo = WsiProfiles.BasicProfile1_1)]//若要允许使用 ASP.NET AJAX 从脚本中调用此 Web 服务，请取消对下行的注释。 [System.Web.Script.Services.ScriptService]public class WebService : System.Web.Services.WebService { public WebService () { //如果使用设计的组件，请取消注释以下行 //InitializeComponent(); } [WebMethod] public DataSet GetDataSet(string id) { using (SqlConnection conn = new SqlConnection(WebConfigurationManager.ConnectionStrings["Personal"].ConnectionString)) { DataSet dataset = new DataSet(); SqlDataAdapter adapter = new SqlDataAdapter("select [公司名称],[地址] from [客户] where [客户编号] = '"+id+"'",conn); adapter.Fill(dataset, "客户"); return dataset; } return null; } [WebMethod] public DataTable GetAll() { using (SqlConnection conn = new SqlConnection(WebConfigurationManager.ConnectionStrings["Personal"].ConnectionString)) { DataSet dataset = new DataSet(); SqlDataAdapter adapter = new SqlDataAdapter("select [客户编号],[地址] from [客户]", conn); adapter.Fill(dataset, "客户"); DataTable datatable = dataset.Tables[0]; return datatable; } return null; } [WebMethod] public DataTable GetDataTable(string id) { using (SqlConnection conn = new SqlConnection(WebConfigurationManager.ConnectionStrings["Personal"].ConnectionString)) { DataSet dataset = new DataSet(); SqlDataAdapter adapter = new SqlDataAdapter("select [公司名称],[地址] from [客户] where [客户编号] = '"+id+"'",conn); adapter.Fill(dataset, "客户"); DataTable datatable = dataset.Tables[0]; return datatable; } return null; } [WebMethod] public DataRow GetDataRow(string id) { // 取得 web.config 中的数据库联机字符串设定来创建 SQL 联机对象。 using (SqlConnection cn = new SqlConnection(WebConfigurationManager.ConnectionStrings["Personal"].ConnectionString)) { SqlCommand SQLCmd = cn.CreateCommand(); // 设定查询语句。 SQLCmd.CommandText = "select [公司名称],[地址] from [客户] where [客户编号] ='" + id + "'"; // 开启数据库连接并将数据读入数据读取器中。 cn.Open(); using (SqlDataReader dr = SQLCmd.ExecuteReader()) { if (dr.HasRows) { DataTable myTable = new DataTable("客户"); myTable.Load(dr, LoadOption.OverwriteChanges); return myTable.Rows[0]; } } } return null; }}
