UNPKG

jqwidgets-framework

Version:

jQWidgets is an advanced Angular, Vue, Blazor, React, Web Components, jquery, ASP .NET MVC, Custom Elements and HTML5 UI framework.

283 lines (281 loc) 142 kB
<!DOCTYPE html> <html lang="en"> <head> <link rel="stylesheet" href="../../../../Styles/jqx.apireference.css" type="text/css" /> <script type="text/javascript" src="../../../../scripts/jquery-1.11.1.min.js"></script> <script type="text/javascript" src="../../../../scripts/documentation.js"></script> <meta name="keywords" content="jQuery, Button, Toggle Button, Repeat Button, Link Button, Help Documentation" /> <meta name="description" content="This page represents the help documentation of the jqxButton, jqxToggleButton, jqxRepeatButton and jqxLinkButton widgets." /> <title>jqxButton, jqxToggleButton, jqxRepeatButton and jqxLinkButton API Reference</title> <script type="text/javascript"> $(document).ready(function () { $(".documentation-option-type-click").click(function (event) { $(event.target).parents('tr').next().find(".property-content").toggle(); }); }); </script> </head> <body> <div id='buttongroup"'> <div id="properties"> <h2 class="documentation-top-header">Create jqxDataAdapter</h2> <pre><code>var dataAdapter = new $.jqx.dataAdapter(source, settings);</code></pre> <h2 class="documentation-top-header">source</h2> <table class="documentation-table"> <tr> <th>Name </th> <th>Type </th> <th>Default </th> </tr> <tr> <td class="documentation-option-type-click"> <span id='Span19'>columnDelimiter</span> </td> <td> <span>String</span> </td> <td>"\t" when datatype is "tab" and "," when datatype is "csv" </td> </tr> <tr> <td colspan='3' style='width: 100%'> <div class="documentation-option-description property-content" style="display: none;"> <p> Determines the column delimiter when the data source is 'tab' or 'csv'. The default value for 'tab' is '\t' and the default value for 'csv' is ','. </p> </div> </td> </tr> <tr> <td class="documentation-option-type-click"> <span id='Span7'>datafields</span> </td> <td> <span>Array</span> </td> <td>[] </td> </tr> <tr> <td colspan='3' style='width: 100%'> <div class="documentation-option-description property-content" style="display: none;"> <p> An array describing the fields in a particular record. Each datafield must define the following members: </p> <ul> <li>name - A string containing the data field's name.</li> <li>type - A string containing the data field's type. Possible values: 'string', 'date', 'number', 'int', 'float', 'bool'.</li> <li>map(optional) - A mapping to the data field.</li> <li>format(optional) - Sets the data formatting. By setting the format, the jqxDataAdapter plug-in will try to format the data before loading it. Example: { name: 'SubmitDate', type: 'date', format: "yyyy-MM-ddTHH:mm:ss-HH:mm" }</li> <li>values(optional) - determines a foreign collection of values for a datafield. <h4>Code example</h4> <pre style='width: 700px; max-width: 700px; margin: 10px;' class='code'> var employeesSource =<div/> {<div/> datatype: <span style="clear: both; padding: 0px; margin: 0px; color: #a24;">"xml"</span>,<div/> datafields: [<div/> { name: <span style=" clear: both; padding: 0px; margin: 0px; color: #a24;">'FirstName', type: 'string'</span> },<div/> { name: <span style=" clear: both; padding: 0px; margin: 0px; color: #a24;">'LastName', type: 'string'</span> }<div/> ],<div/> root: <span style="clear: both; padding: 0px; margin: 0px; color: #a24;">"Employees"</span>,<div/> record: <span style="clear: both; padding: 0px; margin: 0px; color: #a24;">"Employee"</span>,<div/> id: <span style=" clear: both; padding: 0px; margin: 0px; color: #a24;">'EmployeeID'</span>,<div/> url: <span style="clear: both; padding: 0px; margin: 0px; color: #a24;">"../sampledata/employees.xml"</span>,<div/> async: false<div/> };<div/><div/> var employeesAdapter = new $.jqx.dataAdapter(employeesSource, {<div/> autoBind: true,<div/> beforeLoadComplete: function (records) {<div/> var data = new Array();<div/> // update the loaded records. Dynamically add EmployeeName and EmployeeID fields. <div/> for (var i = 0; i &lt; records.length; i++) {<div/> var employee = records[i];<div/> employee.EmployeeName = employee.FirstName + <span style="clear: both; padding: 0px; margin: 0px; color: #a24;">" "</span> + employee.LastName;<div/> employee.EmployeeID = employee.uid;<div/> data.push(employee);<div/> }<div/> return data;<div/> }<div/> });<div/><div/> // prepare the data<div/> var ordersSource =<div/> {<div/> datatype: <span style="clear: both; padding: 0px; margin: 0px; color: #a24;">"xml"</span>,<div/> datafields: [<div/> // name - determines the field's name.<div/> // value - the field's value in the data source.<div/> // values - specifies the field's values.<div/> // values.source - specifies the foreign source. The expected value is an array.<div/> // values.value - specifies the field's name in the foreign source. <div/> // values.name - specifies the field's value in the foreign source. <div/> // When the ordersAdapter is loaded, each record will have a field called <span style="clear: both; padding: 0px; margin: 0px; color: #a24;">"EmployeeName". The "EmployeeName" for each record comes from the employeesAdapter where the record's "EmployeeID" from orders.xml matches to the "EmployeeID"</span> from employees.xml. <div/> { name: <span style=" clear: both; padding: 0px; margin: 0px; color: #a24;">'EmployeeName', value: 'EmployeeID', values: { source: employeesAdapter.records, value: 'EmployeeID', name: 'EmployeeName'</span> } },<div/> { name: <span style=" clear: both; padding: 0px; margin: 0px; color: #a24;">'EmployeeID', map: 'm\\:properties&gt;d\\:EmployeeID'</span> },<div/> { name: <span style=" clear: both; padding: 0px; margin: 0px; color: #a24;">'ShippedDate', map: 'm\\:properties&gt;d\\:ShippedDate', type: 'date'</span> },<div/> { name: <span style=" clear: both; padding: 0px; margin: 0px; color: #a24;">'Freight', map: 'm\\:properties&gt;d\\:Freight', type: 'float'</span> },<div/> { name: <span style=" clear: both; padding: 0px; margin: 0px; color: #a24;">'ShipName', map: 'm\\:properties&gt;d\\:ShipName'</span> },<div/> { name: <span style=" clear: both; padding: 0px; margin: 0px; color: #a24;">'ShipAddress', map: 'm\\:properties&gt;d\\:ShipAddress'</span> },<div/> { name: <span style=" clear: both; padding: 0px; margin: 0px; color: #a24;">'ShipCity', map: 'm\\:properties&gt;d\\:ShipCity'</span> },<div/> { name: <span style=" clear: both; padding: 0px; margin: 0px; color: #a24;">'ShipCountry', map: 'm\\:properties&gt;d\\:ShipCountry'</span> }<div/> ],<div/> root: <span style="clear: both; padding: 0px; margin: 0px; color: #a24;">"entry"</span>,<div/> record: <span style="clear: both; padding: 0px; margin: 0px; color: #a24;">"content"</span>,<div/> id: <span style=" clear: both; padding: 0px; margin: 0px; color: #a24;">'m\\:properties&gt;d\\:OrderID'</span>,<div/> url: <span style="clear: both; padding: 0px; margin: 0px; color: #a24;">"../sampledata/orders.xml"</span>,<div/> pager: function (pagenum, pagesize, oldpagenum) {<div/> // callback called when a page or page size is changed.<div/> }<div/> };<div/> var ordersAdapter = new $.jqx.dataAdapter(ordersSource);<div/></pre> <h5>employees.xml</h5> <pre style='width: 700px; max-width: 700px; margin: 10px;' class='code'><span style="clear: both; padding: 0px; margin: 0px; color: #11a;">&lt;?xml version=<span style="clear: both; padding: 0px; margin: 0px; color: #a24;">"1.0"</span>?&gt;</span><div/><span style="clear: both; padding: 0px; margin: 0px; color: #11a;">&lt;Employees&gt;</span><div/> <span style="clear: both; padding: 0px; margin: 0px; color: #11a;">&lt;Employee EmployeeID=<span style="clear: both; padding: 0px; margin: 0px; color: #a24;">"5"</span>&gt;</span><div/> <span style="clear: both; padding: 0px; margin: 0px; color: #11a;">&lt;LastName&gt;</span>Buchanan<span style="clear: both; padding: 0px; margin: 0px; color: #11a;">&lt;/LastName&gt;</span><div/> <span style="clear: both; padding: 0px; margin: 0px; color: #11a;">&lt;FirstName&gt;</span>Steven<span style="clear: both; padding: 0px; margin: 0px; color: #11a;">&lt;/FirstName&gt;</span><div/> <span style="clear: both; padding: 0px; margin: 0px; color: #11a;">&lt;Title&gt;</span>Sales Manager<span style="clear: both; padding: 0px; margin: 0px; color: #11a;">&lt;/Title&gt;</span><div/> <span style="clear: both; padding: 0px; margin: 0px; color: #11a;">&lt;TitleOfCourtesy&gt;</span>Mr.<span style="clear: both; padding: 0px; margin: 0px; color: #11a;">&lt;/TitleOfCourtesy&gt;</span><div/> <span style="clear: both; padding: 0px; margin: 0px; color: #11a;">&lt;BirthDate&gt;</span>1955-03-04<span style="clear: both; padding: 0px; margin: 0px; color: #11a;">&lt;/BirthDate&gt;</span><div/> <span style="clear: both; padding: 0px; margin: 0px; color: #11a;">&lt;HireDate&gt;</span>1993-10-17<span style="clear: both; padding: 0px; margin: 0px; color: #11a;">&lt;/HireDate&gt;</span><div/> <span style="clear: both; padding: 0px; margin: 0px; color: #11a;">&lt;Address&gt;</span>14 Garrett Hill<span style="clear: both; padding: 0px; margin: 0px; color: #11a;">&lt;/Address&gt;</span><div/> <span style="clear: both; padding: 0px; margin: 0px; color: #11a;">&lt;City&gt;</span>London<span style="clear: both; padding: 0px; margin: 0px; color: #11a;">&lt;/City&gt;</span><div/> <span style="clear: both; padding: 0px; margin: 0px; color: #11a;">&lt;Region/&gt;</span><div/> <span style="clear: both; padding: 0px; margin: 0px; color: #11a;">&lt;PostalCode&gt;</span>SW1 8JR<span style="clear: both; padding: 0px; margin: 0px; color: #11a;">&lt;/PostalCode&gt;</span><div/> <span style="clear: both; padding: 0px; margin: 0px; color: #11a;">&lt;/Employee&gt;</span><div/><span style="clear: both; padding: 0px; margin: 0px; color: #11a;">&lt;Employees&gt;</span><div/></pre> <h5>orders.xml</h5> <pre style='width: 700px; max-width: 700px; margin: 10px;' class='code'><span style="clear: both; padding: 0px; margin: 0px; color: #11a;">&lt;?xml version=<span style="clear: both; padding: 0px; margin: 0px; color: #a24;">"1.0" encoding="iso-8859-1" standalone="yes"</span>?&gt;</span><div/><span style="clear: both; padding: 0px; margin: 0px; color: #11a;">&lt;feed xml:base=<span style="clear: both; padding: 0px; margin: 0px; color: #a24;">"http://services.odata.org/Northwind/Northwind.svc/" xmlns:d="http://schemas.microsoft.com/ado/2007/08/dataservices" xmlns:m="http://schemas.microsoft.com/ado/2007/08/dataservices/metadata" xmlns="http://www.w3.org/2005/Atom"</span>&gt;</span><div/> <span style="clear: both; padding: 0px; margin: 0px; color: #11a;">&lt;title type=<span style="clear: both; padding: 0px; margin: 0px; color: #a24;">"text"</span>&gt;</span>Orders<span style="clear: both; padding: 0px; margin: 0px; color: #11a;">&lt;/title&gt;</span><div/> <span style="clear: both; padding: 0px; margin: 0px; color: #11a;">&lt;id&gt;</span>http://services.odata.org/Northwind/Northwind.svc/Orders<span style="clear: both; padding: 0px; margin: 0px; color: #11a;">&lt;/id&gt;</span><div/> <span style="clear: both; padding: 0px; margin: 0px; color: #11a;">&lt;updated&gt;</span>2011-12-01T11:55:06Z<span style="clear: both; padding: 0px; margin: 0px; color: #11a;">&lt;/updated&gt;</span><div/> <span style="clear: both; padding: 0px; margin: 0px; color: #11a;">&lt;link rel=<span style="clear: both; padding: 0px; margin: 0px; color: #a24;">"self" title="Orders" href="Orders"</span> /&gt;</span><div/> <span style="clear: both; padding: 0px; margin: 0px; color: #11a;">&lt;entry&gt;</span><div/> <span style="clear: both; padding: 0px; margin: 0px; color: #11a;">&lt;id&gt;</span>http://services.odata.org/Northwind/Northwind.svc/Orders(10248)<span style="clear: both; padding: 0px; margin: 0px; color: #11a;">&lt;/id&gt;</span><div/> <span style="clear: both; padding: 0px; margin: 0px; color: #11a;">&lt;title type=<span style="clear: both; padding: 0px; margin: 0px; color: #a24;">"text"</span>&gt;</span><span style="clear: both; padding: 0px; margin: 0px; color: #11a;">&lt;/title&gt;</span><div/> <span style="clear: both; padding: 0px; margin: 0px; color: #11a;">&lt;updated&gt;</span>2011-12-01T11:55:06Z<span style="clear: both; padding: 0px; margin: 0px; color: #11a;">&lt;/updated&gt;</span><div/> <span style="clear: both; padding: 0px; margin: 0px; color: #11a;">&lt;author&gt;</span><div/> <span style="clear: both; padding: 0px; margin: 0px; color: #11a;">&lt;name /&gt;</span><div/> <span style="clear: both; padding: 0px; margin: 0px; color: #11a;">&lt;/author&gt;</span><div/> <span style="clear: both; padding: 0px; margin: 0px; color: #11a;">&lt;link rel=<span style="clear: both; padding: 0px; margin: 0px; color: #a24;">"edit" title="Order" href="Orders(10248)"</span> /&gt;</span><div/> <span style="clear: both; padding: 0px; margin: 0px; color: #11a;">&lt;link rel=<span style="clear: both; padding: 0px; margin: 0px; color: #a24;">"http://schemas.microsoft.com/ado/2007/08/dataservices/related/Customer" type="application/atom+xml;type=entry" title="Customer" href="Orders(10248)/Customer"</span> /&gt;</span><div/> <span style="clear: both; padding: 0px; margin: 0px; color: #11a;">&lt;link rel=<span style="clear: both; padding: 0px; margin: 0px; color: #a24;">"http://schemas.microsoft.com/ado/2007/08/dataservices/related/Employee" type="application/atom+xml;type=entry" title="Employee" href="Orders(10248)/Employee"</span> /&gt;</span><div/> <span style="clear: both; padding: 0px; margin: 0px; color: #11a;">&lt;link rel=<span style="clear: both; padding: 0px; margin: 0px; color: #a24;">"http://schemas.microsoft.com/ado/2007/08/dataservices/related/Order_Details" type="application/atom+xml;type=feed" title="Order_Details" href="Orders(10248)/Order_Details"</span> /&gt;</span><div/> <span style="clear: both; padding: 0px; margin: 0px; color: #11a;">&lt;link rel=<span style="clear: both; padding: 0px; margin: 0px; color: #a24;">"http://schemas.microsoft.com/ado/2007/08/dataservices/related/Shipper" type="application/atom+xml;type=entry" title="Shipper" href="Orders(10248)/Shipper"</span> /&gt;</span><div/> <span style="clear: both; padding: 0px; margin: 0px; color: #11a;">&lt;category term=<span style="clear: both; padding: 0px; margin: 0px; color: #a24;">"NorthwindModel.Order" scheme="http://schemas.microsoft.com/ado/2007/08/dataservices/scheme"</span> /&gt;</span><div/> <span style="clear: both; padding: 0px; margin: 0px; color: #11a;">&lt;content type=<span style="clear: both; padding: 0px; margin: 0px; color: #a24;">"application/xml"</span>&gt;</span><div/> <span style="clear: both; padding: 0px; margin: 0px; color: #11a;">&lt;m:properties&gt;</span><div/> <span style="clear: both; padding: 0px; margin: 0px; color: #11a;">&lt;d:OrderID m:type=<span style="clear: both; padding: 0px; margin: 0px; color: #a24;">"Edm.Int32"</span>&gt;</span>10248<span style="clear: both; padding: 0px; margin: 0px; color: #11a;">&lt;/d:OrderID&gt;</span><div/> <span style="clear: both; padding: 0px; margin: 0px; color: #11a;">&lt;d:CustomerID&gt;</span>VINET<span style="clear: both; padding: 0px; margin: 0px; color: #11a;">&lt;/d:CustomerID&gt;</span><div/> <span style="clear: both; padding: 0px; margin: 0px; color: #11a;">&lt;d:EmployeeID m:type=<span style="clear: both; padding: 0px; margin: 0px; color: #a24;">"Edm.Int32"</span>&gt;</span>5<span style="clear: both; padding: 0px; margin: 0px; color: #11a;">&lt;/d:EmployeeID&gt;</span><div/> <span style="clear: both; padding: 0px; margin: 0px; color: #11a;">&lt;d:OrderDate m:type=<span style="clear: both; padding: 0px; margin: 0px; color: #a24;">"Edm.DateTime"</span>&gt;</span>1996-07-04T00:00:00<span style="clear: both; padding: 0px; margin: 0px; color: #11a;">&lt;/d:OrderDate&gt;</span><div/> <span style="clear: both; padding: 0px; margin: 0px; color: #11a;">&lt;d:RequiredDate m:type=<span style="clear: both; padding: 0px; margin: 0px; color: #a24;">"Edm.DateTime"</span>&gt;</span>1996-08-01T00:00:00<span style="clear: both; padding: 0px; margin: 0px; color: #11a;">&lt;/d:RequiredDate&gt;</span><div/> <span style="clear: both; padding: 0px; margin: 0px; color: #11a;">&lt;d:ShippedDate m:type=<span style="clear: both; padding: 0px; margin: 0px; color: #a24;">"Edm.DateTime"</span>&gt;</span>1996-07-16T00:00:00<span style="clear: both; padding: 0px; margin: 0px; color: #11a;">&lt;/d:ShippedDate&gt;</span><div/> <span style="clear: both; padding: 0px; margin: 0px; color: #11a;">&lt;d:ShipVia m:type=<span style="clear: both; padding: 0px; margin: 0px; color: #a24;">"Edm.Int32"</span>&gt;</span>3<span style="clear: both; padding: 0px; margin: 0px; color: #11a;">&lt;/d:ShipVia&gt;</span><div/> <span style="clear: both; padding: 0px; margin: 0px; color: #11a;">&lt;d:Freight m:type=<span style="clear: both; padding: 0px; margin: 0px; color: #a24;">"Edm.Decimal"</span>&gt;</span>32.3800<span style="clear: both; padding: 0px; margin: 0px; color: #11a;">&lt;/d:Freight&gt;</span><div/> <span style="clear: both; padding: 0px; margin: 0px; color: #11a;">&lt;d:ShipName&gt;</span>Vins et alcools Chevalier<span style="clear: both; padding: 0px; margin: 0px; color: #11a;">&lt;/d:ShipName&gt;</span><div/> <span style="clear: both; padding: 0px; margin: 0px; color: #11a;">&lt;d:ShipAddress&gt;</span>59 rue de l'Abbaye<span style="clear: both; padding: 0px; margin: 0px; color: #11a;">&lt;/d:ShipAddress&gt;</span><div/> <span style="clear: both; padding: 0px; margin: 0px; color: #11a;">&lt;d:ShipCity&gt;</span>Reims<span style="clear: both; padding: 0px; margin: 0px; color: #11a;">&lt;/d:ShipCity&gt;</span><div/> <span style="clear: both; padding: 0px; margin: 0px; color: #11a;">&lt;d:ShipRegion m:null=<span style="clear: both; padding: 0px; margin: 0px; color: #a24;">"true"</span> /&gt;</span><div/> <span style="clear: both; padding: 0px; margin: 0px; color: #11a;">&lt;d:ShipPostalCode&gt;</span>51100<span style="clear: both; padding: 0px; margin: 0px; color: #11a;">&lt;/d:ShipPostalCode&gt;</span><div/> <span style="clear: both; padding: 0px; margin: 0px; color: #11a;">&lt;d:ShipCountry&gt;</span>France<span style="clear: both; padding: 0px; margin: 0px; color: #11a;">&lt;/d:ShipCountry&gt;</span><div/> <span style="clear: both; padding: 0px; margin: 0px; color: #11a;">&lt;/m:properties&gt;</span><div/> <span style="clear: both; padding: 0px; margin: 0px; color: #11a;">&lt;/content&gt;</span><div/> <span style="clear: both; padding: 0px; margin: 0px; color: #11a;">&lt;/entry&gt;</span><div/><span style="clear: both; padding: 0px; margin: 0px; color: #11a;">&lt;/feed&gt;</span><div/></pre> </li> </ul> </div> </td> </tr> <tr> <td class="documentation-option-type-click"> <span id='Span1'>data</span> </td> <td> <span>Object</span> </td> <td>{} </td> </tr> <tr> <td colspan='3' style='width: 100%'> <div class="documentation-option-description property-content" style="display: none;"> <p> Data to be sent to the server. The expected value is JSON Object. </p> <h4>Code example</h4> <pre><code> var source = { datatype: "jsonp", datafields: [ { name: 'countryName' }, { name: 'name' }, { name: 'population', type: 'float' }, { name: 'continentCode' } ], url: "http://api.geonames.org/searchJSON", data: { featureClass: "P", style: "full", maxRows: 50, username: "jqwidgets" } }; </code></pre> </div> </td> </tr> <tr> <td class="documentation-option-type-click"> <span id='Span2'>datatype</span> </td> <td> <span>String</span> </td> <td>String </td> </tr> <tr> <td colspan='3' style='width: 100%'> <div class="documentation-option-description property-content" style="display: none;"> <p> The data's type. Possible values: 'xml', 'json', 'jsonp', 'tsv', 'csv', 'local', 'array', 'observablearray'. </p> </div> </td> </tr> <tr> <td class="documentation-option-type-click"> <span id='Span3'>type</span> </td> <td> <span>String</span> </td> <td>"GET" </td> </tr> <tr> <td colspan='3' style='width: 100%'> <div class="documentation-option-description property-content" style="display: none;"> <p> The type of request to make ("POST" or "GET"), default is "GET". </p> </div> </td> </tr> <tr> <td class="documentation-option-type-click"> <span id='Span4'>id</span> </td> <td> <span>String</span> </td> <td>"" </td> </tr> <tr> <td colspan='3' style='width: 100%'> <div class="documentation-option-description property-content" style="display: none;"> <p> A string containing the Id data field. </p> </div> </td> </tr> <tr> <td class="documentation-option-type-click"> <span id='Span31'>localdata</span> </td> <td> <span>Array or String</span> </td> <td>[] </td> </tr> <tr> <td colspan='3' style='width: 100%'> <div class="documentation-option-description property-content" style="display: none;"> <p> You can set the <code>localdata</code> to a Javascript Array or String of data. Use the <code>localdata</code> only when you want to load local data. If you want to load data from a File or Remote data source, use <code>url</code> instead. </p> </div> </td> </tr> <tr> <td class="documentation-option-type-click"> <span id='Span18'>mapChar</span> </td> <td> <span>String</span> </td> <td>">" </td> </tr> <tr> <td colspan='3' style='width: 100%'> <div class="documentation-option-description property-content" style="display: none;"> <p> Determines the mapping char used to specify the data field's mapping. By default it is '>'. In the following code, if the mapChar was set to '.', we should use '.' instead of '>' to specify the fields map. </p> <h4>Code example</h4> <pre style='width: 700px; max-width: 700px; margin: 10px;' class='code'>var data = [{ <span style="clear: both; padding: 0px; margin: 0px; color: #a24;">"empName": "test", "age": "67", "department": { "id": "1234", "name": "Sales" }, "author": "ravi"</span>}];<div/><div/>// prepare the data<div/>var source =<div/>{<div/> datatype: <span style="clear: both; padding: 0px; margin: 0px; color: #a24;">"json"</span>,<div/> datafields: [<div/> { name: <span style=" clear: both; padding: 0px; margin: 0px; color: #a24;">'empName'</span> },<div/> { name: <span style=" clear: both; padding: 0px; margin: 0px; color: #a24;">'age'</span> },<div/> { name: <span style=" clear: both; padding: 0px; margin: 0px; color: #a24;">'id', map: 'department&gt;id'</span> },<div/> { name: <span style=" clear: both; padding: 0px; margin: 0px; color: #a24;">'name', map: 'department&gt;name'</span> },<div/> { name: <span style=" clear: both; padding: 0px; margin: 0px; color: #a24;">'author'</span> }<div/> ],<div/> localdata: data<div/>};<div/>var dataAdapter = new $.jqx.dataAdapter(source);<div/></pre> </div> </td> </tr> <tr> <td class="documentation-option-type-click"> <span id='Span20'>rowDelimiter</span> </td> <td> <span>String</span> </td> <td>"\n" </td> </tr> <tr> <td colspan='3' style='width: 100%'> <div class="documentation-option-description property-content" style="display: none;"> <p> Determines the rows delimiter when the data source is 'tab' or 'csv'. The default value is '\n'. </p> </div> </td> </tr> <tr> <td class="documentation-option-type-click"> <span id='Span5'>root</span> </td> <td> <span>String</span> </td> <td>"" </td> </tr> <tr> <td colspan='3' style='width: 100%'> <div class="documentation-option-description property-content" style="display: none;"> <p> A string describing where the data begins and all other loops begin from this element. </p> <h4>Code example </h4> <pre style='width: 700px; max-width: 700px; margin: 10px;' class='code'>var source =<div/>{<div/> datatype: <span style="clear: both; padding: 0px; margin: 0px; color: #a24;">"xml"</span>,<div/> datafields: [<div/> { name: <span style=" clear: both; padding: 0px; margin: 0px; color: #a24;">'ShippedDate', map: 'm\\:properties&gt;d\\:ShippedDate', type: 'date'</span> },<div/> { name: <span style=" clear: both; padding: 0px; margin: 0px; color: #a24;">'Freight', map: 'm\\:properties&gt;d\\:Freight', type: 'float'</span> },<div/> { name: <span style=" clear: both; padding: 0px; margin: 0px; color: #a24;">'ShipName', map: 'm\\:properties&gt;d\\:ShipName'</span> },<div/> { name: <span style=" clear: both; padding: 0px; margin: 0px; color: #a24;">'ShipAddress', map: 'm\\:properties&gt;d\\:ShipAddress'</span> },<div/> { name: <span style=" clear: both; padding: 0px; margin: 0px; color: #a24;">'ShipCity', map: 'm\\:properties&gt;d\\:ShipCity'</span> },<div/> { name: <span style=" clear: both; padding: 0px; margin: 0px; color: #a24;">'ShipCountry', map: 'm\\:properties&gt;d\\:ShipCountry'</span> }<div/> ],<div/> root: <span style="clear: both; padding: 0px; margin: 0px; color: #a24;">"entry"</span>,<div/> record: <span style="clear: both; padding: 0px; margin: 0px; color: #a24;">"content"</span>,<div/> id: <span style=" clear: both; padding: 0px; margin: 0px; color: #a24;">'m\\:properties&gt;d\\:OrderID'</span>,<div/> url: <span style=" clear: both; padding: 0px; margin: 0px; color: #a24;">'orders.xml'</span><div/>};<div/><div/>XML<div/> <span style="clear: both; padding: 0px; margin: 0px; color: #11a;">&lt;entry&gt;</span><div/> <span style="clear: both; padding: 0px; margin: 0px; color: #11a;">&lt;id&gt;</span>http://services.odata.org/Northwind/Northwind.svc/Orders(10248)<span style="clear: both; padding: 0px; margin: 0px; color: #11a;">&lt;/id&gt;</span><div/> <span style="clear: both; padding: 0px; margin: 0px; color: #11a;">&lt;title type=<span style="clear: both; padding: 0px; margin: 0px; color: #a24;">"text"</span>&gt;</span><span style="clear: both; padding: 0px; margin: 0px; color: #11a;">&lt;/title&gt;</span><div/> <span style="clear: both; padding: 0px; margin: 0px; color: #11a;">&lt;updated&gt;</span>2011-12-01T11:55:06Z<span style="clear: both; padding: 0px; margin: 0px; color: #11a;">&lt;/updated&gt;</span><div/> <span style="clear: both; padding: 0px; margin: 0px; color: #11a;">&lt;author&gt;</span><div/> <span style="clear: both; padding: 0px; margin: 0px; color: #11a;">&lt;name /&gt;</span><div/> <span style="clear: both; padding: 0px; margin: 0px; color: #11a;">&lt;/author&gt;</span><div/> <span style="clear: both; padding: 0px; margin: 0px; color: #11a;">&lt;link rel=<span style="clear: both; padding: 0px; margin: 0px; color: #a24;">"edit" title="Order" href="Orders(10248)"</span> /&gt;</span><div/> <span style="clear: both; padding: 0px; margin: 0px; color: #11a;">&lt;link rel=<span style="clear: both; padding: 0px; margin: 0px; color: #a24;">"http://schemas.microsoft.com/ado/2007/08/dataservices/related/Customer" type="application/atom+xml;type=entry" title="Customer" href="Orders(10248)/Customer"</span> /&gt;</span><div/> <span style="clear: both; padding: 0px; margin: 0px; color: #11a;">&lt;link rel=<span style="clear: both; padding: 0px; margin: 0px; color: #a24;">"http://schemas.microsoft.com/ado/2007/08/dataservices/related/Employee" type="application/atom+xml;type=entry" title="Employee" href="Orders(10248)/Employee"</span> /&gt;</span><div/> <span style="clear: both; padding: 0px; margin: 0px; color: #11a;">&lt;link rel=<span style="clear: both; padding: 0px; margin: 0px; color: #a24;">"http://schemas.microsoft.com/ado/2007/08/dataservices/related/Order_Details" type="application/atom+xml;type=feed" title="Order_Details" href="Orders(10248)/Order_Details"</span> /&gt;</span><div/> <span style="clear: both; padding: 0px; margin: 0px; color: #11a;">&lt;link rel=<span style="clear: both; padding: 0px; margin: 0px; color: #a24;">"http://schemas.microsoft.com/ado/2007/08/dataservices/related/Shipper" type="application/atom+xml;type=entry" title="Shipper" href="Orders(10248)/Shipper"</span> /&gt;</span><div/> <span style="clear: both; padding: 0px; margin: 0px; color: #11a;">&lt;category term=<span style="clear: both; padding: 0px; margin: 0px; color: #a24;">"NorthwindModel.Order" scheme="http://schemas.microsoft.com/ado/2007/08/dataservices/scheme"</span> /&gt;</span><div/> <span style="clear: both; padding: 0px; margin: 0px; color: #11a;">&lt;content type=<span style="clear: both; padding: 0px; margin: 0px; color: #a24;">"application/xml"</span>&gt;</span><div/> <span style="clear: both; padding: 0px; margin: 0px; color: #11a;">&lt;m:properties&gt;</span><div/> <span style="clear: both; padding: 0px; margin: 0px; color: #11a;">&lt;d:OrderID m:type=<span style="clear: both; padding: 0px; margin: 0px; color: #a24;">"Edm.Int32"</span>&gt;</span>10248<span style="clear: both; padding: 0px; margin: 0px; color: #11a;">&lt;/d:OrderID&gt;</span><div/> <span style="clear: both; padding: 0px; margin: 0px; color: #11a;">&lt;d:CustomerID&gt;</span>VINET<span style="clear: both; padding: 0px; margin: 0px; color: #11a;">&lt;/d:CustomerID&gt;</span><div/> <span style="clear: both; padding: 0px; margin: 0px; color: #11a;">&lt;d:EmployeeID m:type=<span style="clear: both; padding: 0px; margin: 0px; color: #a24;">"Edm.Int32"</span>&gt;</span>5<span style="clear: both; padding: 0px; margin: 0px; color: #11a;">&lt;/d:EmployeeID&gt;</span><div/> <span style="clear: both; padding: 0px; margin: 0px; color: #11a;">&lt;d:OrderDate m:type=<span style="clear: both; padding: 0px; margin: 0px; color: #a24;">"Edm.DateTime"</span>&gt;</span>1996-07-04T00:00:00<span style="clear: both; padding: 0px; margin: 0px; color: #11a;">&lt;/d:OrderDate&gt;</span><div/> <span style="clear: both; padding: 0px; margin: 0px; color: #11a;">&lt;d:RequiredDate m:type=<span style="clear: both; padding: 0px; margin: 0px; color: #a24;">"Edm.DateTime"</span>&gt;</span>1996-08-01T00:00:00<span style="clear: both; padding: 0px; margin: 0px; color: #11a;">&lt;/d:RequiredDate&gt;</span><div/> <span style="clear: both; padding: 0px; margin: 0px; color: #11a;">&lt;d:ShippedDate m:type=<span style="clear: both; padding: 0px; margin: 0px; color: #a24;">"Edm.DateTime"</span>&gt;</span>1996-07-16T00:00:00<span style="clear: both; padding: 0px; margin: 0px; color: #11a;">&lt;/d:ShippedDate&gt;</span><div/> <span style="clear: both; padding: 0px; margin: 0px; color: #11a;">&lt;d:ShipVia m:type=<span style="clear: both; padding: 0px; margin: 0px; color: #a24;">"Edm.Int32"</span>&gt;</span>3<span style="clear: both; padding: 0px; margin: 0px; color: #11a;">&lt;/d:ShipVia&gt;</span><div/> <span style="clear: both; padding: 0px; margin: 0px; color: #11a;">&lt;d:Freight m:type=<span style="clear: both; padding: 0px; margin: 0px; color: #a24;">"Edm.Decimal"</span>&gt;</span>32.3800<span style="clear: both; padding: 0px; margin: 0px; color: #11a;">&lt;/d:Freight&gt;</span><div/> <span style="clear: both; padding: 0px; margin: 0px; color: #11a;">&lt;d:ShipName&gt;</span>Vins et alcools Chevalier<span style="clear: both; padding: 0px; margin: 0px; color: #11a;">&lt;/d:ShipName&gt;</span><div/> <span style="clear: both; padding: 0px; margin: 0px; color: #11a;">&lt;d:ShipAddress&gt;</span>59 rue de l'Abbaye<span style="clear: both; padding: 0px; margin: 0px; color: #11a;">&lt;/d:ShipAddress&gt;</span><div/> <span style="clear: both; padding: 0px; margin: 0px; color: #11a;">&lt;d:ShipCity&gt;</span>Reims<span style="clear: both; padding: 0px; margin: 0px; color: #11a;">&lt;/d:ShipCity&gt;</span><div/> <span style="clear: both; padding: 0px; margin: 0px; color: #11a;">&lt;d:ShipRegion m:null=<span style="clear: both; padding: 0px; margin: 0px; color: #a24;">"true"</span> /&gt;</span><div/> <span style="clear: both; padding: 0px; margin: 0px; color: #11a;">&lt;d:ShipPostalCode&gt;</span>51100<span style="clear: both; padding: 0px; margin: 0px; color: #11a;">&lt;/d:ShipPostalCode&gt;</span><div/> <span style="clear: both; padding: 0px; margin: 0px; color: #11a;">&lt;d:ShipCountry&gt;</span>France<span style="clear: both; padding: 0px; margin: 0px; color: #11a;">&lt;/d:ShipCountry&gt;</span><div/> <span style="clear: both; padding: 0px; margin: 0px; color: #11a;">&lt;/m:properties&gt;</span><div/> <span style="clear: both; padding: 0px; margin: 0px; color: #11a;">&lt;/content&gt;</span><div/> <span style="clear: both; padding: 0px; margin: 0px; color: #11a;">&lt;/entry&gt;</span><div/> <span style="clear: both; padding: 0px; margin: 0px; color: #11a;">&lt;entry&gt;</span><div/> <span style="clear: both; padding: 0px; margin: 0px; color: #11a;">&lt;id&gt;</span>http://services.odata.org/Northwind/Northwind.svc/Orders(10249)<span style="clear: both; padding: 0px; margin: 0px; color: #11a;">&lt;/id&gt;</span><div/> <span style="clear: both; padding: 0px; margin: 0px; color: #11a;">&lt;title type=<span style="clear: both; padding: 0px; margin: 0px; color: #a24;">"text"</span>&gt;</span><span style="clear: both; padding: 0px; margin: 0px; color: #11a;">&lt;/title&gt;</span><div/> <span style="clear: both; padding: 0px; margin: 0px; color: #11a;">&lt;updated&gt;</span>2011-12-01T11:55:06Z<span style="clear: both; padding: 0px; margin: 0px; color: #11a;">&lt;/updated&gt;</span><div/> <span style="clear: both; padding: 0px; margin: 0px; color: #11a;">&lt;author&gt;</span><div/> <span style="clear: both; padding: 0px; margin: 0px; color: #11a;">&lt;name /&gt;</span><div/> <span style="clear: both; padding: 0px; margin: 0px; color: #11a;">&lt;/author&gt;</span><div/> <span style="clear: both; padding: 0px; margin: 0px; color: #11a;">&lt;link rel=<span style="clear: both; padding: 0px; margin: 0px; color: #a24;">"edit" title="Order" href="Orders(10249)"</span> /&gt;</span><div/> <span style="clear: both; padding: 0px; margin: 0px; color: #11a;">&lt;link rel=<span style="clear: both; padding: 0px; margin: 0px; color: #a24;">"http://schemas.microsoft.com/ado/2007/08/dataservices/related/Customer" type="application/atom+xml;type=entry" title="Customer" href="Orders(10249)/Customer"</span> /&gt;</span><div/> <span style="clear: both; padding: 0px; margin: 0px; color: #11a;">&lt;link rel=<span style="clear: both; padding: 0px; margin: 0px; color: #a24;">"http://schemas.microsoft.com/ado/2007/08/dataservices/related/Employee" type="application/atom+xml;type=entry" title="Employee" href="Orders(10249)/Employee"</span> /&gt;</span><div/> <span style="clear: both; padding: 0px; margin: 0px; color: #11a;">&lt;link rel=<span style="clear: both; padding: 0px; margin: 0px; color: #a24;">"http://schemas.microsoft.com/ado/2007/08/dataservices/related/Order_Details" type="application/atom+xml;type=feed" title="Order_Details" href="Orders(10249)/Order_Details"</span> /&gt;</span><div/> <span style="clear: both; padding: 0px; margin: 0px; color: #11a;">&lt;link rel=<span style="clear: both; padding: 0px; margin: 0px; color: #a24;">"http://schemas.microsoft.com/ado/2007/08/dataservices/related/Shipper" type="application/atom+xml;type=entry" title="Shipper" href="Orders(10249)/Shipper"</span> /&gt;</span><div/> <span style="clear: both; padding: 0px; margin: 0px; color: #11a;">&lt;category term=<span style="clear: both; padding: 0px; margin: 0px; color: #a24;">"NorthwindModel.Order" scheme="http://schemas.microsoft.com/ado/2007/08/dataservices/scheme"</span> /&gt;</span><div/> <span style="clear: both; padding: 0px; margin: 0px; color: #11a;">&lt;content type=<span style="clear: both; padding: 0px; margin: 0px; color: #a24;">"application/xml"</span>&gt;</span><div/> <span style="clear: both; padding: 0px; margin: 0px; color: #11a;">&lt;m:properties&gt;</span><div/> <span style="clear: both; padding: 0px; margin: 0px; color: #11a;">&lt;d:OrderID m:type=<span style="clear: both; padding: 0px; margin: 0px; color: #a24;">"Edm.Int32"</span>&gt;</span>10249<span style="clear: both; padding: 0px; margin: 0px; color: #11a;">&lt;/d:OrderID&gt;</span><div/> <span style="clear: both; padding: 0px; margin: 0px; color: #11a;">&lt;d:CustomerID&gt;</span>TOMSP<span style="clear: both; padding: 0px; margin: 0px; color: #11a;">&lt;/d:CustomerID&gt;</span><div/> <span style="clear: both; padding: 0px; margin: 0px; color: #11a;">&lt;d:EmployeeID m:type=<span style="clear: both; padding: 0px; margin: 0px; color: #a24;">"Edm.Int32"</span>&gt;</span>6<span style="clear: both; padding: 0px; margin: 0px; color: #11a;">&lt;/d:EmployeeID&gt;</span><div/> <span style="clear: both; padding: 0px; margin: 0px; color: #11a;">&lt;d:OrderDate m:type=<span style="clear: both; padding: 0px; margin: 0px; color: #a24;">"Edm.DateTime"</span>&gt;</span>1996-07-05T00:00:00<span style="clear: both; padding: 0px; margin: 0px; color: #11a;">&lt;/d:OrderDate&gt;</span><div/> <span style="clear: both; padding: 0px; margin: 0px; color: #11a;">&lt;d:RequiredDate m:type=<span style="clear: both; padding: 0px; margin: 0px; color: #a24;">"Edm.DateTime"</span>&gt;</span>1996-08-16T00:00:00<span style="clear: both; padding: 0px; margin: 0px; color: #11a;">&lt;/d:RequiredDate&gt;</span><div/> <span style="clear: both; padding: 0px; margin: 0px; color: #11a;">&lt;d:ShippedDate m:type=<span style="clear: both; padding: 0px; margin: 0px; color: #a24;">"Edm.DateTime"</span>&gt;</span>1996-07-10T00:00:00<span style="clear: both; padding: 0px; margin: 0px; color: #11a;">&lt;/d:ShippedDate&gt;</span><div/> <span style="clear: both; padding: 0px; margin: 0px; color: #11a;">&lt;d:ShipVia m:type=<span style="clear: both; padding: 0px; margin: 0px; color: #a24;">"Edm.Int32"</span>&gt;</span>1<span style="clear: both; padding: 0px; margin: 0px; color: #11a;">&lt;/d:ShipVia&gt;</span><div/> <span style="clear: both; padding: 0px; margin: 0px; color: #11a;">&lt;d:Freight m:type=<span style="clear: both; padding: 0px; margin: 0px; color: #a24;">"Edm.Decimal"</span>&gt;</span>11.6100<span style="clear: both; padding: 0px; margin: 0px; color: #11a;">&lt;/d:Freight&gt;</span><div/> <span style="clear: both; padding: 0px; margin: 0px; color: #11a;">&lt;d:ShipName&gt;</span>Toms Spezialitäten<span style="clear: both; padding: 0px; margin: 0px; color: #11a;">&lt;/d:ShipName&gt;</span><div/> <span style="clear: both; padding: 0px; margin: 0px; color: #11a;">&lt;d:ShipAddress&gt;</span>Luisenstr. 48<span style="clear: both; padding: 0px; margin: 0px; color: #11a;">&lt;/d:ShipAddress&gt;</span><div/> <span style="clear: both; padding: 0px; margin: 0px; color: #11a;">&lt;d:ShipCity&gt;</span>Münster<span style="clear: both; padding: 0px; margin: 0px; color: #11a;">&lt;/d:ShipCity&gt;</span><div/> <span style="clear: both; padding: 0px; margin: 0px; color: #11a;">&lt;d:ShipRegion m:null=<span style="clear: both; padding: 0px; margin: 0px; color: #a24;">"true"</span> /&gt;</span><div/> <span style="clear: both; padding: 0px; margin: 0px; color: #11a;">&lt;d:ShipPostalCode&gt;</span>44087<span style="clear: both; padding: 0px; margin: 0px; color: #11a;">&lt;/d:ShipPostalCode&gt;</span><div/> <span style="clear: both; padding: 0px; margin: 0px; color: #11a;">&lt;d:ShipCountry&gt;</span>Germany<span style="clear: both; padding: 0px; margin: 0px; color: #11a;">&lt;/d:ShipCountry&gt;</span><div/> <span style="clear: both; padding: 0px; margin: 0px; color: #11a;">&lt;/m:properties&gt;</span><div/> <span style="clear: both; padding: 0px; margin: 0px; color: #11a;">&lt;/content&gt;</span><div/> <span style="clear: both; padding: 0px; margin: 0px; color: #11a;">&lt;/entry&gt;</span><div/></pre> </div> </td> </tr> <tr> <td class="documentation-option-type-click"> <span id='Span6'>record</span> </td> <td> <span>String</span> </td> <td>"" </td> </tr> <tr> <td colspan='3' style='width: 100%'> <div class="documentation-option-description property-content" style="display: none;"> <p> A string describing the information for a particular record. </p> <h4>Code example </h4> <pre style='width: 700px; max-width: 700px; margin: 10px;' class='code'>var source =<div/>{<div/> datatype: <span style="clear: both; padding: 0px; margin: 0px; color: #a24;">"xml"</span>,<div/> datafields: [<div/> { name: <span style=" clear: both; padding: 0px; margin: 0px; color: #a24;">'ShippedDate', map: 'm\\:properties&gt;d\\:ShippedDate', type: 'date'</span> },<div/> { name: <span style=" clear: both; padding: 0px; margin: 0px; color: #a24;">'Freight', map: 'm\\:properties&gt;d\\:Freight', type: 'float'</span> },<div/> { name: <span style=" clear: both; padding: 0px; margin: 0px; color: #a24;">'ShipName', map: 'm\\:properties&gt;d\\:ShipName'</span> },<div/> { name: <span style=" clear: both; padding: 0px; margin: 0px; color: #a24;">'ShipAddress', map: 'm\\:properties&gt;d\\:ShipAddress'</span> },<div/> { name: <span style=" clear: both; padding: 0px; margin: 0px; color: #a24;">'ShipCity', map: 'm\\:properties&gt;d\\:ShipCity'</span> },<div/> { name: <span style=" clear: both; padding: 0px; margin: 0px; color: #a24;">'ShipCountry', map: 'm\\:properties&gt;d\\:ShipCountry'</span> }<div/> ],<div/> root: <span style="clear: both; padding: 0px; margin: 0px; color: #a24;">"entry"</span>,<div/> record: <span style="clear: both; padding: 0px; margin: 0px; color: #a24;">"content"</span>,<div/> id: <span style=" clear: both; padding: 0px; margin: 0px; color: #a24;">'m\\:properties&gt;d\\:OrderID'</span>,<div/> url: <span style=" clear: both; padding: 0px; margin: 0px; color: #a24;">'orders.xml'</span><div/>};<div/><div/>XML<div/> <span style="clear: both; padding: 0px; margin: 0px; color: #11a;">&lt;entry&gt;</span><div/> <span style="clear: both; padding: 0px; margin: 0px; color: #11a;">&lt;id&gt;</span>http://services.odata.org/Northwind/Northwind.svc/Orders(10248)<span style="clear: both; padding: 0px; margin: 0px; color: #11a;">&lt;/id&gt;</span><div/> <span style="clear: both; padding: 0px; margin: 0px; color: #11a;">&lt;title type=<span style="clear: both; padding: 0px; margin: 0px; color: #a24;">"text"</span>&gt;</span><span style="clear: both; padding: 0px; margin: 0px; color: #11a;">&lt;/title&gt;</span><div/> <span style="clear: both; padding: 0px; margin: 0px; color: #11a;">&lt;updated&gt;</span>2011-12-01T11:55:06Z<span style="clear: both; padding: 0px; margin: 0px; color: #11a;">&lt;/updated&gt;</span><div/> <span style="clear: both; padding: 0px; margin: 0px; color: #11a;">&lt;author&gt;</span><div/> <span style="clear: both; padding: 0px; margin: 0px; color: #11a;">&lt;name /&gt;</span><div/> <span style="clear: both; padding: 0px; margin: 0px; color: #11a;">&lt;/author&gt;</span><div/> <span style="clear: both; padding: 0px; margin: 0px; color: #11a;">&lt;link rel=<span style="clear: both; padding: 0px; margin: 0px; color: #a24;">"edit" title="Order" href="Orders(10248)"</span> /&gt;</span><div/> <span style="clear: both; padding: 0px; margin: 0px; color: #11a;">&lt;link rel=<span style="clear: both; padding: 0px; margin: 0px; color: #a24;">"http://schemas.microsoft.com/ado/2007/08/dataservices/related/Customer" type="application/atom+xml;type=entry" title="Customer" href="Orders(10248)/Customer"</span> /&gt;</span><div/> <span style="clear: both; padding: 0px; margin: 0px; color: #11a;">&lt;link rel=<span style="clear: both; padding: