从jsTree事件中调用knockout函数

时间:2015-07-20 15:53:51

标签: jquery knockout.js jstree

我正在使用jsTree从ajax填充treeView。当我单击树上的节点时,我想使用knockout显示相关数据。

这是我的viewmodel

function PanelSearchVM() {
    var self = this;

    self.Panel = ko.observable();
    self.Source = ko.observable();
    self.Substation = ko.observable();
    self.Bay = ko.observable();
    self.Voltage = ko.observable();
    self.Utility = ko.observable();
    self.Train = ko.observable();
    self.kVA = ko.observable();
    self.Drawing = ko.observable();
    self.Status = ko.observable();
    self.ShowT2 = ko.observable();

    self.circuits = ko.observableArray([]);
    self.circuitsT2A = ko.observableArray([]);
    self.circuitsT2B = ko.observableArray([]);

    self.getID = function (data) {

        $.ajax({
            type: "POST",
            url: "/Panel/LoadPan",
            data: { "panID": data.node.id },
            dataType: "json",
            success: function (data) {


                // This callback is executed if the post was successful   
                console.log("return" + data.PanelDetails[0].Panel);
                self.Panel("test");
                self.Source(data.PanelDetails[0].Source);
                self.Substation(data.PanelDetails[0].Substation);
                self.Bay(data.PanelDetails[0].Bay);
                self.Voltage(data.PanelDetails[0].Voltage);
                self.Utility(data.PanelDetails[0].Utility);
                self.Train(data.PanelDetails[0].Train);
                self.kVA(data.PanelDetails[0].kVA);
                self.Drawing(data.PanelDetails[0].Drawing);
                self.Status(data.PanelDetails[0].Status);


                //Start Panel Type 2

            }
        });

    };



};

ko.applyBindings(new PanelSearchVM());

这是我对敲除函数的jquery jsTree事件调用

  var myVM = new PanelSearchVM();

    $('#using_json_2').on("select_node.jstree", function (e, data) {


        myVM.getID(data);


    });

代码执行正常,当我点击一个节点时,ko函数被调用并返回数据。控制台记录返回的数据。但是,视图没有得到更新。

有什么想法吗?

1 个答案:

答案 0 :(得分:1)

看起来您正在构建视图模型的两个实例,通过:

ko.applyBindings(new PanelSearchVM());

var myVM = new PanelSearchVM();

因此,当您将值更新为一个时,实际的HTML将绑定到一个完全独立的对象。只需实例化一个对象:

var myVM = new PanelSearchVM();
ko.applyBindings(myVM);