Develop Reference

KnockoutJS - Select dropdown binding not working

Im working on a project to build a CRUD system using knockout and getting and saving my data via AJAX. Been having issues binding the select dropdown. When I try to edit an incident I get the following error:
Uncaught TypeError: Cannot read property 'push' of undefined
I created a jsfiddle http://jsfiddle.net/rqwku4kb/20/ to demonstrate the issue. I'm still working on the delete and add a new incident link so they are not working yet but im working on that seperately.
Here is the code that`s causing me issues at the moment.
self.ShowMeTheCurrentSelectedIncident = function(data) {
self.currentIncident();
self.chosen_composante.push([data.Composante]);
};
Would anyone have have any idea where the issue might be or be able to provide me some advice?

The method here is what's wrong:
self.ShowMeTheCurrentSelectedIncident = function(data) {
self.currentIncident(); // (1)
self.chosen_composante.push([data.Composante]); // (2)
};
What this does:
(1) get the value of the observable currentIncident and then throw it away. It's always null and never set so this is doubly redundant.
(2) Reference an undefined variable called chosen_composante which does not exist in IncidentList.
I could not fix this for you since I wasn't sure what values were to go where, but it should be enough to set you on the right track - you're confusing the properties of the IncidentList and Incident

gridcomplete function always running?

I'm using jqgrid with grails and need to select some objects. This works for one given object. My problem is that sometimes, calling function has no id. So there is nothing to do after grid completion. And I'm not able to do that even after trying if (false)... In all case, grid.jqgrid("setSelection... is executed and I get the message
java.lang.NullPointerException
Cannot get property 'id' on null object
which is true. But why is this line executed ???
gridComplete: function() {
if (false) {
grid.jqGrid("setSelection",'${cableFocus.id}',true);
}
return;
I have a second question : How can I use gridComplete to select several rows instead of one ?
Thanks very much for any help,
Olivier

The problem is not with gridComplete or your if statement (which is javascript). As you are getting a java error i'm guessing ${cableFocus.id} is placeholder (which will always get exectuted)
So the javascript is not running but your java code is still attempting to run and throwing the error

addEventListener syntax with variable function name

In my Firefox extension, I create a popup menu dynamically. Originally, I used this line on each menu item:
menuFunc.setAttribute("oncommand","MainExtension.MyPlugin." + functionName + "();");
where functionName is a string with the name of the function to be called for that menu item. This worked fine. When I uploaded my extension to the Mozilla Addons page, the automated code validation program flagged this line and said that using setAttribute to set oncommand in this way was not secure and that addEventListener should be used instead. I switched to this syntax:
menuFunc.addEventListener("oncommand",function() {MainExtension.MyPlugin[functionName]},false);
but now nothing happens when I click on a menu item.
Is my syntax off or is there something else wrong? I don't think the problem is the common 'this' reference error. I tried removing all uses of 'this' from one of the functions and it still did not work. It seems like the functions are not being called at all. No errors are being generated either.

Update:
The command action is attached using just command, not oncommand:
menuFunc.addEventListener("command", MainExtension.MyPlugin[functionName], false);
You should be able to just do:
menuFunc.oncommand = MainExtension.MyPlugin[functionName];

Just a guess: Does it help to use true instead of false as the third parameter in order to capture the event?

TypeError when running jasmine specs that use a jQuery plugin built using the Widget factory

I'm using a jQuery plugin called toggleEdit for inline editing.
Everything works fine when the code is actually used in the page.
However, my test suite fails with the following error:
TypeError: Cannot call method 'remove' of undefined
I tracked it down to be triggered from within the clear method of this particular plugin. Its source file can be found here.
There are two relevant bits in that code:
1- The _init function
self.element.addClass("toggleEdit toggleEdit-edit toggleEdit-edit-" +
self._tag(self.element))
//store reference to preview element
.data("toggleEdit-preview", self.p);
As you can see, when the plugin is first instantiated it uses the data structure on self to store the newly created element.
2- The clear function
self.element.data("toggleEdit-preview").remove();
The clear function then tries to access that structure and retrieve the element. That's when, while inside a jasmine spec, it fails with the aforementioned exception.
Has anyone seen anything similar?
EDIT:
This is my spec, it's the simplest piece of code able to reproduce the error:
it("should update the given attribute on the server", function(){
$('#user-details input, #user-details select').toggleEdit(); //this line triggers the error
});
http://alz.so/static/plugins/toggleedit/jquery.toggleedit.js

I was taking a look at the source for toggleEdit and it seems that the only 2 times the function clear is called is just before self.element.data gets set:
if (typeof self.element.data("toggleEdit-preview") !== "undefined") {
self.clear();
self.disableEvents();
}
And at destroy function:
destroy: function() {
var self = this;
self.clear();
self.disableEvents();
$.Widget.prototype.destroy.apply(self, arguments);
}
Since the first call seems to be protected, I ask you a somewhat dumb question: Is it possible that destroy is being called twice?

Found my problem: old version of the jQuery + jQuery UI duo. Upgrading them resolves the exception.

Javascript error in IE7 only (jQuery / Cycle.js

I'm using jQuery and cycle.js to fade through some images on this site.
On the first and last slides, I've put a callback function to go to the next/prev pages, however in IE7 I'm receiving a runtime javascript error (not in any other browsers).
Here's the link to my javascript file: http://bit.ly/dAKEof
The error I'm receiving in IE7 is:
Line: 126
Char: 4
Error: Object Expected
Code: 0
Here's the code I have at line 126 of the functions.js file:
window.location = $('#next').find("a").attr("href");
Any ideas?

I didn't see a link to the site with the error in your question but saw a url in your profile and went there to see if that might be the one. Looks like it is...
IE is notorious for giving incorrect line numbers in its javascript errors. The error is actually on line 125:
function onBefore(curr, next, opts, fwd) {
// If the page isn't loading or refreshing - initCycle == false (fixes auto unbinding of slide opts on load)
// If is last slide and next slide is fwd direction go to next project instead of wrapping cycle
if(opts.currSlide + 1 == opts.slideCount && fwd && !initCycle){
opts.end(opts); // <-- this line is failing b/c the end function is null
window.location = $('#next').find("a").attr("href");
}
// If is first slide, and next slide is bkwd direction go to prev project instead of wrapping cycle
else if(opts.currSlide + 1 == 1 && !fwd){
opts.end(opts); // <-- this also fails for the same reason
window.location = $('#prev').find("a").attr("href");
}
}
The end function in the ops object is null, and that's where the error is. Interestingly, I checked in FF as well and this is also true there, but it seems to recover more gracefully than IE in this case.
It's not entirely clear from the rest of the code how the onBefore function gets called. Looks like it might be the cycle plugin itself. In any event, wherever that call happens the opts object appears to not be getting populated with all the data that is needed by your function.
Update:
I took a look at the cycle plugin code and opts.end is a callback that the user of the plugin must supply. So the solution to your problem is to either provide your own callback when you create the cycle object (line 101 in your js file) or remove the lines in your code that invoke the end function.
Update in response to OP's comment below:
Upon closer inspection your code will actually do exactly what you want without the need to invoke an end callback, so you can safely remove those lines. The plugin triggers your onBefore callback before it does any animations. And since you reload a new url in the browser when moving backward from the 1st slide or forward from the last one, it never even gets to the fade animation, which is your goal.
However, to answer your question on how to add an end callback to the original cycle object, you would do it exactly as you did for onBefore and onAfter. Create a function with whatever code you want to execute and then include end: yourFuncName in the object hash passed to the plugin. Another way to stop the cycle plugin is $(selector).cycle('stop');. But again, none of this is needed in your case. Just remove the calls to end and you should be fine.