如何將數據綁定到Kendo Ui Mobile的Dropdownlist中

我一直在使用Kendo Mobile來開發一個應用程序，以前我在Kendo網站上做過的應用程序相同，它的工作正常。主要問題是我必須將數據綁定到兩個dropdownlist下面的代碼，我已經寫了，當我的應用程序運行時，它顯示一個錯誤，如「Microsoft JScript運行時錯誤：對象不支持屬性或方法'追加'」。如何將數據綁定到Kendo Ui Mobile的Dropdownlist中

在HTML

<div id="forms" data-role="view" data-title="Form Elements" data-init="initForm"> 
    <table> 
     <tr> 
      <td> 
       <label style="margin-left: 20px"> 
        Company:</label> 
      </td> 
      <td> 
       <select id="ddlCompany" style="width: 200px"> 
        <option>Select Company</option> 
       </select> 
      </td> 
      <td class="style1"> 
       <label style="margin-left: 20px"> 
        Category:</label> 
      </td> 
      <td> 
       <select id="ddlCategory" style="width: 200px"> 
        <option>Select Category</option> 
       </select> 
      </td> 
      <td> 
       <label style="margin-left: 20px"> 
        Product :</label> 
      </td> 
      <td> 
       <select id="ddlProduct" style="width: 200px"> 
        <option>Select Product</option> 
       </select> 
      </td> 
     </tr> 
    </table> 
</div> 

    function initForm() { 
     $.ajax({ 
      type: "POST", 
      contentType: "application/json; charset=utf-8", 
      url: "FlashReportMobileWebService.asmx/GetCompany", 
      dataType: "json", 
      success: function (data) { 
       for (i = 0; i < data.d.length; i++) { 
        ddlCompany.append($("<option></option>").val(data.d[i].Company).html(data.d[i].Company)); 
       }; 


       $("#ddlCompany").kendoDropDownList(); 
      } 
     }); 
     $.ajax({ 
      type: "POST", 
      contentType: "application/json; charset=utf-8", 
      url: "FlashReportMobileWebService.asmx/ToCategoryDropDown", 
      dataType: "json", 
      success: function (data) { 
       for (i = 0; i < data.d.length; i++) { 
        ddlCategory.append($("<option></option>").val(data.d[i].Category).html(data.d[i].Category)); 

       }; 
       $("#ddlCategory").kendoDropDownList(); 
      }, 
      failure: function (msg) { 
       alert(msg); 
      } 
     }); 
    } 
    $("#ddlCategory").change(
     function (e) { 
      var ddlProduct= $("#ddlProduct"); 
      var dataItem = $("#ddlCategory").val(); 
      $.ajax({ 
       type: "POST", 
       contentType: "application/json; charset=utf-8", 
       data: "{'Category':'" + dataItem + "'}", 
       url: "FlashReportWebService.asmx/ToFillProductDropDown", 
       dataType: "json", 
       success: function (data) { 
        ddlProduct.empty(); 
        for (i = 0; i < data.d.length; i++) { 
         ddlProduct.append($("<option></option>").val(data.d[i].ProductName).html(data.d[i].ProductName)); 
        }; 
        $("#ddlProduct").kendoDropDownList(); 
       }, 
       failure: function (msg) { 
        alert(msg); 
       } 
      }); 
     }); 

    var app = new kendo.mobile.Application(document.body);

感謝閱讀這個

來源

2012-12-19 Dinesh Haraveer

ddlProduct未定義 –

達林是對的。您的ddlCategory和ddlProduct在提供的代碼片段中都未定義。 ddlXXX是一個jQuery元素嗎？有可能這不是這就是你得到這個錯誤的原因。 – Mark

我在腳本標記中定義了ddlComapny，ddlCategory，ddlProduct，其中這些從web服務「FlashReportMobileWebService」通過使用ajax進行綁定。我以完美的方式顯示Web（Kendo）的正常工作，但是此代碼存在問題移動（劍道）。 –

$.ajax({ 
     type: "POST", 
     contentType: "application/json; charset=utf-8", 
     url: "FlashReportMobileWebService.asmx/GetCompany", 
     dataType: "json", 
     success: function (data) { 
      var dataSource = []; 
      for (i = 0; i < data.d.length; i++) {      
       ddlCompany.push({ "Company": data.d[i].Company}) 
      }; 
      $("#ddlCompany").kendoDropDownList({ 
       dataTextField: "Company", 
       dataSource: dataSource 
      }); 
     } 
    });

收件上述的代替值追加到ddlCompany.Values將結合代碼。

來源

2012-12-27 06:58:12

seeems喜歡它應該是dataSource.push而不是ddlCompany.push？ – Sumeet

如何將數據綁定到Kendo Ui Mobile的Dropdownlist中

回答

相關問題