Specifies the data binding properties and keys.

 
            //Initialize
            $(".selector").igListView({
                dataSource: northwindEmployees,
                bindings: {
                    countKey: "count",
                    countXPath: "@count",
                    descriptionKey: "description",
                    descriptionXPath: "@description",
                    detailsTitleKey: "title",
                    detailsTitleXPath: "@title",
                    headerKey: "header",
                    headerXPath: "@header",
                    imageUrlKey: "imageurl",
                    imageUrlXPath: "@imageurl",
                    isDividerKey: "isdivider",
                    navigateUrlKey: "navigateurl",
                    navigateUrlXPath: "@navigateurl",
                    primaryKey: "ID",
                    textKey: "text",
                    textXPath: "@text",
                    customBindings: [
                        {
                            fieldName: "CategoryName",
                            dataType: "string"
                        }
                    ]
                }
            });
            
            //Get
            var bindings = $(".selector").igListView("option", "bindings");
      

• countKey

  Type:

  string

  Default:

  "Count"

  Specifies the name of the data source property the value of which would be used as a count of the node.

• countXPath

  Type:

  string

  Default:

  "@Count"

  Specifies the XPath to the node count. Used in client-only binding directly to XML.

• customBindings

  Type:

  array

  Default:

  []

  Elements Type:

  object

  A list of objects of custom bindings. This will bring in extra data to be used in item or details templates.
  Each item should be an object with key/value pairs of "fieldName", "dataType", and "format".

• descriptionKey

  Type:

  string

  Default:

  "Description"

  Specifies the name of the data source property the value of which would be used as a count of the node.

• descriptionXPath

  Type:

  string

  Default:

  "@Description"

  Specifies the XPath to the list item description Used in client-only binding directly to XML.

• detailsTitleKey

  Type:

  string

  Default:

  "Title"

  Specifies the name of the data source property the value of which would be the Title of a sub page for a node.

• detailsTitleXPath

  Type:

  string

  Default:

  "@Title"

  Specifies the XPath to the title attribute/node. Used in client-only binding directly to XML.

• headerKey

  Type:

  string

  Default:

  "Header"

  Specifies the name of the data source property the value of which would be used as a count of the node.

• headerXPath

  Type:

  string

  Default:

  "@Header"

  Specifies the XPath to the list item header. Used in client-only binding directly to XML.

• imageUrlKey

  Type:

  string

  Default:

  "ImageUrl"

  Specifies the name of the data source property the value of which would be used as a URL
  for the node image.

• imageUrlXPath

  Type:

  string

  Default:

  "@ImageUrl"

  Specifies the XPath to the image URL attribute/node. Used in client-only binding directly to XML.

• isDividerKey

  Type:

  string

  Default:

  "IsDivider"

  Specifies the name of the data source property which will be used to determine if an item represents a read-only list divider.

• navigateUrlKey

  Type:

  string

  Default:

  "NavigateUrl"

  Specifies the name of the data source property the value of which would be used as an href
  attribute for the node anchor.

• navigateUrlXPath

  Type:

  string

  Default:

  "@NavigateUrl"

  Specifies the XPath to the navigate URL attribute/node. Used in client-only binding directly to XML.

• primaryKey

  Type:

  string

  Default:

  null

  Specifies the name of the data source property the value of which is the primary key attribute
  for the data. This property is used when load on demand is enabled and if specified the node paths
  would be generated using primary keys instead of indices.

• textKey

  Type:

  string

  Default:

  "Text"

  Specifies the name of the data source property the value of which would be the node text.

• textXPath

  Type:

  string

  Default:

  "@Text"

  Specifies the XPath to the text attribute/node. Used in client-only binding directly to XML.

The swatch to apply to count bubbles (if present).

 
            //Initialize
            $(".selector").igListView({
                countTheme: "c"
            });
            
            //Get
            var countTheme = $(".selector").igListView("option", "countTheme");
      

If this option is set to true, sub pages for local data are created the first time the list view is bound.

 
            //Initialize
            $(".selector").igListView({
                createSubPagesOnInit: true
            });
            
            //Get
            var toCreateSubPagesOnInit = $(".selector").igListView("option", "createSubPagesOnInit"); 
      

Can be any valid data source accepted by $.ig.DataSource, or an instance of an $.ig.DataSource itself.

 
            //Initialize
            $(".selector").igListView({
                dataSource: northwindEmployees
            });
            
            //Get
            var dataSource = $(".selector").igListView("option", "dataSource");
      

Explicitly set data source type (such as "json"). Please refer to the documentation of $.ig.DataSource and its type property.

 
            //Initialize
            $(".selector").igListView({
                dataSourceType: "json"
            });
            
            //Get
            var dataSourceType = $(".selector").igListView("option", "dataSourceType");
      

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

 
            //Initialize
            $(".selector").igListView({
                dataSourceUrl: "/Products"
            });
            
            //Get
            var dataSourceUrl = $(".selector").igListView("option", "dataSourceUrl");
      

Enables formatting of the dates as UTC. Note that this may be desirable when the dates are coming from a backend, encoded as UTC. Otherwise, if dates are created on the client (in the browser), most probably keeping enableUTCDates to false is the desired behavior.

A list of list features definitions: sorting, filtering, etc. Each feature goes with its separate options that are documented for the feature accordingly.

 
            //Initialize
            $(".selector").igListView({
                features: [
                    {
                        name: "Sorting"
                    }
                ]
            });
            
            //Get
            var features = $(".selector").igListView("option", "features");
      

Whether to show no image, an icon, or a thumbnail.

 
            //Initialize
            $(".selector").igListView({
                imageMode: "icon"
            });
            
            //Get
            var imageMode = $(".selector").igListView("option", "imageMode");
      

Whether the list view should appear inset in the page.

 
            //Initialize
            $(".selector").igListView({
                inset: true
            });
            
            //Get
            var inset = $(".selector").igListView("option", "inset");
      

IG templating style template that will be used to render details about list items in a sub page.

 
            //Initialize
            $(".selector").igListView({
                itemDetailsTemplate: "<div><h2>${Title}</h2><p>${Description}</p></div>"
            });
            
            //Get
            var itemDetailsTemplate = $(".selector").igListView("option", "itemDetailsTemplate");
      

Whether to show a heading tag in the LI. Can be H1 to H6 depending upon value.

 
            //Initialize
            $(".selector").igListView({
                itemHeaderSize: "h3"
            });
            
            //Get
            var itemHeaderSize = $(".selector").igListView("option", "itemHeaderSize");
      

IG templating style template that will be used to render list items.

 
            //Initialize
            $(".selector").igListView({
                itemTemplate: "<div><h2>${Name}</h2><p>${Phone}</p></div>"
            });
            
            //Get
            var itemTemplate = $(".selector").igListView("option", "itemTemplate");
      

The swatch applied to list items. If null, it is determined from the parent(s) or defaults to "c".

 
            //Initialize
            $(".selector").igListView({
                itemTheme: "c"
            });
            
            //Get
            var itemTheme = $(".selector").igListView("option", "itemTheme");
      

The swatch to apply to list dividers.

 
            //Initialize
            $(".selector").igListView({
                listDividerTheme: "b"
            });
            
            //Get
            var listDividerTheme = $(".selector").igListView("option", "listDividerTheme");
      

If this option is set to false, the data to which the list is bound will be used "as is" with no additional transformations based on bindings.

 
            //Initialize
            $(".selector").igListView({
                localSchemaTransform: true
            });
            
            //Get
            var localSchemaTransform = $(".selector").igListView("option", "localSchemaTransform");
      

Indicates if an ol or ul should be used as the main element for a databound list.

 
            //Initialize
            $(".selector").igListView({
                numberedList: false
            });
            
            //Get
            var numberedList = $(".selector").igListView("option", "numberedList");
      

See $.ig.DataSource. This is basically the property in the responses where data records are held, if the response is wrapped.

 
            //Initialize
            $(".selector").igListView({
                responseDataKey: "Products"
            });
            
            //Get
            var responseDataKey = $(".selector").igListView("option", "responseDataKey");
      

Explicitly set response type (such as "json"). Please refer to the documentation of $.ig.DataSource and its type property.

See $.ig.DataSource. property in the response specifying the total number of records on the server.

 
            //Initialize
            $(".selector").igListView({
                responseTotalRecCountKey: "totalCount"
            });
            
            //Get
            var responseTotalRecCountKey = $(".selector").igListView("option", "responseTotalRecCountKey");
      

The swatch to apply to the search (filter/sort) tray footer.

 
            //Initialize
            $(".selector").igListView({
                searchFooterTheme: "d"
            });
            
            //Get
            var searchFooterTheme = $(".selector").igListView("option", "searchFooterTheme");
      

The swatch to apply to the search (filter/sort) tray.

 
            //Initialize
            $(".selector").igListView({
                searchTheme: "c"
            });
            
            //Get
            var searchTheme = $(".selector").igListView("option", "searchTheme");
      

The text displayed in the search tray footer when it is collapsed and all the states are default.
If null, uses $.ig.mobileListView.locale.searchTrayExpandLabel.

 
            //Initialize
            $(".selector").igListView({
                searchTrayExpandLabel: "Expand/Collapse"
            });
            
            //Get
            var searchTrayExpandLabel = $(".selector").igListView("option", "searchTrayExpandLabel");
      

Whether to show a count bubble.

 
            //Initialize
            $(".selector").igListView({
                showCount: true
            });
            
            //Get
            var showCount = $(".selector").igListView("option", "showCount");
      

The swatch applied to the headers of sub pages.

 
            //Initialize
            $(".selector").igListView({
                subPageHeaderTheme: "b"
            });
            
            //Get
            var subPageHeaderTheme = $(".selector").igListView("option", "subPageHeaderTheme");