Configure datasource settings.

 
          var ds = new $.ig.TreeHierarchicalDataSource({
              dataSource: products
          });
          ds.dataBind();
      

• aggregateTransactions

  Inherited

  Type:

  bool

  Default:

  false

  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.

  Code Sample

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

• autoCommit

  Inherited

  Type:

  bool

  Default:

  false

  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().

  Code Sample

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

• callback

  Inherited

  Type:

  function

  Default:

  null

  Callback function to call when data binding is complete.

  Code Sample

   
  				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.TreeHierarchicalDataSource({
  						type: "remoteUrl",
  						callback: render,
  						dataSource: url,
  						schema: oDataSchema,
  						responseDataKey : "d.results",
  						responseDataType: "jsonp",
  					});
  					ds.dataBind();
  				});
  			 

• callee

  Inherited

  Type:

  object

  Default:

  null

  Object on which to invoke the callback function.

  Code Sample

   
  				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.TreeHierarchicalDataSource({
  						dataSource: products,
  						callee: Bob,
  						callback: Bob.greet
  					});
  
  					ds.dataBind();
  				});
  			 

• data

  Inherited

  Type:

  array

  Default:

  []

  Elements Type:

  object

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

  Code Sample

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

• dataBinding

  Inherited

  Type:

  object

  Default:

  null

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

  Code Sample

   
  				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.TreeHierarchicalDataSource({
  						dataBinding: myDataBinding,
  						dataSource: products
  					});
  				});
  			 

• dataBound

  Inherited

  Type:

  object

  Default:

  null

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

  Code Sample

   
  				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.TreeHierarchicalDataSource({
  						dataBound: myDataBound
  					});
  
  					ds.dataBind();
  
  				});
  			 

• dataSource

  Inherited

  Type:

  object

  Default:

  null

  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.

  Code Sample

   
  				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.TreeHierarchicalDataSource({type: "json", dataSource: jsonData, schema: jsonSchema});
  				ds.dataBind();
  			 

• fields

  Inherited

  Type:

  array

  Default:

  []

  Elements Type:

  object

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

  Code Sample

   
  				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.TreeHierarchicalDataSource({
  						dataSource: products,
  						fields: [{
  							name: "ProductID",
  							type: "number"
  						}, {
  							name: "Name",
  							type: "string"
  						}, {
  							name: "ProductNumber",
  							type: "string"
  						}]
  					});
  
  					ds.dataBind();
  				});
  			 

• filtering

  Inherited

  Type:

  object

  Default:

  {}

  Settings related to built-in filtering functionality.

  Code Sample

   
  				jsonDs = new $.ig.TreeHierarchicalDataSource( {
  					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.TreeHierarchicalDataSource( {
    						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.TreeHierarchicalDataSource( {
    						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.TreeHierarchicalDataSource({
    							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.TreeHierarchicalDataSource({
    							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.TreeHierarchicalDataSource({
    						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.TreeHierarchicalDataSource({
    							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.TreeHierarchicalDataSource({
    							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.TreeHierarchicalDataSource({
    							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

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

• groupby

  Inherited

  Type:

  object

  Default:

  {}

  Settings related to built-in group by functionality.

  Code Sample

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

  • defaultCollapseState

    Type:

    bool

    Default:

    false

    Default collapse state.

    Code Sample

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

  • 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.TreeHierarchicalDataSource({
    						dataSource: products,
    						groupby: {
    							pagingMode: "allRecords"
    						}
    					});
    				 

• id

  Inherited

  Type:

  string

  Default:

  "ds"

  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.

  Code Sample

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

• localSchemaTransform

  Inherited

  Type:

  bool

  Default:

  true

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

  Code Sample

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

• outputResultsName

  Inherited

  Type:

  string

  Default:

  null

  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.

  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.TreeHierarchicalDataSource({
  						callback: render,
  						dataSource: url,
  						schema: {
  							fields: [{
  								name: "Name"
  							}, {
  								name: "Price"
  							}, {
  								name: "Rating"
  							}],
  							searchField: "d"
  						},
  						responseDataKey: "d",
  						responseDataType: "jsonp",
  						outputResultsName: "myOutputResultsName"
  					});
  					ds.dataBind();
  				});
  			 

• paging

  Inherited

  Type:

  object

  Default:

  {}

  Settings related to built-in paging functionality.

  Code Sample

   
  				$(window).load(function () {
  					ds = new $.ig.TreeHierarchicalDataSource({
  						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.TreeHierarchicalDataSource({
    						dataSource: products,
    						paging: {
    							enabled: true,
    							appendPage : true
    						}
    					});
    				 

  • enabled

    Type:

    bool

    Default:

    false

    Paging is not enabled by default.

    Code Sample

     
    					ds = new $.ig.TreeHierarchicalDataSource({
    						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.TreeHierarchicalDataSource({
    						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.TreeHierarchicalDataSource({
    						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.TreeHierarchicalDataSource({
    						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.TreeHierarchicalDataSource({
    						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.TreeHierarchicalDataSource( {
    						filtering: {
    							type: "local",
    							caseSensitive: true,
    							applyToAllData: true
    						},
    						dataSource: jsonData
    					}).dataBind();
    				 

• primaryKey

  Inherited

  Type:

  string

  Default:

  null

  The unique field identifier.

  Code Sample

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

• requestType

  Inherited

  Type:

  string

  Default:

  "GET"

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

  Code Sample

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

• responseContentType

  Inherited

  Type:

  string

  Default:

  null

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

  Code Sample

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

• responseDataKey

  Inherited

  Type:

  string

  Default:

  null

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

  Code Sample

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

• responseDataType

  Inherited

  Type:

  enumeration

  Default:

  null

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

  Members

  • json
  • Type:string
  • xml
  • Type:string
  • html
  • Type:string
  • script
  • Type:string
  • jsonp
  • Type:string
  • text
  • Type:string

  Code Sample

   
  				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.TreeHierarchicalDataSource({
  						type: "remoteUrl",
  						callback: render,
  						dataSource: url,
  						schema: oDataSchema,
  						responseDataKey: "d.results",
  						responseDataType: "jsonp",
  					});
  					ds.dataBind();
  				});
  			 

• responseTotalRecCountKey

  Inherited

  Type:

  string

  Default:

  null

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

  Code Sample

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

• rowAdded

  Inherited

  Type:

  function

  Default:

  null

  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.

  Code Sample

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

• rowDeleted

  Inherited

  Type:

  function

  Default:

  null

  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.

  Code Sample

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

• rowInserted

  Inherited

  Type:

  function

  Default:

  null

  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.

  Code Sample

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

• rowUpdated

  Inherited

  Type:

  function

  Default:

  null

  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.

  Code Sample

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

• schema

  Inherited

  Type:

  object

  Default:

  null

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

  Code Sample

   
  				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.TreeHierarchicalDataSource({
  					type: "json",
  					dataSource: jsonData,
  					schema: jsonSchema
  				});
  				ds.dataBind();
  			 

• serializeTransactionLog

  Inherited

  Type:

  bool

  Default:

  true

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

  Code Sample

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

• sorting

  Inherited

  Type:

  object

  Default:

  {}

  Settings related to built-in sorting functionality.

  Code Sample

   
  				$(window).load(function () {
  					ds = new $.ig.TreeHierarchicalDataSource({
  						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.TreeHierarchicalDataSource({
    						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.TreeHierarchicalDataSource({
    							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.TreeHierarchicalDataSource({
    							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.TreeHierarchicalDataSource({
    							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.TreeHierarchicalDataSource({
    							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.TreeHierarchicalDataSource({
    						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.TreeHierarchicalDataSource({
    						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.TreeHierarchicalDataSource({
    						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.TreeHierarchicalDataSource({
    						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.TreeHierarchicalDataSource({
    						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.TreeHierarchicalDataSource({
    						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.TreeHierarchicalDataSource({
    							type: "json",
    							dataSource: adventureWorks,
    							sorting: {
    								type: "local",
    								caseSensitive: true
    							}
    						});
    						ds.dataBind();
    					});
    				 

• summaries

  Inherited

  Type:

  object

  Default:

  {}

  Settings related to built-in summaries functionality.

  Code Sample

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

• treeDS

  Type:

  object

  Default:

  {}

  Configure tree datasource specific settings.

  Code Sample

   
              var ds = new $.ig.TreeHierarchicalDataSource({
                  dataSource: products,
                  treeDS: {
                      childDataKey: "Products",
                      initialExpandDepth: 10,
                      propertyDataLevel: "dataLevel"
                  }
              });
              

  • childDataKey

    Type:

    string

    Default:

    null

    Property name of the array of child data in a hierarchical data source.

    Code Sample

     
            var ds = new $.ig.TreeHierarchicalDataSource({
                dataSource: products,
                treeDS: {
                    childDataKey: "Products"
                }
            });
                  

  • customEncodeUrlFunc

    Type:

    function

    Default:

    null

    Specifies a custom function to be called when requesting data to the server - usually when expanding/collapsing record. If set the function should return the encoded URL. It takes as parameters: data record(type: object), expand - (type: bool).

    Code Sample

     
     				var ds = new $.ig.TreeHierarchicalDataSource({
     								dataSource: products,
     								treeDS: {
     									customEncodeUrlFunc: function(record, expand){
     										var dsUrl = ds.settings.treeDS.dataSourceUrl;
     										var path = ds.getPathBy(record);
     										return dsUrl + "?" + "path=" + path + "&depth= " + record[ds.settings.treeDS.propertyDataLevel];
     									}
     								}
     							});
     				 

  • dataSourceUrl

    Type:

    string

    Default:

    null

    Specifies a remote URL as a data source, from which data will be retrieved using an AJAX call ($.ajax).

    Code Sample

     
            var ds = new $.ig.TreeHierarchicalDataSource({
                treeDS: {
                    dataSourceUrl: "/api/products"
                }
            });
                  

  • enableRemoteLoadOnDemand

    Type:

    bool

    Default:

    false

    Specifies if data is loaded on demand from a remote server. Default is false.

    Code Sample

     
            var ds = new $.ig.TreeHierarchicalDataSource({
                treeDS: {
                    dataSourceUrl: "/api/products",
                    enableRemoteLoadOnDemand: true
                }
            });
                  

  • filtering

    Type:

    object

    Default:

    {}

    Configure datasource filtering settings.

    Code Sample

     
            var ds = new $.ig.TreeHierarchicalDataSource({
                dataSource: products,
                filtering: {
                  enabled: true,
                  type: "local"
                },
                treeDS: {
                    filtering: {
                        displayMode: "showWithAncestorsAndDescendants"
                    }
                }
            });
                  

    • displayMode

      Type:

      enumeration

      Default:

      showWithAncestors

      If displayMode is showWithAncestorsAndDescendants, show all records that match filtering conditions and their child records, even if child records don't match filtering conditions. If displayMode is showWithAncestors show only those records that match filtering conditions and do not show child records(if any) that don't match filtering conditions.

      Code Sample

       
              var ds = new $.ig.TreeHierarchicalDataSource({
                  dataSource: products,
                  filtering: {
                    enabled: true,
                    type: "local"
                  },
                  treeDS: {
                      filtering: {
                          displayMode: "showWithAncestorsAndDescendants"
                      }
                  }
              });
                        

    • fromLevel

      Type:

      number

      Default:

      0

      Specifies from which data bound level to be applied filtering - 0 is the first level.

      Code Sample

       
              var ds = new $.ig.TreeHierarchicalDataSource({
                  dataSource: products,
                  filtering: {
                    enabled: true,
                    type: "local"
                  },
                  treeDS: {
                      filtering: {
                          fromLevel: 1
                      }
                  }
              });
                        

    • matchFiltering

      Type:

      string

      Default:

      "__matchFiltering"

      Filtering data source specific property - name of property in dataRecord object - indicates whether dataRow matches filtering conditions. It is used ONLY when filtering is applied.

      Code Sample

       
              var ds = new $.ig.TreeHierarchicalDataSource({
                  dataSource: products,
                  filtering: {
                    enabled: true,
                    type: "local"
                  },
                  treeDS: {
                      filtering: {
                          matchFiltering: "isFiltered"
                      }
                  }
              });
                        

    • toLevel

      Type:

      number

      Default:

      -1

      Specifies to which data bound level to be applied filtering - if -1 filtering should be applied to the last data bound level.

      Code Sample

       
              var ds = new $.ig.TreeHierarchicalDataSource({
                  dataSource: products,
                  filtering: {
                    enabled: true,
                    type: "local"
                  },
                  treeDS: {
                      filtering: {
                          toLevel: 5
                      }
                  }
              });
                        

  • foreignKey

    Type:

    string

    Default:

    null

    Unique identifier used in a self-referencing flat data source. Used with primaryKey to create a relationship among flat data sources.

    Code Sample

     
            var ds = new $.ig.TreeHierarchicalDataSource({
                dataSource: products,
                treeDS: {
                    foreignKey: "ParentID"
                }
            });
                  

  • initialExpandDepth

    Type:

    number

    Default:

    -1

    Specifies the depth down to which the tree grid would be expanded upon initial render. To expand all rows set value to -1. Default is -1.

    Code Sample

     
            var ds = new $.ig.TreeHierarchicalDataSource({
                dataSource: products,
                treeDS: {
                    initialExpandDepth: 5
                }
            });
                  

  • initialFlatDataView

    Type:

    bool

    Default:

    false

    If set to TRUE it is expected that the source of data is normalized and transformed(has set dataLevel and expansion state). The source of data is used as flatDataView. Usually used when the paging is remote and paging mode is allLevels, or features are remote(and the processing of the returned result should be made on the server).

    Code Sample

     
    				var ds = new $.ig.TreeHierarchicalDataSource({
    								dataSource: products,
    								treeDS: {
    									initialFlatDataView: true
    								}
    							});
    				 

  • paging

    Type:

    object

    Default:

    {}

    Configure datasource paging settings.

    Code Sample

     
            var ds = new $.ig.TreeHierarchicalDataSource({
                dataSource: products,
                paging: {
                    enabled : true, 
                    pageSize:10, 
                    type: "local" 
                },
                treeDS: {
                    paging: {
                      mode: "allLevels"
                    }
                }
            });
                  

    • contextRowMode

      Type:

      enumeration

      Default:

      none

      When data flows to the next page there are a couple of different modes that can help communicate the context of a leaf level row. When mode option is 'rootLevelOnly' then the context row always shows the value of the contextRowRootText option.

      Members

      • none
      • Type:string
      • Does not render the contextual row.
      • parent
      • Type:string
      • Renders a read-only representation of the immediate parent row.
      • breadcrumb
      • Type:string
      • Renders a read-only breadcrumb trail representing the full path through all ancestors.

      Code Sample

       
      					var ds = new $.ig.TreeHierarchicalDataSource({
      								dataSource: products,
      								paging: {
      									enabled : true,
      									pageSize:10,
      									type: "local",
      									contextRowMode: "breadcrumb"
      								},
      								treeDS: {
      									paging: {
      									  mode: "allLevels"
      									}
      								}
      							});
      					 

    • mode

      Type:

      enumeration

      Default:

      rootLevelOnly

      Sets gets paging mode.

      Members

      • allLevels
      • Type:string
      • includes all visible records in paging.

      Code Sample

       
              var ds = new $.ig.TreeHierarchicalDataSource({
                  dataSource: products,
                  paging: {
                      enabled : true, 
                      pageSize:10, 
                      type: "local" 
                  },
                  treeDS: {
                      paging: {
                        mode: "allLevels"
                      }
                  }
              });
                        

  • persistExpansionStates

    Type:

    bool

    Default:

    false

    If true save expansion states in internal list and send it to the server. Applying to one of the main constraint of the REST architecture Stateless Interactions - client specific data(like expansion states) should NOT be stored on the server.

    Code Sample

     
    				var ds = new $.ig.TreeHierarchicalDataSource({
    								dataSource: products,
    								treeDS: {
    									persistExpansionStates: true
    								}
    							});
    				 

  • propertyDataLevel

    Type:

    string

    Default:

    "__ig_options.dataLevel"

    The name of the property that keeps track of the level in the hierarchy.Defaults to __ig_options.dataLevel.

    Code Sample

     
            var ds = new $.ig.TreeHierarchicalDataSource({
                dataSource: products,
                treeDS: {
                  propertyDataLevel: "_dataLevel"
                }
            });
                  

  • propertyExpanded

    Type:

    string

    Default:

    "__ig_options.expanded"

    The name of the property that keeps track of the expansion state of a data item. Defaults to __ig_options.expanded.

    Code Sample

     
            var ds = new $.ig.TreeHierarchicalDataSource({
                dataSource: products,
                treeDS: {
                  propertyExpanded: "_expanded"
                }
            });
                  

  • requestDataCallback

    Type:

    function

    Default:

    null

    Specifies a custom function to be called when the remote request for data has finished.

    Code Sample

     
            var ds = new $.ig.TreeHierarchicalDataSource({
                treeDS: {
                  dataSourceUrl: "/api/products",
                  requestDataCallback: function () {
    
                  }
                }
            });
                  

  • requestDataErrorCallback

    Type:

    function

    Default:

    null

    Specifies a custom function to be called when the remote request for data has finished with an error.

    Code Sample

     
            var ds = new $.ig.TreeHierarchicalDataSource({
                treeDS: {
                  dataSourceUrl: "/api/products",
                  requestDataErrorCallback: function () {
    
                  }
                }
            });
                  

  • requestDataSuccessCallback

    Type:

    function

    Default:

    null

    Specifies a custom function to be called when the remote request for data has finished successfully.

    Code Sample

     
            var ds = new $.ig.TreeHierarchicalDataSource({
                treeDS: {
            dataSourceUrl: "/api/products",
            requestDataSuccessCallback: function () {
            
            }
                }
            });
                  

  • sorting

    Type:

    object

    Default:

    {}

    Configure datasource sorting settings.

    Code Sample

     
            var ds = new $.ig.TreeHierarchicalDataSource({
                dataSource: products,
                treeDS: {
                    sorting: {
              fromLevel: 1,
              toLevel: 5
            }
                }
            });
                  

    • fromLevel

      Type:

      number

      Default:

      0

      Specifies from which data bound level to be applied sorting - 0 is the first level.

      Code Sample

       
              var ds = new $.ig.TreeHierarchicalDataSource({
                  dataSource: products,
                  treeDS: {
                      sorting: {
                fromLevel: 1,
                toLevel: 5
              }
                  }
              });
                        

    • toLevel

      Type:

      number

      Default:

      -1

      Specifies to which data bound level to be applied sorting - if -1 sorting should be applied to the last data bound level.

      Code Sample

       
              var ds = new $.ig.TreeHierarchicalDataSource({
                  dataSource: products,
                  treeDS: {
                      sorting: {
                fromLevel: 1,
                toLevel: 5
              }
                  }
              });
                        

• type

  Inherited

  Type:

  enumeration

  Default:

  unknown

  Type of the data source.

  Members

  • json
  • Type:string
  • Specifies that the data source is an already evaluated JSON (JavaScript object/array) or a string that can be evaluated to JSON.
  • xml
  • Type:string
  • Specifies that the data source is a XML Document object or a string that can be evaluated to XML.
  • unknown
  • Type:string
  • Specifies that the data source is of unknown type. In that case it will be analyzed and automatically detected if possible.
  • array
  • Type:string
  • Specifies that the data source is a simple array of objects.
  • function
  • Type:string
  • Specifies that the data source points to a function. During data binding the function will be called and the result will be assumed to be an array of objects.
  • htmlTableString
  • Type:string
  • Specifies that the data source points to a string that represents a HTML table.
  • htmlTableId
  • Type:string
  • Specifies that the data source points to an ID of a HTML Table element that's loaded on the page.
  • htmlTableDom
  • Type:string
  • The data source points to a DOM object that is of TABLE type.
  • invalid
  • Type:string
  • Set whenever data source is analyzed (in case its type is unknown) and the type cannot be detected.
  • remoteUrl
  • Type:string
  • Specifies that the data source points to a remote URL, from which data will be retrieved using an AJAX call ($.ajax).
  • htmlListDom
  • Type:string
  • The data source points to a DOM object that is of UL/OL type.
  • htmlSelectDom
  • Type:string
  • The data source points to a DOM object that is of SELECT type.
  • empty
  • Type:string

  Code Sample

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

• updateUrl

  Inherited

  Type:

  string

  Default:

  null

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

  Code Sample

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

• urlParamsEncoded

  Inherited

  Type:

  object

  Default:

  null

  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.

  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 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.TreeHierarchicalDataSource({
  						callback: render,
  						dataSource: url,
  						schema: {
  							fields: [{
  								name: "Name"
  							}, {
  								name: "Price"
  							}, {
  								name: "Rating"
  							}],
  							searchField: "d"
  						},
  						responseDataKey: "d",
  						responseDataType: "jsonp",
  						urlParamsEncoded: myUrlParamsEncoded
  					});
  					ds.dataBind();
  				});
  			 

• urlParamsEncoding

  Inherited

  Type:

  object

  Default:

  null

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

  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 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.TreeHierarchicalDataSource({
  						callback: render,
  						dataSource: url,
  						schema: {
  							fields: [{
  								name: "Name"
  							}, {
  								name: "Price"
  							}, {
  								name: "Rating"
  							}],
  							searchField: "d"
  						},
  						responseDataKey: "d",
  						responseDataType: "jsonp",
  						urlParamsEncoding: myUrlParamsEncoding
  					});
  					ds.dataBind();
  				});