Kendo UI Mobile Listview dataitem undefined on second search

我正在使用Kendo Mobile Listview來顯示json文件的內容。第一個搜索很好，在點擊事件中，我可以查看綁定到該列表項的數據項。但是，在第二次搜索之後，數據項變得未定義。有很多方法可以解決這個問題，但是目前的方法沒有理由不能工作。是否因爲listview不應該再次定義它的數據源？任何見解都會被讚賞。謝謝。 HTMLKendo UI Mobile Listview dataitem undefined on second search

<span id="search"> 
       <input id="inputSearch" type="text" placeholder="Search" class="k-textbox"/> 
       <a id="btnSearch" class="k-button" type="submit"><span class="k-icon k-i-search" >...</span></a> 
      </span>

請細化搜索

這裏的JS代碼片段：

$.ajax({ 
         cache:false, 
         type:"GET", 
         dataType: "json", 
         url: "http://"+host+"/Api"+requestController+queryString, 
         headers: {"AuthToken":cookie}, 
         success: 
          function (data) { 
           var val = data.data;          
            if(val.length!=0) { 
             $("#customerList").data 
             var customerDataSource = new kendo.data.DataSource({ data: val }); 
             customerDataSource.read(); 
             $("#customerList").kendoMobileListView({ 
              dataSource: customerDataSource, 
              template: '<a>${Company}<span class="k-status-text"> <br />${CustNo}</span></a>', 
              dataType:"json", 
              style: "inset", 
              click: function(e){  
//!!!! EXCEPTION OCCURS HERE ON SECOND SEARCH. DATAITEM UNDEFINED             
               alert(e.dataItem.CustNo); 
               // redirect to 
               app.navigate("#overview-customer"); 

              } 
             }); 
            } else { 
             $("#customerList").append('<li>' +'<div class="k-block k-info-colored">'+ 
              'Please refine your search'+'</div>' + '</li>'); 
            } 

          } 
        });

來源

2013-02-25 Strake

你每次都重新創建的列表視圖您搜索

這是一項特別針對移動設備的卓越操作。更好地初始化（創建）移動列表視圖一次，並使用方法更改其使用的數據。這也將確保你不會遇到像你所遇到的問題。

來源

2013-02-25 17:52:00

我同意。我一直在搞這個。我會給這個方法一個鏡頭，讓你知道。感謝您的快速回復。 – Strake 2013-02-25 17:57:18

完美工作。謝謝你澄清。 – Strake 2013-02-25 18:27:24

我會更新這個帖子，修改後的綁定讓他人蔘考，一旦它允許我解鎖。 – Strake 2013-02-25 18:31:36

根據Petur的回答，列表視圖應該像這樣綁定。每次點擊實例化列表視圖都會導致稅收並與Kendo的腳本不兼容。

var customerDataSource = new kendo.data.DataSource({ }); 
    // Mobile listview 
    $("#customerList").kendoMobileListView({ 
              dataSource: customerDataSource, 
              template: '<a>${Company}<span class="k-status-text"> <br />${CustNo}</span></a>', 
              dataType:"json", 
              style: "inset", 
              click: function(e){ 
               var index = $(e.item).index(); 
               var text= $(e.item).index(); 
               alert(e.dataItem.CustNo); 
               // redirect to 
               app.navigate("#overview-customer"); 


              }, 
              dataBound: function(e){ 
               alert("Ive been bound"); 
              } 
             }); 

     $('#search a').click(function() { 
      var searchstr = $('#search input').val(); 
      var requestController = "/Customers"; 
      var queryString= "?filtercriteria=custno-"+searchstr+"&company-"+searchstr; 
        $.ajax({ 
         cache:false, 
         type:"GET", 
         dataType: "json", 
         url: "http://"+host+"/Api"+requestController+queryString, 
         headers: {"AuthToken":cookie}, 
         success: 
          function (data) { 
           var val = data.data; 
            if(val.length!=0) { 
             var ds = [{ data: val }]; 
             customerDataSource.data(val); 

            } else { 
             $("#customerList").append('<li>' +'<div class="k-block k-info-colored">'+ 
              'Please refine your search'+'</div>' + '</li>'); 
            } 

          } 
        }); 
      });

來源

2013-02-26 16:41:36 Strake

Kendo UI Mobile Listview dataitem undefined on second search

回答

相關問題