如何使用knockout.js在dropdown selectedindexchange上将值绑定到ul?

时间:2013-08-12 12:17:44

标签: javascript jquery knockout.js

我正在努力克服Knockout JS。在我的网页中,页面加载后的事件ul成功显示了数据库中的一些值列表。以下是代码

         <ul data-role="listview" data-divider-theme="b" data-inset="true" data-bind="foreach: Cs">

       <li data-theme="c">
              <a href="#page1" data-transition="slide" data-bind="attr: { title: CID }">
                  <span data-bind="text: FName + ' ' + LName +')'"></span>
              </a>
          </li>

      </ul>

function SSSmodel() {
    var self = this;
   self.Cs = $.parseJSON(localStorage["CsTab"]);       
};

下拉列表将新列表绑定到该ul的Onchange事件。但它没有约束新的价值观。 Ul显示旧的价值观。 下面是下拉列表的onchage函数。

      function onchange()
        {
      //b contain array of elements
       localStorage["aa"] = b;//i checked b.it contains array of values
      ko.applyBindings(new SSSmodel());  
       }
       function SSSmodel() {
    var self = this;

    self.Contacts = $.parseJSON(localStorage["aa"]);
};
 }

它没有显示任何错误,也没有将新值绑定到ul。为什么? 请告诉我哪里弄错了,并提供解决此问题的提示。

3 个答案:

答案 0 :(得分:0)

已更新: 您似乎已使用保留关键字onchange作为函数名称。使用onValueChange之类的任何其他名称进行更改即可。

  

从代码中的某个地方调用该函数。这是Working Sample

 onchange1();
    function onchange1() {
        //b contain array of elements
        //    localStorage["aa"] = b; //i checked b.it contains array of values
        ko.applyBindings(new StrikeAppSearchViewModel());
    }
    function StrikeAppSearchViewModel() {
        var self = this;

        self.Contacts = [
        { ContactID: "MyId1", FirstName: "Jhon", LastName: "Singh dfhd" },
        { ContactID: "MyId2", FirstName: "Dick", LastName: "YBJ" },
        { ContactID: "MyId3", FirstName: "Harry", LastName: "Pdafhd"}];
    };

答案 1 :(得分:0)

对于这种情况,你必须进行Jquery Ajax调用,然后只有它将检索数据绑定到UL。

  function StrikeAppViewModel() {
    var self = this;
    self.Contacts = ko.observableArray();
    self.Contacts = ko.observable($.parseJSON(localStorage["ContactsTable"]));

    self.SearchContacts = function () {

        $.ajax({
            url: 'http://localhost:12345/api/Contact',
            type: 'GET',
            dataType: 'jsonp',
            data: { ID: id },
            context: this,
            success: function (result) {
                debugger;
                self.Contacts(result);

            },
            error: function (XMLHttpRequest, textStatus, errorThrown) {

                alert(errorThrown);
            }
        });

    }


};

答案 2 :(得分:0)

试试这样:

 self.Contacts = ko.observable($.parseJSON(localStorage["ContactsTable"]));