在$ .post方法調用的.done（）回調中更新視圖模型是可能的嗎？

-2

我開始使用KnockoutJS，當然還有疑慮來到我身上。所以我有這樣的jQuery代碼：

$.post("someUrl", $form.serialize(), 'json').done(function (data, textStatus, jqXHR) { 
    $.cookie("stepOneSave", true); 

    // here I should update the attributes from response in data 
}).fail(function() { 
    return false; 
}).always();

然後在我看來，（這是一個枝杈模板，因爲這是Symfony2的項目的一部分），我有這樣的：

<fieldset class="rpni-border"> 
    <legend class="rpni-border">Datos de Solicitud</legend> 
    <div class="spacer10"></div> 
    <div class="col-md-3"> 
     <p><strong>Number:</strong></p> 
     <p><strong data-bind="text: currIDSolicitud"></strong></p> 
    </div> 
    <div class="col-md-3"> 
     <p>Request Type: </p> 
     <p><strong data-bind="text: currTipoSolicitud"></strong></p> 
    </div> 
    <div class="col-md-3"> 
     <p>Office: </p> 
     <p><strong data-bind="text: currOficinaRegional"></strong></p> 
    </div> 
    <div class="col-md-3"> 
     <p>Status: </p> 
     <p><strong data-bind="text: currEstadoSolicitud"></strong></p> 
    </div> 
</fieldset>

使用提供的信息我該怎麼辦更新屬性並將它們綁定到視圖？這是我第一次與淘汰賽，我開始閱讀here但我不清楚這一點，可以給我一些幫助嗎？

來源

2014-11-07 ReynierPM

仍然不清楚你需要什麼，你可以嘗試解釋更多或顯示更多的代碼？ – 2014-11-07 02:57:40

@FarizAzmi當'.done（）'回調被執行時，我需要更新模型屬性，並將值綁定到視圖並且沒有更多的代碼，這是我第一次，我不知道該把它放在哪裏以及如何，仍然閱讀現在，但需要一些推或示例代碼，從那裏開始 – ReynierPM 2014-11-07 02:59:09

我的建議是花點時間，並再次逐步教程。確保你完全理解每一步所解釋的內容。當你第一次不理解某些東西時，請轉到jsfiddle.net，在那裏複製教程代碼並使用它。然後你可以在這裏發佈一個問題，附帶一些工作代碼和你的問題。 – Milimetric 2014-11-07 03:33:09

好吧，讓我們說你有使用你需要定義一個屬性作爲observableArray來處理上述數據的視圖模型函數內部Ajax請求

data: [ 
    { 
    id: 1, 
    name: 'John', 
    age: 17 
    }, 
    { 
    id: 2, 
    name: 'Doe', 
    age: 20 
    } 
];

從服務器這個數據返回：

var viewModel = function() 
{ 
    var self = this; 

    self.friends = ko.observableArray([]); 
};

現在來自上面的代碼，您已經有空的friends observableArray，接下來您需要編寫您的ajax請求以從服務器獲取數據，然後將其插入到observableArray中：

var ViewModel = function() 
{ 
    var self = this; 

    self.friends = ko.observableArray([]); 
}; 

$(document).ready(function() 
{ 
    var viewmodel = new ViewModel(); 

    ko.applyBindings(new viewmodel()); 

    $.ajax({ 
     url: '/example', 

     // more ajax options... 

     success: function(response) 
     { 
     viewmodel.friends(response.data); 
     } 
    }); 
});

，這裏是視圖看上去都差不多：

<div data-bind="foreach: $root.friends"> 
    <div class="row"> 
     <div class="col-md-6" data-bind="text: name"></div> 
     <div class="col-md-6" data-bind="text: age"></div> 
    </div> 
</div>

所以，如果你想添加class屬性，做這樣的事情：

<div data-bind="foreach: $root.friends"> 
    <div class="row" data-bind="css: age < 18 ? 'kid' : 'adult'"> 
     <div class="col-md-6" data-bind="text: name"></div> 
     <div class="col-md-6" data-bind="text: age"></div> 
    </div> 
</div>

或者，也許你想添加href屬性，做這樣的事情：

<div data-bind="foreach: $root.friends"> 
    <div class="row" data-bind="css: age < 18 ? 'kid' : 'adult'"> 
     <div class="col-md-12" data-bind="text: name"></div> 
     <a data-bind="text: age, attr: { href: age < 18 ? 'http://kid.com' : 'http://adult.com' }"></a> 
    </div> 
</div>

瞭解更多關於attr bindinghere

p/s：這不是一個好方法，但它應該工作！

來源

2014-11-07 03:28:53

在$ .post方法調用的.done（）回調中更新視圖模型是可能的嗎？

回答

相關問題