简体   繁体   中英

KnockoutJS not binding data

I am beginner to knockoutJS and ASP.net MVC.

Everything is working fine on local machine but since I uploaded the script knockoutJS binding is not working in some cases, and I have tried a lot but failed to fix. now I need your help guys. if you see this url ( http://www.cepinceleme.com/Phone/Samsung-Galaxy-J5 ) rating system is loaded (I bind the values using knockoutJS), because design or features or performance 5.0 each, which is full value. but when you will rate it and any value change to something which is not full eg 5.3 or 7.2 it will bind on pageload via knockoutJS.

here is an example ( http://www.cepinceleme.com/Phone/Samsung-Galaxy-S6 ) where rating system is not binding values using knockoutJS on pageload.

Code is below

<script type="text/javascript">
function AppViewModel() {
    var self = this;
    self.MobileId = ko.observable(7413);
    self.TotalVotes = ko.observable(4);
    self.DesignVal = ko.observable(8,75);
    self.FeatureVal = ko.observable(8,75);
    self.PerformanceVal = ko.observable(8,375);


    var DesignPercentage = 8,75
    self.percentageDesign = ko.observable('<div class="progress-bar progress-bar-danger" role="progressbar" aria-valuenow="' + (DesignPercentage * 10) + '" aria-valuemin="0" aria-valuemax="100" style="width:' + (DesignPercentage * 10) + '%">' +(DesignPercentage.toFixed(1)) + '</div>');

    var FeaturesPercentage = 8,75
    self.percentageFeatures = ko.observable('<div class="progress-bar progress-bar-warning" role="progressbar" aria-valuenow="' + (FeaturesPercentage * 10) + '" aria-valuemin="0" aria-valuemax="100" style="width:' + (FeaturesPercentage * 10) + '%">' + (FeaturesPercentage.toFixed(1)) + '</div>');

    var PerformancePercentage = 8,375
    self.percentagePerformance = ko.observable('<div class="progress-bar progress-bar-success" role="progressbar" aria-valuenow="' + (PerformancePercentage * 10) + '" aria-valuemin="0" aria-valuemax="100" style="width:' + (PerformancePercentage * 10) + '%">' + (PerformancePercentage.toFixed(1)) + '</div>');

    self.Thanks = ko.observable("");
    self.designvalues = ko.observableArray(["1", "2", "3", "4", "5", "6", "7", "8", "9", "10"]);
    self.designSelectedValue = ko.observable("5");

    self.featuresvalues = ko.observableArray(["1", "2", "3", "4", "5", "6", "7", "8", "9", "10"]);
    self.featuresSelectedValue = ko.observable("5");

    self.performancevalues = ko.observableArray(["1", "2", "3", "4", "5", "6", "7", "8", "9", "10"]);
    self.performanceSelectedValue = ko.observable("5");

    self.vote = function () {
        var mydata = { id: self.MobileId(), totalVotes: self.TotalVotes(), voteDesign: self.designSelectedValue(), voteFeatures: self.featuresSelectedValue(), votePerformance: self.performanceSelectedValue() }
        self.save(mydata);
        self.Thanks("Thanks for voting");
        self.hasClicked(true);
    };


    self.hasClicked = ko.observable('False' != 'False');
    self.save = function (mydata) {
        $.post('/PhoneSingle/VoteSave', mydata, function (data) {
            self.TotalVotes(self.TotalVotes() + 1);

            var newDesignValue = ((self.DesignVal() + parseFloat(self.designSelectedValue())) / 2.0).toFixed(1)
            var newFeaturesValue = ((self.FeatureVal() + parseFloat(self.featuresSelectedValue())) / 2.0).toFixed(1)
            var newPerformanceValue = ((self.PerformanceVal() + parseFloat(self.performanceSelectedValue())) / 2.0).toFixed(1)
            self.percentageDesign('<div class="progress-bar progress-bar-danger" role="progressbar" aria-valuenow="' + (newDesignValue * 10) + '" aria-valuemin="0" aria-valuemax="100" style="width:' + (newDesignValue * 10) + '%">' + newDesignValue + '</div>');
            self.percentageFeatures('<div class="progress-bar progress-bar-warning" role="progressbar" aria-valuenow="' + (newFeaturesValue * 10) + '" aria-valuemin="0" aria-valuemax="100" style="width:' + (newFeaturesValue * 10) + '%">' + newFeaturesValue + '</div>');
            self.percentagePerformance('<div class="progress-bar progress-bar-success" role="progressbar" aria-valuenow="' + (newPerformanceValue * 10) + '" aria-valuemin="0" aria-valuemax="100" style="width:' + (newPerformanceValue * 10) + '%">' + newPerformanceValue + '</div>');
        });
    };
}
var viewModel = AppViewModel();
ko.applyBindings(viewModel);

Design value is: 8.7

Features value is: 8.7

Performance value is: 8.3

Thanks so much for your help.

加载问题页面时出现“意外数字”,因为数字使用逗号而不是小数点。

var DesignPercentage = 8,75

The technical post webpages of this site follow the CC BY-SA 4.0 protocol. If you need to reprint, please indicate the site URL or the original address.Any question please contact:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM