Knockout: Unable to process binding

2024/2/27 8:14:38

I asked this question earlier but did not get an answer.

I get this error message when I run my code:

Uncaught ReferenceError: Unable to process binding "visible: function (){return !editable() }"
Message: editable is not defined 

the editable function is supposed to toggle true/false and then switch to edit mode when a button is pressed. This button is called through a foreach in the html so i'm guessing it has something to do with my viewmodel. The output I get from my getJson works fine but the editable function conflicts somehow.

Here is my html code:

<div><ul data-bind="foreach: comments"><li class="ul3"><span class="author" data-bind="text: nickname, visible: !editable(), click: editComment"></span><input type="text" data-bind="value: nickname, visible: editable()"/>:<div>  <span class="comment" data-bind="text: newMsg, visible: !editable(), click: editComment">    </span><textarea class="myComment" type="text" data-bind="value: newMsg, visible: editable()">                       </textarea></div><button data-bind="click: editComment, text: editable() ? 'Save' : 'Edit comment'">           </button> <button data-bind="click: deleteComment">Delete</button></li></ul></div>

And here is my javascript:

      function Comment() {var self = this;self.nickname = ko.observable();self.newMsg = ko.observable();self.editable = ko.observable(false);self.sendEntry = function () {vm.selectedComment(new Comment());if (self.newMsg() !== "" && self.nickname() !== "") {$.post(writeUrl, "entry=" + ko.toJSON(self));self.newMsg("");}vm.cSection().getNewEntries();};self.deleteComment = function () {vm.comments.remove(self);};self.editComment = function () {self.editable(!self.editable());};
}
function commentSection() {var self = this;self.timestamp = 0;var entry;self.getNewEntries = function () {$.getJSON(readUrl, "timestamp=" + self.timestamp, function (comments) {for (var i = 0; i < comments.length; i++) {entry = comments[i];if (entry.timestamp > self.timestamp) {self.timestamp = entry.timestamp;}vm.comments.unshift(entry);}self.getNewEntries();});};}function ViewModel(){var self = this;self.cSection=ko.observable(new commentSection());self.comments = ko.observableArray();self.selectedComment = ko.observable(new Comment());//self.cSection().getNewEntries();
}
var vm=new ViewModel();
ko.applyBindings(vm);
vm.cSection().getNewEntries();});
Answer

I made it something from your code now toggle is working fine .

please find this Working Fiddle

View :

<input type="button"data-bind="click: editComment, value:editable() ? 'Save' : 'Edit comment'" /> 

View Model:

$(document).ready(function() {vm = function ViewModel() {var self = this;self.comments = ko.observableArray();function Comment() {var self=this;self.editable = ko.observable(false);self.editComment = function() {self.editable(!self.editable());};}self.comments.push(new Comment());  };ko.applyBindings(new vm);
});

If issue still exists please make use of above fiddle and try to build your code in it let me know .

http://en.ppmy.cn/q/40996.html

Related Q&A

How can I retrieve a JavaScript variable using Python? [closed]

Closed. This question needs details or clarity. It is not currently accepting answers.Want to improve this question? Add details and clarify the problem by editing this post.Closed 9 years ago.Improve…

addEventListener overwrites other event actions?

Does addEventListener overwrite previously defined actions for a particular event? For example, <input type="text" name="ele" id="eleID" onfocus="doSomeThing();&q…

Tests from looping through async JavaScript (Mocha)

Im trying to test asynchronous JavaScript with Mocha, and I have some issues with looping through an asynchronously filled array.My goal is to create N (=arr.length) tests, one for each element of the …

get the parent url of iframe in PHP

I am creating a widget that would load in a IFrame and users will be able to place the widget on their own website. How would I get the URL of the website that is using the IFrame in javascript and/or …

CoffeeScript always returns in anonymous function

Im trying to write some CoffeScript function which checks all checkboxes in a table upon checking the checkbox in the th. My function in CoffeeScript looks like this: $("table.tableview th input:c…

Whats the best jQuery product zoom plugin? [closed]

As it currently stands, this question is not a good fit for our Q&A format. We expect answers to be supported by facts, references, or expertise, but this question will likely solicit debate, argum…

mongoose to determine update-upsert is doing insert or update

I want to test if "upsert" option for updating is woking fine. So I "upsert" an object into mongodb twice with same key. However it didnt show inserted message. Was I missing somet…

Is it permited to download javascript code to iPhone

I have an hybrid application, its basically a website running from the application folder inside a UIWebview. The problem is that I was planning to update my website by downloading the whole website fr…

Read cookie which is created from NewCookie()

I created a cookie using Newcookie() and I can access it thorough the browser as below. Now I need to read the cookiefunction getCookieValue(cookieName) {console.log("=====getCookieValue=======&qu…

JavaScript Add Class When Link is Clicked

I have these links:<a class="active" href="#section1">Link 1</a> <a href="#section2">Link 2</a>When a link 2 is clicked I would like it to receive…