データ バインド プロパティとキーを指定します。

 
            //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

  タイプ:

  string

  デフォルト:

  "Count"

  その値がノードのカウントとして使用される、data source プロパティの名前を指定します。

• countXPath

  タイプ:

  string

  デフォルト:

  "@Count"

  ノード カウントへの XPath を指定します。クライアントのみのXML への直接バインディングで使用されます。

• customBindings

  タイプ:

  array

  デフォルト:

  []

  要素タイプ:

  object

  カスタム バインディングのオブジェクト リスト。これによって追加データが item または details テンプレートで使用されることになります。
  各項目は、"fieldName"、"dataType"、および "format" のキー/値のペアを含むオブジェクトになります。

• descriptionKey

  タイプ:

  string

  デフォルト:

  "Description"

  その値がノードのカウントとして使用される、data source プロパティの名前を指定します。

• descriptionXPath

  タイプ:

  string

  デフォルト:

  "@Description"

  クライアントのみの XML への直接バインディングで使用されるリスト項目記述への XPath を指定します。

• detailsTitleKey

  タイプ:

  string

  デフォルト:

  "Title"

  その値がノードのサブ ページのタイトルになる、data source プロパティの名前を指定します。

• detailsTitleXPath

  タイプ:

  string

  デフォルト:

  "@Title"

  タイトル属性／ノードへの XPath を指定します。クライアントのみのXML への直接バインディングで使用されます。

• headerKey

  タイプ:

  string

  デフォルト:

  "Header"

  その値がノードのカウントとして使用される、data source プロパティの名前を指定します。

• headerXPath

  タイプ:

  string

  デフォルト:

  "@Header"

  リスト項目ヘッダーへの XPath を指定します。クライアントのみのXML への直接バインディングで使用されます。

• imageUrlKey

  タイプ:

  string

  デフォルト:

  "ImageUrl"

  データ ソース プロパティの名前を指定します。
  このプロパティの値が当該のノードの画像 URL として使用されることになります。

• imageUrlXPath

  タイプ:

  string

  デフォルト:

  "@ImageUrl"

  画像 URL 属性/ノードへの XPath を指定します。クライアントのみのXML への直接バインディングで使用されます。

• isDividerKey

  タイプ:

  string

  デフォルト:

  "IsDivider"

  項目が読み取り専用のリスト ディバイダーを表すかどうかを決定するために使用される data source プロパティの名前を指定します。

• navigateUrlKey

  タイプ:

  string

  デフォルト:

  "NavigateUrl"

  データ ソース プロパティの名前を指定します。
  このプロパティの値がノード アンカーの href 属性として使用されることになります。

• navigateUrlXPath

  タイプ:

  string

  デフォルト:

  "@NavigateUrl"

  ナビゲート URL 属性/ノードへの XPath を指定します。クライアントのみのXML への直接バインディングで使用されます。

• primaryKey

  タイプ:

  string

  デフォルト:

  null

  データ ソース プロパティの名前を指定します。
  このプロパティの値が当該のデータのプライマリ キー属性になります。このプロパティは、ロードオンデマンドが有効なときに使用されます。このプロパティを使用すると、ノード パスはインデックスではなく
  プライマリ キーに基づいて生成されることになります。

• textKey

  タイプ:

  string

  デフォルト:

  "Text"

  その値がノード テキストになる、data source プロパティの名前を指定します。

• textXPath

  タイプ:

  string

  デフォルト:

  "@Text"

  テキスト属性/ノードへの XPath を指定します。クライアントのみのXML への直接バインディングで使用されます。

カウント バブルに適用する見本 (ある場合) 。

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

このオプションを True に設定すると、ローカル データのサブ ページは、リスト ビューが最初にバインドされるときに作成されます。

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

$.ig.DataSource が受け入れる有効なデータ ソースまたは $.ig.DataSource 自体のインスタンスが可能です。

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

データ ソースのタイプ ("json" など) を明示的に設定します。$.ig.DataSource とそのタイプ プロパティのドキュメントを参照してください。

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

リモート URL をデータ ソースとして指定します。そこから AJAX コール ($.ajax) を使用してデータが取得されます。

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

UTC として日付の書式を有効にします。注: UTC としてエンコードし、日付がバックエンドから場合に望ましい場合があります。日付がクライアント ( ブラウザー) で作成される場合、enableUTCDates を false に設定することが望ましいです。

並べ替え、フィルタリングなどのリスト機能の定義のリスト。各機能はそれぞれ別のオプションを使用します。オプションについては機能ごとに文書化されています。

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

画像、アイコンまたはサムネイルを表示するかどうか。

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

リスト表示がページにインセットで現れるかどうか。

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

サブ ページ内のリスト項目の詳細を描画するために使用される、IG templating スタイル テンプレート。

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

LI に見出しタグを表示するかどうか。値に基づいて H1 から H6 に設定できます。

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

リスト項目を描画するために使用される、IG templating スタイル テンプレート。

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

リスト項目に適用される見本。null の場合、親から決定されるか、"c" はデフォルト値です。

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

リスト区分線に適用される見本。

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

このオプションが False の場合、リストがバインドされるデータは、バインディングに基づく追加の変換なく「そのまま」で使用されます。

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

ol または ul がデータバインドされたリストの主要な要素として使用されるかどうかを示します。

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

$.ig.DataSource を参照してください。応答がラップされる場合、これは基本的に、データ レコードが保持される応答内のプロパティです。

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

応答のタイプ ("json" など) を明示的に設定します。$.ig.DataSource とそのタイプ プロパティのドキュメントを参照してください。

$.ig.DataSource を参照してください。サーバー上のレコードの総数を指定する応答内のプロパティ。

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

検索 (フィルター/並べ替え) トレー フッターに適用する見本。

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

検索 (フィルター/並べ替え) トレーに適用する見本。

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

縮小されてすべての状態がデフォルトの時に検索トレイのフッターに表示されるテキスト。
null の場合、$.ig.mobileListView.locale.searchTrayExpandLabel を使用します。

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

カウント バブルを表示するかどうか。

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

サブ ページのヘッダーに適用される見本。

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