📄 default.aspx
字号:
<%@ Page language="c#" AutoEventWireup="false" Inherits="AJAXDemo.Examples.Dataets._default" %>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html>
<head>
<title>Ajax.NET - DataSet and SQL Server Example</title>
<link rel="stylesheet" type="text/css" href="../../css/main.css"/>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
</head>
<body>
<form id="Form1" method="post" runat="server"></form>
<div class="content">
<h1>DataSet Examples</h1>
<p>The first example will read an XML file form the hard disk and return it as an DataSet object. The XML looks like this:</p>
<pre><?xml version="1.0" standalone="yes"?>
<NewDataSet>
<xs:schema id="NewDataSet" xmlns=""
xmlns:xs="http://www.w3.org/2001/XMLSchema"
xmlns:msdata="urn:schemas-microsoft-com:xml-msdata">
<xs:element name="NewDataSet" msdata:IsDataSet="true" msdata:Locale="de-DE">
<xs:complexType>
<xs:choice maxOccurs="unbounded">
<xs:element name="Table">
<xs:complexType>
<xs:sequence>
<xs:element name="uid" type="xs:short" minOccurs="0" />
<xs:element name="name" type="xs:string" minOccurs="0" />
<xs:element name="type" type="xs:string" minOccurs="0" />
<xs:element name="refdate" type="xs:dateTime" minOccurs="0" />
</xs:sequence>
</xs:complexType>
</xs:element>
</xs:choice>
</xs:complexType>
</xs:element>
</xs:schema>
<Table>
<uid>1</uid>
<name>sysobjects</name>
<type>S </type>
<refdate>2002-12-17T14:36:10.0430000+01:00</refdate>
</Table>
<Table>
<uid>1</uid>
<name>sysindexes</name>
<type>S </type>
<refdate>2002-12-17T14:36:10.0430000+01:00</refdate>
</Table>
<Table>
<uid>1</uid>
<name>syscolumns</name>
<type>S </type>
<refdate>2002-12-17T14:36:10.0430000+01:00</refdate>
</Table>
<Table>
<uid>1</uid>
<name>systypes</name>
<type>S </type>
<refdate>2002-12-17T14:36:10.0430000+01:00</refdate>
</Table>
<Table>
<uid>1</uid>
<name>syscomments</name>
<type>S </type>
<refdate>2002-12-17T14:36:10.0430000+01:00</refdate>
</Table>
</NewDataSet></pre>
<p>On the server-side .NET code I use this C# code to read the file and return it as an DataSet object:</p>
<pre class="csharp">[AjaxMethod]
public DataSet GetDataSet()
{
DataSet ds = new DataSet();
ds.ReadXml(System.Web.HttpContext.Current.Server.MapPath("~/data/dataset.xml"),
XmlReadMode.ReadSchema);
return ds;
}</pre>
<p>On the client-side JavaScript code you get a new Ajax.Web.DataSet object. Using this object you can get the columns and rows for each table inside the dataset. Also you have several methods like .addColumn or .addRow.</p>
<pre class="javascript">function doTest1() {
AJAXDemo.Examples.DataSets.Demo.GetDataSet(_callback1);
}
function _callback1(res) {
var cols = res.value.Tables[0].Columns.length;
var rows = res.value.Tables[0].Rows.length;
alert(cols + " cols and " + rows + " rows");
}</pre>
<p>Click <a href="javascript:doTest1();void(0)">here</a> to get the count of columns and rows for the XML file. You can use the DataAdapter to fill a DataSet from a SQL Server or any other .NET database.</p>
<p>You can use any DataSet object you got from an Ajax.NET method to use it as an argument again. Following JavaScript code will get the DataSet from the first example and use it as an argument:</p>
<pre class="javascript">function doTest3() {
var ds = AJAXDemo.Examples.DataSets.Demo.GetDataSet().value; // sync invoke of GetDataSet
AJAXDemo.Examples.DataSets.Demo.GetXmlFromDataSet(ds, _callback2);
}</pre>
<p>Click <a href="javascript:doTest3();void(0);">here</a> to get the XML source of the DataSet as a string.</p>
<h2>Creating a DataSet on the client-side JavaScript</h2>
<p>With the new version you can create a DataSet directly on the client-side JavaScript code. You may use this objects to save cart items or if you have other items that can be saved in tables. See following JavaScript code that will create a DataSet:</p>
<pre class="javascript">var ds = new Ajax.Web.DataSet();
var dt = new Ajax.Web.DataTable();
dt.addColumn("FirstName", "System.String");
dt.addColumn("Age", "System.Int32");
dt.addRow({"FirstName":"Michael","Age":28});
dt.addRow({"FirstName":"Tanja","Age":25});
ds.addTable(dt);</pre>
<p>In this short example I configure two columns, the first one will hold a string, and the second column Age will use a integer. Now, we can add rows to the DataTable dt. There are two ways to add a new row:</p>
<pre class="javascript">dt.addRow({"FirstName":"Michael","Age":28});
// or using an object
var row = new Object();
row.FirstName = "Michael";
row.Age = 28;
dt.addRow(row);</pre>
<p>Click <a href="javascript:doTest4();void(0);">here</a> to create such a DataSet using JavaScript, send it to a Ajax.NET method and get the XML string back of the DataSet.</p>
<p>You can now save any data on the server that you may collect on the client.</p>
</div>
<p class="footer">Last updated: November 2, 2005 by <a href="http://weblogs.asp.net/mschwarz/contact.aspx" target="_blank">Michael Schwarz</a></p>
<p><a href="http://validator.w3.org/check?uri=referer"><img src="http://www.w3.org/Icons/valid-xhtml10" alt="Valid XHTML 1.0 Transitional" height="31" width="88" /></a></p>
<script type="text/javascript" defer="defer">
function doTest1() {
AJAXDemo.Examples.DataSets.Demo.GetDataSet(_callback1);
}
function doTest2() {
AJAXDemo.Examples.DataSets.Demo.GetSqlServerTable(_callback1);
}
function doTest3() {
var ds = AJAXDemo.Examples.DataSets.Demo.GetDataSet().value; // sync invoke of GetDataSet
AJAXDemo.Examples.DataSets.Demo.GetXmlFromDataSet(ds, _callback2);
}
function doTest4() {
var ds = new Ajax.Web.DataSet();
var dt = new Ajax.Web.DataTable();
dt.addColumn("FirstName", "System.String");
dt.addColumn("Age", "System.Int32");
dt.addRow({"FirstName":"Michael","Age":28});
dt.addRow({"FirstName":"Tanja","Age":25});
ds.addTable(dt);
AJAXDemo.Examples.DataSets.Demo.GetXmlFromDataSet(ds, _callback2);
}
function _callback1(res) {
var cols = res.value.Tables[0].Columns.length;
var rows = res.value.Tables[0].Rows.length;
alert(cols + " cols and " + rows + " rows");
}
function _callback2(res) {
alert(res.value);
}
</script>
</body>
</html>
⌨️ 快捷键说明
复制代码
Ctrl + C
搜索代码
Ctrl + F
全屏模式
F11
切换主题
Ctrl + Shift + D
显示快捷键
?
增大字号
Ctrl + =
减小字号
Ctrl + -