If set to true, the following behavior will take place:
if a new row is added, and then deleted, there will be no transaction added to the log
if an edit is made to a row or cell, then the value is brought back to its original value, the transaction should be removed
Note: This option takes effect only when autoCommit is set to false.

 
				var ds = new $.ig.HtmlTableDataSource({
					aggregateTransactions: true,
					dataSource: arrayOfObjects
				});
			 

If auto commit is true, data will be automatically commited to the data source, once a value or a batch of values are updated via saveChanges().

 
				var ds = new $.ig.HtmlTableDataSource({
					autoCommit: true
				});
			 

Callback function to call when data binding is complete.

 
				var render = function (success, error) {
					if (success) {
						alert("success");
					} else {
						alert(error);
					}
				}

				$(window).load(function () {
					var url = "http://odata.netflix.com/Catalog/Titles?$format=json&$callback=?";
					ds = new $.ig.HtmlTableDataSource({
						type: "remoteUrl",
						callback: render,
						dataSource: url,
						schema: oDataSchema,
						responseDataKey : "d.results",
						responseDataType: "jsonp",
					});
					ds.dataBind();
				});
			 

Object on which to invoke the callback function.

 
				var Bob = {
					name: "Bob",
					greet: function () {
						alert("Hi, I'm " + this.name);
					}
				};

				var products = [];
				products[0] = {
					"ProductID": 1,
					"Name": "Adjustable Race",
					"ProductNumber": "AR-5381"
				};
				products[1] = {
					"ProductID": 2,
					"Name": "Bearing Ball",
					"ProductNumber": "BA-8327"
				};

				var ds;

				$(document).ready(function () {
					ds = new $.ig.HtmlTableDataSource({
						dataSource: products,
						callee: Bob,
						callback: Bob.greet
					});

					ds.dataBind();
				});
			 

This is the normalized (transformed) resulting data, after it's fetched from the data source.

 
				var ds = new $.ig.HtmlTableDataSource({
					data: normalizedArrayOfObjects
				});
			 

Client-side dataBinding event. Can be a string pointing to a function name, or an object pointing to a function.

 
				var myDataBinding = function () {
					alert("myDataBinding");
				}

				var products = [];
				products[0] = {
					"ProductID": 1,
					"Name": "Adjustable Race",
					"ProductNumber": "AR-5381"
				};
				products[1] = {
					"ProductID": 2,
					"Name": "Bearing Ball",
					"ProductNumber": "BA-8327"
				};

				var ds;

				$(window).ready(function () {
					ds = new $.ig.HtmlTableDataSource({
						dataBinding: myDataBinding,
						dataSource: products
					});
				});
			 

Client-side dataBound event. Can be a string pointing to a function name, or an object pointing to a function.

 
				var myDataBound = function () {
					alert("myDataBound");
				}

				var products = [];
				products[0] = {
					"ProductID": 1,
					"Name": "Adjustable Race",
					"ProductNumber": "AR-5381"
				};
				products[1] = {
					"ProductID": 2,
					"Name": "Bearing Ball",
					"ProductNumber": "BA-8327"
				};

				var ds;

				$(window).ready(function () {
					ds = new $.ig.HtmlTableDataSource({
						dataBound: myDataBound
					});

					ds.dataBind();

				});
			 

This is the source of data - non normalized. Can be an array, can be reference to some JSON object, can be a DOM element for a HTML TABLE, or a function.

 
				var jsonSchema = new $.ig.DataSchema("json", {fields:[
					{name: "ProductID", type: "number"},
					{name: "Name", type: "string"},
					{name: "ProductNumber", type: "string"},
					{name: "Color", type: "string"},
					{name: "StandardCost", type: "string"}],
					searchField:"Records" });

				ds = new $.ig.HtmlTableDataSource({type: "json", dataSource: jsonData, schema: jsonSchema});
				ds.dataBind();
			 

*** IMPORTANT DEPRECATED ***
A list of field definitions specifying the schema of the data source.
Field objects description: {name, [type], [xpath]}.

 
				var products = [];
				products[0] = {
					"ProductID": 1,
					"Name": "Adjustable Race",
					"ProductNumber": "AR-5381"
				};
				products[1] = {
					"ProductID": 2,
					"Name": "Bearing Ball",
					"ProductNumber": "BA-8327"
				};

				var ds;
				$(window).ready(function () {

					ds = new $.ig.HtmlTableDataSource({
						dataSource: products,
						fields: [{
							name: "ProductID",
							type: "number"
						}, {
							name: "Name",
							type: "string"
						}, {
							name: "ProductNumber",
							type: "string"
						}]
					});

					ds.dataBind();
				});
			 

Settings related to built-in filtering functionality.

 
				jsonDs = new $.ig.HtmlTableDataSource( {
					filtering: {
						type: "local",
						caseSensitive: true,
						applyToAllData: true
					},
					dataSource: jsonData
				}).dataBind();
			 

• applyToAllData

  Type:

  bool

  Default:

  true

  If the type of paging/sorting/filtering is local and applyToAllData is true, filtering will be performed on the whole data source that's present locally, otherwise only on the current dataView. if type is remote, this setting doesn't have any effect.

  Code Sample

   
  					jsonDs = new $.ig.HtmlTableDataSource( {
  						filtering: {
  							type: "local",
  							caseSensitive: true,
  							applyToAllData: true
  						},
  						dataSource: jsonData
  					}).dataBind();
  				 

• caseSensitive

  Type:

  bool

  Default:

  false

  Enables or disables case sensitive filtering on the data. Works only for local filtering.

  Code Sample

   
  					jsonDs = new $.ig.HtmlTableDataSource( {
  						filtering: {
  							type: "local",
  							caseSensitive: true,
  							applyToAllData: true
  						},
  						dataSource: jsonData
  					}).dataBind();
  				 

• customConditions

  Type:

  object

  Default:

  null

  An object containing custom defined filtering conditions as objects.

  Code Sample

   
  					jsonDs = new $.ig.DataSource( {
  						filtering: {
  							type: "local",
  							caseSensitive: true,
  							applyToAllData: true,
  							customConditions: [
  								BE: {
  								labelText: "BE",
  								expressionText: "BE-####",
  								requireExpr: false,
  								filterFunc: filterProductNumber
  								},
  								CA: {
  									labelText: "CA",
  									expressionText: "CA-####",
  									requireExpr: false,
  									filterFunc: filterProductNumber1
  								}
  							]
  						},
  						dataSource: jsonData
  					}).dataBind()
  					function filterProductNumber(value, expression, dataType, ignoreCase, preciseDateFormat) {
  						return value.startsWith("BE");
  					}
  					function filterProductNumber1(value, expression, dataType, ignoreCase, preciseDateFormat) {
  						return value.startsWith("CA");
  					}
  				 

• customFunc

  Type:

  object

  Default:

  null

  Can point to either a string or a function object. The parameters that are passed are 1) the data array to be filtered, 2) the filtering expression definitions. Should return an array of the filtered data.

  Code Sample

   
  					var ds;
  
  					var render = function (success, error) {
  						if (success) {
  							var expr = "Cr";
  							cond = "startsWith";
  
  							ds.filter([{
  								fieldName: "Name",
  								expr: expr,
  								cond: cond
  							}], true);
  
  							var template = "<tr><td>${Name}</td><td>${Price}</td><td>${Rating}</td></tr>",
  							resultHtml = $.ig.tmpl(template, ds.dataView());
  							$("#table").html(resultHtml);
  						} else {
  							alert(error);
  						}
  					}
  
  
  					var myCustomFunc = function (fieldExpression, data) {
  						var result = [];
  						result[0] = data[0];
  						return result;
  					}
  
  					$(window).load(function () {
  						var url = "http://services.odata.org/OData/OData.svc/Products?$format=json&$callback=?";
  						ds = new $.ig.HtmlTableDataSource({
  							callback: render,
  							dataSource: url,
  							schema: {
  								fields: [{
  									name: "Name"
  								}, {
  									name: "Price"
  								}, {
  									name: "Rating"
  								}],
  								searchField: "d"
  							},
  							responseDataKey: "d",
  							responseDataType: "jsonp",
  							filtering: {
  								type: "remote",
  								customFunc: myCustomFunc
  							}
  						});
  						ds.dataBind();
  
  					});
  				 

• defaultFields

  Type:

  array

  Default:

  []

  Elements Type:

  object

  Data will be initially filtered accordingly, directly after dataBind().

  Code Sample

   
  					$(window).load(function () {
  						var url = "http://services.odata.org/OData/OData.svc/Products?$format=json&$callback=?";
  						ds = new $.ig.HtmlTableDataSource({
  							callback: render,
  							dataSource: url,
  							schema: {
  								fields: [{
  									name: "Name"
  								}, {
  									name: "Price"
  								}, {
  									name: "Rating"
  								}],
  								searchField: "d"
  							},
  							responseDataKey: "d",
  							responseDataType: "jsonp",
  							filtering: {
  								type: "remote",
  								defaultFields: [{
  									fieldName: "Price",
  									cond:"GreaterThan",
  									expr: 20
  								}]
  							}
  						});
  						ds.dataBind();
  					});
  				 

• expressions

  Type:

  array

  Default:

  []

  Elements Type:

  object

  A list of expression objects, containing the following key-value pairs: fieldName, expression (search string), condition , and logic (AND/OR).

  Code Sample

   
  					var url = "/demos/server/proxy.php?url=http://services.odata.org/OData/OData.svc/Products?$format=json";
  					ds = new $.ig.HtmlTableDataSource({
  						callback:render,
  						dataSource: url,
  						localSchemaTransform: false,
  						responseDataKey: "d",
  						filtering: {
  							expressions:[
  								{
  									fieldName: "Price",
  									cond:"GreaterThan",
  									expr: 20
  								}
  							]
  						},
  						schema: {
  							fields: [
  								{name : "Price"},
  								{name : "Name"},
  								{name: "Rating"}
  							],
  							searchField: "d"
  						}
  					});
  
  					ds.dataBind();
  				 

• exprString

  Type:

  string

  Default:

  ""

  An "SQL-like' encoded expressions string. Takes precedence over "expressions". Example: col2 > 100; col2 LIKE %test%.

  Code Sample

   
  					var render = function (success, error) {
  						if (success) {
  							var template = "<tr><td>${Name}</td><td>${Price}</td><td>${Rating}</td></tr>",
  							resultHtml = $.ig.tmpl(template, ds.dataView());
  							$("#table").html(resultHtml);
  						} else {
  							alert(error);
  						}
  					}
  
  					var ds;
  
  					$(window).load(function () {
  						var url = "http://services.odata.org/OData/OData.svc/Products?$format=json&$callback=?";
  						ds = new $.ig.HtmlTableDataSource({
  							callback: render,
  							dataSource: url,
  							schema: {
  								fields: [{
  									name: "Name"
  								}, {
  									name: "Price"
  								}, {
  									name: "Rating"
  								}],
  								searchField: "d"
  							},
  							responseDataKey: "d",
  							responseDataType: "jsonp",
  							filtering: {
  								type: "remote",
  								exprString: "Name LIKE Cr%"
  							}
  						});
  						ds.dataBind();
  					});
  				 

• filterExprUrlKey

  Type:

  string

  Default:

  null

  Url key that will be encoded in the request if remote filtering is performed. Default value of null implies OData-style URL encoding. Please see http://www.odata.org/developers/protocols/uri-conventions for details.

  Code Sample

   
  					var render = function (success, error) {
  						if (success) {
  							var template = "<tr><td>${Name}</td><td>${Price}</td><td>${Rating}</td></tr>",
  							resultHtml = $.ig.tmpl(template, ds.dataView());
  							$("#table").html(resultHtml);
  						} else {
  							alert(error);
  						}
  					}
  
  					var ds;
  
  					$(window).load(function () {
  						var url = "http://services.odata.org/OData/OData.svc/Products?$format=json&$callback=?";
  						ds = new $.ig.HtmlTableDataSource({
  							callback: render,
  							dataSource: url,
  							schema: {
  								fields: [{
  									name: "Name"
  								}, {
  									name: "Price"
  								}, {
  									name: "Rating"
  								}],
  								searchField: "d"
  							},
  							responseDataKey: "d",
  							responseDataType: "jsonp",
  							filtering: {
  								type: "remote",
  								filterExprUrlKey: "filter",
  								expressions: [{
  									fieldName: "Name",
  									cond: "Contains",
  									expr: "Cr"
  								}]
  							}
  						});
  						ds.dataBind();
  					});
  				 

• filterLogicUrlKey

  Type:

  string

  Default:

  "filterLogic"

  Url key that will be encoded in the request, specifying if the filtering logic will be AND or OR.

  Code Sample

   
  					var render = function (success, error) {
  						if (success) {
  							var template = "<tr><td>${Name}</td><td>${Price}</td><td>${Rating}</td></tr>",
  							resultHtml = $.ig.tmpl(template, ds.dataView());
  							$("#table").html(resultHtml);
  						} else {
  							alert(error);
  						}
  					}
  
  					var ds;
  
  					$(window).load(function () {
  						var url = "http://services.odata.org/OData/OData.svc/Products?$format=json&$callback=?";
  						ds = new $.ig.HtmlTableDataSource({
  							callback: render,
  							dataSource: url,
  							schema: {
  								fields: [{
  									name: "Name"
  								}, {
  									name: "Price"
  								}, {
  									name: "Rating"
  								}],
  								searchField: "d"
  							},
  							responseDataKey: "d",
  							responseDataType: "jsonp",
  							filtering: {
  								type: "remote",
  								filterLogicUrlKey: "testFilterLogicUrlKey",
  								expressions: [{
  									fieldName: "Name",
  									cond: "Contains",
  									expr: "Cr",
  									logic: "OR"
  								}]
  							}
  						});
  						ds.dataBind();
  					});
  				 

• type

  Type:

  enumeration

  Default:

  remote

  Filtering type.

  Members

  • remote
  • Type:string
  • Parameters will be encoded and it's up to the backend to interpred them from the response.
  • local
  • Type:string
  • The data will be filtered automatically client-side.

  Code Sample

   
              var ds = new $.ig.HtmlTableDataSource({
                  dataSource: data,
                  schema: tableSchema,
  		        filtering: {
  			        type: "local",
                  }
              });
              ds.dataBind();              

Settings related to built-in group by functionality.

 
				ds = new $.ig.HtmlTableDataSource({
					dataSource: products,
					groupby: {
						defaultCollapseState: true
					}
				});

				ds.dataBind();
			 

• defaultCollapseState

  Type:

  bool

  Default:

  false

  Default collapse state.

  Code Sample

   
  					ds = new $.ig.HtmlTableDataSource({
  						dataSource: products,
  						groupby: {
  							defaultCollapseState: true
  						}
  					});
  				 

• groupRecordKey

  Type:

  string

  Default:

  "__gbRecord"

  The name of the property that determines whether a record from the group data view is a group record.

  Code Sample

   
  						ds = new $.ig.HtmlTableDataSource({
  						dataSource: products,
  						groupby: {
  							groupRecordKey: "__gbRecord"
  						}
  					});
  					 

• groupSummaryRecordKey

  Type:

  string

  Default:

  "__gbSummaryRecord"

  The name of the property that determines whether a record from the group data view is a summary group record.

  Code Sample

   
  						ds = new $.ig.HtmlTableDataSource({
  						dataSource: products,
  						groupby: {
  							groupRecordKey: "__gbRecord"
  						}
  					});
  					 

• pagingMode

  Type:

  enumeration

  Default:

  allRecords

  . Specifies how paging should be applied when there is at least one grouped column.

  Members

  • allRecords
  • Type:string
  • Paging is applied for all records - data and non-data records(like group-by records).
  • dataRecordsOnly
  • Type:string
  • Paging is applied ONLY for data records. Non-data records are disregarded in paging calculations.

  Code Sample

   
  					ds = new $.ig.HtmlTableDataSource({
  						dataSource: products,
  						groupby: {
  							pagingMode: "allRecords"
  						}
  					});
  				 

• summaries

  Type:

  array

  Default:

  []

  Elements Type:

  object

  Array of objects containing the summaries for each field.
  Each summary object has the following format { field:"fieldName", summaryFunctions: [] }, where the summaryFunctions arrays can contain either a summary name (avg, sum, count etc.) or a custom function for caclulating a custom summary.

  Code Sample

   
  						ds = new $.ig.HtmlTableDataSource({
  						dataSource: data,
  						groupby: {
  							summaries: [
  							{
  								field:"Age",
  								summaryFunctions: ["avg","sum"]
  							},
  							{
  								field: "Name",
  								summaryFunctions: ["count", customFunc]
  							}]
  						}
  					});
  					 

• summariesPosition

  Type:

  enumeration

  Default:

  bottom

  Specifies the postion for the summaries for each field inside each group.

  Members

  • top
  • Type:string
  • One summary row will be displayed at the top for each group.
  • bottom
  • Type:string
  • One summary row will be displayed at the bottom for each group.
  • both
  • Type:string
  • Two summary rows will be be display for each group. One on the top and one on the bottom.

  Code Sample

   
  					ds = new $.ig.HtmlTableDataSource({
  					dataSource: data,
  					groupby: {
  						summariesPosition: "top",
  						summaries: [
  						{
  							field:"Age",
  							summaryFunctions: ["avg","sum"]
  						},
  						{
  							field: "Name",
  							summaryFunctions: ["count", customFunc]
  						}]
  					}
  				});
  				 

Setting this is only necessary when the data source is set to a table in string format. we need to create an invisible dummy data container in the body and append the table data to it.

 
				var ds = $.ig.DataSource({
					id: "myId"
				});
			 

If set to false will disable transformations on schema, even if it is defined locally in the javascript code.

 
				var url = "/demos/server/proxy.php?url=http://services.odata.org/OData/OData.svc/Products?$format=json";
				ds = new $.ig.HtmlTableDataSource({
					callback:render,
					dataSource: url,
					localSchemaTransform: false,
					responseDataKey: "d",
					schema: {fields: [
						{name : "Price"},
						{name : "Name"},
						{name: "Rating"}
					]}
				});

				ds.dataBind();
			 

This is the property in the dataView where actual resulting records will be put. (So the dataView will not be array but an object if this is defined), after the potential data source transformation.

 
				var render = function (success, error) {
					if (success) {
						var template = "<tr><td>${Name}</td><td>${Price}</td><td>${Rating}</td></tr>",
						resultHtml = $.ig.tmpl(template, ds.dataView());
						$("#table").html(resultHtml);
					} else {
						alert(error);
					}
				}
				var ds;
				$(window).load(function () {
					var url = "http://services.odata.org/OData/OData.svc/Products?$format=json&$callback=?";
					ds = new $.ig.HtmlTableDataSource({
						callback: render,
						dataSource: url,
						schema: {
							fields: [{
								name: "Name"
							}, {
								name: "Price"
							}, {
								name: "Rating"
							}],
							searchField: "d"
						},
						responseDataKey: "d",
						responseDataType: "jsonp",
						outputResultsName: "myOutputResultsName"
					});
					ds.dataBind();
				});
			 

Settings related to built-in paging functionality.

 
				$(window).load(function () {
					ds = new $.ig.HtmlTableDataSource({
						type: "json",
						dataSource: adventureWorks,
						responseDataKey: "Records",
						paging: {
							enabled : true,
							pageSize:10,
							type: "local"
						}
					});

					ds.dataBind();
				});
			 

• appendPage

  Type:

  bool

  Default:

  false

  Whether when a new page of data is requested we should append the new data to the existing data.

  Code Sample

   
  					var ds = new $.ig.HtmlTableDataSource({
  						dataSource: products,
  						paging: {
  							enabled: true,
  							appendPage : true
  						}
  					});
  				 

• enabled

  Type:

  bool

  Default:

  false

  Paging is not enabled by default.

  Code Sample

   
  					ds = new $.ig.HtmlTableDataSource({
  						type: "json",
  						dataSource: adventureWorks,
  						responseDataKey: "Records",
  						paging: {
  							enabled : true,
  							pageSize:10,
  							type: "local"
  						}
  					});
  				 

• pageIndex

  Type:

  number

  Default:

  0

  Current page index.

  Code Sample

   
  					ds = new $.ig.HtmlTableDataSource({
  						type: "json",
  						dataSource: adventureWorks,
  						responseDataKey: "Records",
  						schema: jsonSchema,
  						paging:
  						{
  							enabled : true,
  							pageSize:10,
  							type: "local",
  							pageIndex: 2
  						}
  					});
  					ds.dataBind();
  				 

• pageIndexUrlKey

  Type:

  string

  Default:

  null

  Denotes the name of the encoded URL parameter that will state what is the currently requested page index.

  Code Sample

   
  					var ds = new $.ig.HtmlTableDataSource({
  						type: "json",
  						dataSource: adventureWorks,
  						responseDataKey: "Records",
  						paging: {
  							enabled: true,
  							pageSize: 10,
  							pageIndex: 2,
  							pageIndexUrlKey: "myPageIndexUrlKey",
  							type: "local"
  						}
  					});
  				 

• pageSize

  Type:

  number

  Default:

  5

  Number of records on each page.

  Code Sample

   
  					ds = new $.ig.HtmlTableDataSource({
  						type: "json",
  						dataSource: adventureWorks,
  						responseDataKey: "Records",
  						paging: {
  							enabled : true,
  							pageSize:10,
  							type: "local"
  						}
  					});
  				 

• pageSizeUrlKey

  Type:

  string

  Default:

  null

  Denotes the name of the encoded URL parameter that will state what is the currently requested page size.

  Code Sample

   
  					var ds = new $.ig.HtmlTableDataSource({
  						type: "json",
  						dataSource: adventureWorks,
  						responseDataKey: "Records",
  						paging: {
  							enabled: true,
  							pageSize: 10,
  							pageSizeUrlKey: "myPageSizeUrlKey",
  							type: "local"
  						}
  					});
  				 

• type

  Type:

  enumeration

  Default:

  remote

  Type for the paging operation.

  Members

  • local
  • Type:string
  • Data is paged client-side.
  • remote
  • Type:string
  • A remote request is done and URL params encoded.

  Code Sample

   
  					jsonDs = new $.ig.HtmlTableDataSource( {
  						filtering: {
  							type: "local",
  							caseSensitive: true,
  							applyToAllData: true
  						},
  						dataSource: jsonData
  					}).dataBind();
  				 

The unique field identifier.

 
				$(window).load(function () {
					ds = new $.ig.HtmlTableDataSource({
						primaryKey: "CustomerID",
						type: "json",
						dataSource: adventureWorks,
						responseDataKey: "Records",
					});

					ds.dataBind();
				});
			 

Specifies the HTTP verb to be used to issue the request.

 
				$(window).load(function () {
					ds = new $.ig.HtmlTableDataSource({
						primaryKey: "CustomerID",
						requestType: "get",
						dataSource: "http://services.odata.org/OData/OData.svc/Products?$format=json&$callback=?",
						responseDataKey: "Records",
					});

					ds.dataBind();
				});
			 

Content type of the response. See http://api.jquery.com/jQuery.ajax/ => contentType.

 
				var ds = new $.ig.HtmlTableDataSource({
					type: "json",
					dataSource: adventureWorks,
					responseDataKey: "Records",
					responseContentType: "application/x-www-form-urlencoded; charset=UTF8;"
				});
			 

Property in the response which specifies where the data records array will be held (if the response is wrapped).

 
				var url = "http://odata.netflix.com/Catalog/Titles?$format=json&$callback=?";
				var jsonp = new $.ig.HtmlTableDataSource({
					type: "json",
					dataSource: url,
					responseDataKey: "d.results"
				});
			 

Response type when a URL is set as the data source. See http://api.jquery.com/jQuery.ajax/ => dataType.

 
				var render = function (success, error) {
					if (success) {
						alert("success");
					} else {
						alert(error);
					}
				}
				$(window).load(function () {
					var url = "http://odata.netflix.com/Catalog/Titles?$format=json&$callback=?";
					ds = new $.ig.HtmlTableDataSource({
						type: "remoteUrl",
						callback: render,
						dataSource: url,
						schema: oDataSchema,
						responseDataKey: "d.results",
						responseDataType: "jsonp",
					});
					ds.dataBind();
				});
			 

Property in the response which specifies the total number of records in the backend (this is needed for paging).

 
				var ds = new $.ig.HtmlTableDataSource({
					type: "json",
					dataSource: adventureWorks,
					responseDataKey: "Records",
					responseTotalRecCountKey: "1024"
				});
			 

A function to call when row is added.
Function takes first argument item and second argument dataSource.
Use item.row to obtain reference to the added row.
Use item.rowId to get the row ID.
Use dataSource to obtain reference to $.ig.DataSource.

 
				$.ig.DataSource({
					rowAdded: function (item, dataSource) {…}
				});
			 

A function to call when row is deleted.
Use item.row to obtain reference to the deleted row.
Use item.rowId to get the row ID.
Use item.rowIndex to get the row index.
Use dataSource to obtain reference to $.ig.DataSource.

 
				$.ig.DataSource({
					rowDeleted: function (item, dataSource) {…}
				});
			 

A function to call when row is inserted.
Function takes first argument item and second argument dataSource.
Use item.row to obtain reference to the inserted row.
Use item.rowId to get the row ID.
Use item.rowIndex to get the row index.
Use dataSource to obtain reference to $.ig.DataSource.

 
				$.ig.DataSource({
					rowInserted: function (item, dataSource) {…}
				});
			 

A function to call when row is updated (edited).
Function takes first argument item and second argument dataSource.
Use item.rowIndex to get the row index.
Use item.newRow to obtain reference to the updated row.
Use item.oldRow to obtain reference to the row that was updated.
Use dataSource to obtain reference to $.ig.DataSource.

 
				$.ig.DataSource({
					rowUpdated: function (item, dataSource) {…}
				});
			 

A schema object that defines which fields from the data to bind to.

 
				var jsonSchema = new $.ig.DataSchema("json", {fields:[
					{name: "ProductID", type: "number"},
					{name: "Name", type: "string"},
					{name: "ProductNumber", type: "string"},
					{name: "Color", type: "string"},
					{name: "StandardCost", type: "string"}],
					searchField:"Records" });

				ds = new $.ig.HtmlTableDataSource({
					type: "json",
					dataSource: jsonData,
					schema: jsonSchema
				});
				ds.dataBind();
			 

If true, will serialize the transaction log of updated values - if any - whenever commit is performed via a remote request.

 
				$.ig.DataSource({
					serializeTransactionLog: false
				});
			 

Settings related to built-in sorting functionality.

 
				$(window).load(function () {
					ds = new $.ig.HtmlTableDataSource({
						type: "json",
						dataSource: adventureWorks,
						sorting: {
							type: "local",
							caseSensitive: true
						}
					});

					ds.dataBind();
				});
			 

• applyToAllData

  Type:

  bool

  Default:

  true

  If the sorting type is local and applyToAllData is true, sorting will be performed on the whole data source that's present locally, otherwise only on the current dataView. If sorting type is remote, this setting doesn't have any effect.

  Code Sample

   
  					jsonDs = new $.ig.HtmlTableDataSource({
  						sorting: {
  							type: "local",
  							applyToAllData: true
  						},
  						dataSource: jsonData
  					}).dataBind();
  				 

• caseSensitive

  Type:

  bool

  Default:

  false

  Specifies if sorting will be case sensitive or not. Works only for local sorting.

  Code Sample

   
  					$(window).load(function () {
  						ds = new $.ig.HtmlTableDataSource({
  							type: "json",
  							dataSource: adventureWorks,
  							sorting: {
  								type: "local",
  								caseSensitive: true
  							}
  						});
  
  						ds.dataBind();
  					});
  				 

• compareFunc

  Type:

  object

  Default:

  null

  Custom comparison sorting function. Accepts the following arguments: fields, schema, booleand value whether sorting is ascending , convert function(please check option for customConvertFunc) and returns a value 0 indicating that values are equal, 1 indicating that val1 > val2 and -1 indicating that val1 < val2.

  Code Sample

   
  					var render = function (success, error) {
  						if (success) {
  							var template = "<tr><td>${Name}</td><td>${Price}</td><td>${Rating}</td></tr>",
  							resultHtml = $.ig.tmpl(template, ds.dataView());
  							$("#table").html(resultHtml);
  						} else {
  							alert(error);
  						}
  					}
  
  					var myCompareFunc = function (fields, schema, reverse, convertf) {
  						return function (val1, val2) {
  							if (val1.Price > val2.Price) {
  								return 1;
  							}
  
  							if (val1.Price < val2.Price) {
  								return -1;
  							}
  
  							return 0;
  						}
  					}
  
  					var ds;
  					$(window).load(function () {
  						var url = "http://services.odata.org/OData/OData.svc/Products?$format=json&$callback=?";
  						ds = new $.ig.HtmlTableDataSource({
  							callback: render,
  							dataSource: url,
  							schema: {
  								fields: [{
  									name: "Name"
  								}, {
  									name: "Price"
  								}, {
  									name: "Rating"
  								}],
  								searchField: "d"
  							},
  							responseDataKey: "d",
  							responseDataType: "jsonp",
  							sorting: {
  								type: "local",
  								compareFunc: myCompareFunc,
  								defaultFields: [{
  									fieldName: "Price"
  								}]
  							}
  						});
  						ds.dataBind();
  					});
  				 

• customConvertFunc

  Type:

  object

  Default:

  null

  Custom data value conversion function(called from sorting function). Accepts a value of the data cell and column key and should return the converted value.

  Code Sample

   
  					var render = function (success, error) {
  						if (success) {
  							var template = "<tr><td>${Name}</td><td>${Price}</td><td>${Rating}</td></tr>",
  							resultHtml = $.ig.tmpl(template, ds.dataView());
  							$("#table").html(resultHtml);
  						} else {
  							alert(error);
  						}
  					}
  
  					var myCompareFunc = function (fields, schema, reverse, convertf) {
  						return function (obj1, obj2) {
  							a = convertf(obj1);
  							b = convertf(obj2);
  
  							if (a > b) {
  								return 1;
  							}
  
  							if (a < b) {
  								return -1;
  							}
  
  							return 0;
  						}
  					}
  
  				var myCustomConvertFunc = function (obj) {
  						return obj.Price;
  					}
  
  					var ds;
  					$(window).load(function () {
  						var url = "http://services.odata.org/OData/OData.svc/Products?$format=json&$callback=?";
  						ds = new $.ig.HtmlTableDataSource({
  							callback: render,
  							dataSource: url,
  							schema: {
  								fields: [{
  									name: "Name"
  								}, {
  									name: "Price"
  								}, {
  									name: "Rating"
  								}],
  								searchField: "d"
  							},
  							responseDataKey: "d",
  							responseDataType: "jsonp",
  							sorting: {
  								type: "local",
  								compareFunc: myCompareFunc,
  								customConvertFunc: myCustomConvertFunc,
  								defaultFields: [{
  									fieldName: "Price"
  								}]
  							}
  						});
  						ds.dataBind();
  					});
  				 

• customFunc

  Type:

  object

  Default:

  null

  Custom sorting function that can point to either a string or a function object. When the function is called, the following arguments are passed: data array, fields (array of field definitions) , direction ("asc" or "desc"). The function should return a sorted data array.

  Code Sample

   
  					var render = function (success, error) {
  						if (success) {
  							var template = "<tr><td>${Name}</td><td>${Price}</td><td>${Rating}</td></tr>",
  							resultHtml = $.ig.tmpl(template, ds.dataView());
  							$("#table").html(resultHtml);
  						} else {
  							alert(error);
  						}
  					}
  
  					var myCustomFunc = function (data, fields, direction) {
  						function myCompareFunc(obj1, obj2) {
  							if (direction == "desc") {
  								return obj2[fields[0].fieldName] - obj1[fields[0].fieldName];
  							}
  
  							return obj1[fields[0].fieldName] - obj2[fields[0].fieldName];
  						}
  						var result = data.sort(myCompareFunc);
  						return result;
  					}
  
  					var ds;
  					$(window).load(function () {
  						var url = "http://services.odata.org/OData/OData.svc/Products?$format=json&$callback=?";
  						ds = new $.ig.HtmlTableDataSource({
  							callback: render,
  							dataSource: url,
  							schema: {
  								fields: [{
  									name: "Name"
  								}, {
  									name: "Price"
  								}, {
  									name: "Rating"
  								}],
  								searchField: "d"
  							},
  							responseDataKey: "d",
  							responseDataType: "jsonp",
  							sorting: {
  								type: "local",
  								customFunc: myCustomFunc,
  								defaultFields: [{
  									fieldName: "Price"
  								}],
  								defaultDirection: "desc"
  							}
  						});
  						ds.dataBind();
  					});
  				 

• defaultDirection

  Type:

  enumeration

  Default:

  none

  Sorting direction.

  Members

  • none
  • Type:string
  • asc
  • Type:string
  • desc
  • Type:string

  Code Sample

   
  					jsonDs = new $.ig.HtmlTableDataSource({
  						sorting: {
  							type: "local",
  							defaultDirection: "asc"
  						},
  						dataSource: jsonData
  					}).dataBind();
  				 

• defaultFields

  Type:

  array

  Default:

  []

  Elements Type:

  object

  When defaultDirection is different than "none", and defaultFields is specified, data will be initially sorted accordingly, directly after dataBind().

  Code Sample

   
  					var url = "http://services.odata.org/OData/OData.svc/Products?$format=json&$callback=?";
  					var ds = new $.ig.HtmlTableDataSource({
  						callback: render,
  						dataSource: url,
  						schema: {
  							fields: [{
  								name: "Name"
  							}, {
  								name: "Price"
  							}, {
  								name: "Rating"
  							}],
  							searchField: "d"
  						},
  						responseDataKey: "d",
  						responseDataType: "jsonp",
  						sorting: {
  							type: "local",
  							defaultFields: [{
  							fieldName: "Price"
  							}]
  						}
  					});
  				 

• expressions

  Type:

  array

  Default:

  []

  Elements Type:

  object

  A list of sorting expressions , consisting of the following keys (and their respective values): fieldName, direction and compareFunc (optional).

  Code Sample

   
  					ds = new $.ig.HtmlTableDataSource({
  						callback: render,
  						dataSource: url,
  						localSchemaTransform: false,
  						responseDataKey: "d",
  						sorting: {
  							expressions:[
  								{
  									fieldName:"Rating",
  									dir:"asc"
  								},
  								{
  									fieldName:"Price", dir:"asc"
  								}
  							]
  						}
  					});
  				 

• exprString

  Type:

  string

  Default:

  ""

  Takes precedence over experssions, an "SQL-like" encoded expressions string : see sort(). Example col2 > 100 ORDER BY asc.

  Code Sample

   
  					function sortRemote() {
  						ds.settings.sorting.type = "remote";
  
  						// remote sort
  						ds.settings.sorting.exprString = "GNP " + dir;
  						ds.dataBind();
  					}
  				 

• sortUrlAscValueKey

  Type:

  string

  Default:

  null

  URL param value for ascending type of sorting. Default is null and uses OData conventions.

  Code Sample

   
  					var url = "http://services.odata.org/OData/OData.svc/Products?$format=json&$callback=?";
  					var ds = new $.ig.HtmlTableDataSource({
  						callback: render,
  						dataSource: url,
  						schema: {
  							fields: [{
  								name: "Name"
  							}, {
  								name: "Price"
  							}, {
  								name: "Rating"
  							}],
  							searchField: "d"
  						},
  						responseDataKey: "d",
  						responseDataType: "jsonp",
  						sorting: {
  							type: "local",
  							sortUrlAscValueKey: "mySortUrlAscValueKey"
  						}
  					});
  				 

• sortUrlDescValueKey

  Type:

  string

  Default:

  null

  URL param value for descending type of sorting. Default is null and uses OData conventions.

  Code Sample

   
  					var url = "http://services.odata.org/OData/OData.svc/Products?$format=json&$callback=?";
  					var ds = new $.ig.HtmlTableDataSource({
  						callback: render,
  						dataSource: url,
  						schema: {
  							fields: [
  								{name: "Name"},
  								{name: "Price"},
  								{name: "Rating"}
  							],
  							searchField: "d"
  						},
  						responseDataKey: "d",
  						responseDataType: "jsonp",
  						sorting: {
  							type: "local",
  							sortUrlDescValueKey: "mySortUrlDescValueKey"
  						}
  					});
  				 

• sortUrlKey

  Type:

  string

  Default:

  null

  URL param name which specifies how sorting expressions will be encoded in the URL. Default is null and uses OData conventions.

  Code Sample

   
  					var url = "http://services.odata.org/OData/OData.svc/Products?$format=json&$callback=?";
  					var ds = new $.ig.HtmlTableDataSource({
  						callback: render,
  						dataSource: url,
  						schema: {
  							fields: [
  								{name: "Name"},
  								{name: "Price"},
  								{name: "Rating"}
  							],
  							searchField: "d"
  						},
  						responseDataKey: "d",
  						responseDataType: "jsonp",
  						sorting: {
  							type: "local",
  							sortUrlKey: "mySortUrlKey"
  						}
  					});
  				 

• type

  Type:

  enumeration

  Default:

  remote

  Specifies whether sorting will be applied locally or remotely (via a remote request).

  Members

  • remote
  • Type:string
  • local
  • Type:string

  Code Sample

   
  					$(window).load(function () {
  						ds = new $.ig.HtmlTableDataSource({
  							type: "json",
  							dataSource: adventureWorks,
  							sorting: {
  								type: "local",
  								caseSensitive: true
  							}
  						});
  						ds.dataBind();
  					});
  				 

Settings related to built-in summaries functionality.

 
				var url = "http://services.odata.org/OData/OData.svc/Products?$format=json&$callback=?";
				var ds = new $.ig.HtmlTableDataSource({
					callback: render,
					dataSource: url,
					schema: {
						fields: [{
							name: "Name"
						}, {
							name: "Price"
						}, {
							name: "Rating"
						}],
						searchField: "d"
					},
					responseDataKey: "d",
					responseDataType: "jsonp",
					summaries: {
						type: "remote",
						columnSettings: [{
							columnKey: "Price",
							allowSummaries: false,
							summaryOperands: [{
								type: "count",
								active: true,
								order: 0
							}]
						}],
						summariesResponseKey: "d"
					}
				});
			 

• columnSettings

  Type:

  array

  Default:

  []

  Elements Type:

  object

  A list of column settings that specifies custom summaries options per column basis.

  Code Sample

   
  					var url = "http://services.odata.org/OData/OData.svc/Products?$format=json&$callback=?";
  					var ds = new $.ig.HtmlTableDataSource({
  						callback: render,
  						dataSource: url,
  						schema: {
  							fields: [{
  								name: "Name"
  							}, {
  								name: "Price"
  							}, {
  								name: "Rating"
  							}],
  							searchField: "d"
  						},
  						responseDataKey: "d",
  						responseDataType: "jsonp",
  						summaries: {
  							columnSettings: [{
  								columnKey: "Price",
  								allowSummaries: false,
  								summaryOperands: [{
  									type: "count",
  									active: true,
  									order: 0
  								}]
  							}]
  						}
  
  					});
  				 

• summariesResponseKey

  Type:

  string

  Default:

  "summaries"

  Key for retrieving data from the summaries response - used only when summaries are remote.

  Code Sample

   
  					var url = "http://services.odata.org/OData/OData.svc/Products?$format=json&$callback=?";
  					var ds = new $.ig.HtmlTableDataSource({
  						callback: render,
  						dataSource: url,
  						schema: {
  							fields: [{
  								name: "Name"
  							}, {
  								name: "Price"
  							}, {
  								name: "Rating"
  							}],
  							searchField: "d"
  						},
  						responseDataKey: "d",
  						responseDataType: "jsonp",
  						summaries: {
  							summariesResponseKey: "d"
  						}
  					});
  				 

• summaryExecution

  Type:

  enumeration

  Default:

  afterfilteringandpaging

  Determines when the summary values are calculated.

  Members

  • priortofilteringandpaging
  • Type:string
  • afterfilteringbeforepaging
  • Type:string
  • afterfilteringandpaging
  • Type:string

  Code Sample

   
  					var url = "http://services.odata.org/OData/OData.svc/Products?$format=json&$callback=?";
  					var ds = new $.ig.HtmlTableDataSource({
  						callback: render,
  						dataSource: url,
  						schema: {
  							fields: [{
  								name: "Name"
  							}, {
  								name: "Price"
  							}, {
  								name: "Rating"
  							}],
  							searchField: "d"
  						},
  						responseDataKey: "d",
  						responseDataType: "jsonp",
  						summaries: {
  							summaryExecution: "priortofilteringandpaging"
  						}
  					});
  				 

• summaryExprUrlKey

  Type:

  string

  Default:

  "summaries"

  Url key for retrieving data from response - used only when summaries are remote.

  Code Sample

   
  					var url = "http://services.odata.org/OData/OData.svc/Products?$format=json&$callback=?";
  					var ds = new $.ig.HtmlTableDataSource({
  						callback: render,
  						dataSource: url,
  						schema: {
  							fields: [{
  								name: "Name"
  							}, {
  								name: "Price"
  							}, {
  								name: "Rating"
  							}],
  							searchField: "d"
  						},
  						responseDataKey: "d",
  						responseDataType: "jsonp",
  						summaries: {
  							summaryExprUrlKey: "mySummaries"
  						}
  					});
  				 

• type

  Type:

  enumeration

  Default:

  remote

  Specifies whether summaries will be applied locally or remotely (via a remote request).

  Members

  • remote
  • Type:string
  • A remote request is done and URL params encoded.
  • local
  • Type:string
  • Data is paged client-side.

  Code Sample

   
  					var url = "http://services.odata.org/OData/OData.svc/Products?$format=json&$callback=?";
  					var ds = new $.ig.HtmlTableDataSource({
  						callback: render,
  						dataSource: url,
  						schema: {
  							fields: [{
  								name: "Name"
  							}, {
  								name: "Price"
  							}, {
  								name: "Rating"
  							}],
  							searchField: "d"
  						},
  						responseDataKey: "d",
  						responseDataType: "jsonp",
  						summaries: {
  							type: "remote"
  						}
  					});
  				 

Type of the data source.

 
				$(window).load(function () {
					var url = "http://odata.netflix.com/Catalog/Titles?$format=json&$callback=?";
					ds = new $.ig.HtmlTableDataSource({
						type: "remoteUrl",
						callback: render,
						dataSource: url,
						schema: oDataSchema,
						responseDataKey : "d.results",
						responseDataType: "jsonp",
					});
					ds.dataBind();
				});
			 

Specifies an update remote URL, to which an AJAX request will be made as soon as saveChages() is called.

 
				var url = "http://services.odata.org/OData/OData.svc/Products?$format=json&$callback=?";
				var ds = new $.ig.HtmlTableDataSource({
					callback: render,
					dataSource: url,
					schema: {
						fields: [{
							name: "Name"
						}, {
							name: "Price"
						}, {
							name: "Rating"
						}],
						searchField: "d"
					},
					responseDataKey: "d",
					responseDataType: "jsonp",
					updateUrl: "http://example.com/myUpdateUrl/"

				});
			 

Event that is fired after URL parameters are encoded (When a remote request is done). Can point to a function name or the function object itself.

 
				var render = function (success, error) {
					if (success) {
						var template = "<tr><td>${Name}</td><td>${Price}</td><td>${Rating}</td></tr>",
						resultHtml = $.ig.tmpl(template, ds.dataView());
						$("#table").html(resultHtml);
					} else {
						alert(error);
					}
				}

				var myUrlParamsEncoded = function (item, params) {
					alert("myUrlParamsEncoded");
				}

				var ds;
				$(window).load(function () {
					var url = "http://services.odata.org/OData/OData.svc/Products?$format=json&$callback=?";
					ds = new $.ig.HtmlTableDataSource({
						callback: render,
						dataSource: url,
						schema: {
							fields: [{
								name: "Name"
							}, {
								name: "Price"
							}, {
								name: "Rating"
							}],
							searchField: "d"
						},
						responseDataKey: "d",
						responseDataType: "jsonp",
						urlParamsEncoded: myUrlParamsEncoded
					});
					ds.dataBind();
				});
			 

Event that is fired before URL parameters are encoded. Can point to a function name or the function object itself.

 
				var render = function (success, error) {
					if (success) {
						var template = "<tr><td>${Name}</td><td>${Price}</td><td>${Rating}</td></tr>",
						resultHtml = $.ig.tmpl(template, ds.dataView());
						$("#table").html(resultHtml);
					} else {
						alert(error);
					}
				}

				var myUrlParamsEncoding = function (item, params) {
					alert("myUrlParamsEncoding");
				}

				var ds;
				$(window).load(function () {
					var url = "http://services.odata.org/OData/OData.svc/Products?$format=json&$callback=?";
					ds = new $.ig.HtmlTableDataSource({
						callback: render,
						dataSource: url,
						schema: {
							fields: [{
								name: "Name"
							}, {
								name: "Price"
							}, {
								name: "Rating"
							}],
							searchField: "d"
						},
						responseDataKey: "d",
						responseDataType: "jsonp",
						urlParamsEncoding: myUrlParamsEncoding
					});
					ds.dataBind();
				});