星级评分绑定使用淘汰赛js

我想绑定星级评分使用淘汰赛js和ajax，星级评级是绑定，如果我手动赋值的数据=数据= 3或数据= 4，但我得到的数据从ajax它没有得到绑定，但我从ajax结果获得的价值，并将其传递给viewmodel它不能在下面工作是我的代码需要帮助。星级评分绑定使用淘汰赛js

//HTML// 

<div id="divstarRating"> 
<span data-bind="readonlyStarRating:starpoints"></span></a> 
</div> 

    ///Custom Binding 
ko.bindingHandlers.readonlyStarRating = 
{ 
    init: function (element, valueAccessor) { 

    $(element).addClass("readonlyStarRating"); 
    for (var i = 0; i < 5; i++) 
    $("<span>").appendTo(element); 
      $("span", element).each(function (index) { 
      var observable = valueAccessor(); 
      $(this).hover(
       function() { $(this).prevAll().add(this).addClass("hoverChosen") }, 
       function() { $(this).prevAll().add(this).removeClass("hoverChosen") } 
      ) 
     }); 
    }, 
    update: function (element, valueAccessor) { 
     var observable = valueAccessor(); 
     $("span", element).each(function (index) { 
     $(this).toggleClass("chosen", index < observable()); 
     }); 
    } 
} 
//viewModel 

function starRating(data) { 
if (data != 0) { 
    this.starpoints = ko.observable(data); 
} 
else { 
    this.starpoints = ko.observable(1); 
} 
} 
ko.applyBindings(new starRating(), document.getElementById('divstarRating')) 

//ajax/// 

$.ajax({ 
    type: "POST", 
    dataType: "json", 
    data: xxxx, 
    url: xxxx+ 'api/xx/xxxxxx', 
    success: function (data) { 
     //I am getting the value and passing to viewModel 
     return new starRating(data); 
    } 
}); 

    //CSS// 
.readonlyStarRating span { width:24px; height:24px; background-image:  url(../star.png); display:inline-block; cursor: pointer; background-position: -24px 0; } 
.readonlyStarRating span.chosen { background-position: 0 0; }

来源

2016-09-16 kitty sarvaj

它看起来像你需要先启动了解[jQuery的Ajax的工作原理（http://api.jquery.com/jquery.ajax/）。 – janmvtrinidad

您实际上有两个starRating的实例。为了体现你的html中的值，你应该在传递到ko.applyBindings之前存储new startRating的实例。然后在您的ajax请求上使用该实例而不是return new startRating(data)。

或者您可以使用ko.dataFor来获取viewModel的实例。

它看起来像这样

... 
    //in your ajax request  
    success: function (data) { 
     var vm = ko.dataFor(document.getElementById('divstarRating')); 
     vm.starpoints(data); 
    } 
...

来源

2016-09-16 08:34:54 janmvtrinidad

@感谢您的时间，它解决了我的问题 –

星级评分绑定使用淘汰赛js

回答

相关问题