從.ajax（）調用knockout.js observableArray（）調用

這使我困惑。它一定是我看不到的小東西。我正在嘗試使用ajax調用加載非常簡單的observableArray淘汰賽。從.ajax（）調用knockout.js observableArray（）調用

的JavaScript

// we bind the array to the view model property with an empty array. 
var data = []; 
var viewModel = { 
    vendors: ko.observableArray(data) 
}; 
ko.applyBindings(viewModel); 

$(function() { 
    // on this click event, we popular the observable array 
    $('#load').click(function() { 
     // WORKS. Html is updated appropriately. 
     viewModel.vendors([{ "Id": "01" },{ "Id": "02" },{ "Id": "03" }]); 

     // DOES NOT WORK. Fiddler2 shows the same exact json string come back 
     // as in the example above, and the success function is being called. 
     $.ajax({ 
      url: '/vendors/10', 
      dataType: 'json', 
      success: function (data) { 
       viewModel.vendors(data); 
      } 
     }); 
    }); 
});

HTML

<button id="load">Load</button> 
<ul data-bind="template: { foreach: vendors }"> 
    <li><span data-bind="text: Id"></span></li> 
</ul>

問：爲什麼成功的Ajax調用，誰的data變量值相匹配的字節爲字節硬盤鍵入的值，不會觸發h tml刷新？

來源

2012-03-16 one.beat.consumer

有沒有理由這將無法正常工作。如此演示。

http://jsfiddle.net/madcapnmckay/EYueU/

我會檢查AJAX後真的返回JSON數據，並且該JSON是一個數組，並且它被正確解析。

我不得不調整ajax調用來讓小提琴ajax處理程序正常工作。

沒有什麼我能想到的。

希望這會有所幫助。

來源

2012-03-16 04:54:35 madcapnmckay

感謝驗證我的理智......我再仔細一點。也許MVC吸一點包裝或什麼... – 2012-03-16 05:51:09

葉。 Firebug請求響應，驗證您正在獲取json，然後驗證jquery是否將其解析爲對象。 – madcapnmckay 2012-03-16 05:55:34

它是肯定的json ... C＃代碼看起來像'return Json（list，JsonResponseBehavior.AllowGet）;'其中'list'是一個ICollection所以我知道它是JSON。除此之外，Fiddler2可以正確顯示其JSON視圖中的數據......它在JavaScript的某處。當我在工作時，我會在明天再次發佈更多信息 – 2012-03-16 05:58:07

-3

這是錯誤，我認爲，淘汰賽的樣品工作時，我們用它來與包裝類：

public class ResultWrapper 
{ 
    public Title {get;set;} 
    public List<Result> {get;set;} 
}

http://learn.knockoutjs.com/#/?tutorial=webmail

但是，如果我們返回結果直接就沒有辦法來約束它。（無需額外applyBindings！）

來源

2012-07-20 12:11:29 ozz

var self=this; 
//var self first line in model 

$.ajax({ 
      url: ", 
      dataType: "json", 
      contentType: 'application/json', 
      type: "POST", 
      data: JSON.stringify({ }), 
      processdata: true, 

      beforeSend: function() { 
       $.mobile.loading('show'); 
      }, 

      error: function (xhr, textStatus, errorThrown) { 
       alert('Sorry!'); 
      }, 

      success: function (data) { 

       $.mobile.loading('hide'); 
       if (data.result!= '') { 
        self.vendors(data.result); 



       } else { 
        self.vendors({something}); 

       } 
      } 
     });

使用self.vendors不是這個viewModel.vendors

來源

2013-03-06 06:02:50 Stipe

-2

我太晚就這一個，因爲我發現自己陷在這種情況下，剛剛結束。我們可以使用一個簡單的Javascript util函數作爲解決方法。

代替viewModel.vendors(data);，我們可以使用

eval("viewModel.vendors("+JSON.stringify(data)+");");...

它爲我工作。

來源

2013-06-20 03:41:02 Venkat

這是我在我的MVC .net應用程序中用knockout和jquery完成的。

// Scripts/groItems.js 
 
(function() { 
 

 
    var ViewModel = function() { 
 
     items = ko.observableArray(), 
 
      ItemName = ko.observable(), 
 
      Img = ko.observable(), 
 
      Qty = ko.observable() 
 
    } 
 

 
    $.getJSON('/Items2/AllItems', function (data) { 
 
     for (var i = 0; i < data.length; i++) { 
 
      self.items.push(data[i]); 
 
     } 
 
    }); 
 

 
    var vm = new ViewModel(); 
 

 
    $(function() { 
 
     ko.applyBindings(vm); 
 
    }); 
 

 
}());

@model IEnumerable<GroModel.Item> 
 
@{ 
 
    ViewBag.Title = "Index"; 
 
} 
 

 
<p> 
 
    @Html.ActionLink("Create New", "Create") 
 
</p> 
 

 
<div data-bind="text: items().length"></div> 
 
<table class="container table table-hover"> 
 
    <thead> 
 
     <tr> 
 
      <th>Item name</th> 
 
      <th>img</th> 
 
      <th>qty</th> 
 
     </tr> 
 
    </thead> 
 
    <tbody data-bind="foreach: items"> 
 
     <tr> 
 
      <td data-bind="text: ItemName"></td> 
 
      <td data-bind="text: Img"></td> 
 
      <td data-bind="text: Qty"></td> 
 
     </tr> 
 
    </tbody> 
 
</table> 
 

 
@section Scripts { 
 
    <script src="~/Scripts/knockout-3.4.2.js"></script> 
 
    <script src="~/Scripts/groItems.js"></script> 
 
}

以下是我在Items2Controller代碼的一部分。CS

private GroContext db = new GroContext(); 
    public JsonResult AllItems() 
    { 
     return Json(db.Items.ToList(), JsonRequestBehavior.AllowGet); 
    }

希望這會有所幫助。謝謝

來源

2017-10-12 16:09:59 user2662006

從.ajax（）調用knockout.js observableArray（）調用

回答

相關問題