We Keep Coding

Ignite UI IgCurrencyEditor

I am trying to programmatically update a currency field to run the value changed event which holds a numeric calculation. I want the value to set to zero using something like.
$('.tester').igCurrencyEditor("setFocus");
$('.tester').igCurrencyEditor('option','value', 0);
Then when I blur out, or not sure what to do here, the valueChanged event should trigger as per the API docs (It can be raised on lost focus or on spin events).
But I can't seem to trigger the value changed event, it only works when I manually click into the input and change the number.

The valueChanging and valueChanged events would trigger when a user interaction changes the displayInput value of the editor, and the corresponding valueInput value is different from the display input one. The editors have adopted the same approach as all other Ignite UI controls where events do not trigger on API calls, because when an API call is performed, the developer can choose whether to invoke their event handler after the API call, or not.
There's two things that you can do to invoke your event handler. First one is to cache the event handler method and invoke it manually:
$('.tester').igCurrencyEditor({
...
valueChanged: valueChanged,
...
});
function valueChanged(event, ui) {
// event handler
};
$('.tester').igCurrencyEditor("setFocus");
$('.tester').igCurrencyEditor('option','value', 0);
valueChanged(null, { /* if you need arguments */ });
The second one is to extend the currency editor and override the method that performs the check whether these events should be triggered, and make it always trigger the events:
$.widget("ui.igCurrencyEditorExtension", $.ui.igCurrencyEditor, {
_processValueChanging: function (value) {
this._triggerInternalValueChange(value);
}
}
The second approach requires you to switch to using the igCurrencyEditorExtension and may cause side effects, as the method performs other checks as well.
Anyways, what Alex Marinov has suggested should work, but it depends on your editor configuration, depending on whether you've set nullValue, allow null values in the editor, etc.

you need a function like this:
function clearValue() {
$('.tester').igCurrencyEditor('option','value', "");
$('.tester').igCurrencyEditor('field').blur();
}
The result will be that the displayed value inside the currency editor is "$0.00" and the valueChanged event is fired.

Manually trigger change:attribute

I have a model cell with an attribute foo.
I have a listener thats bound to "change:foo" like so:
cell.listenTo(cell, "change:foo", function(){
if(cell.foo == "bar"){
doSomething()
}
});
Now, since the listener is bound at a point in time when foo may already be "bar", I want to manually trigger change:foo in order for the code to run, after the listener is bound. I'm unable to bind the listener earlier due to constraints from my application.
I found a Backbone.js cheat sheet which claimed I could just use cell.change() to trigger change:attribute for each attribute of the model, but that just yields Uncaught TypeError: cell.change is not a function. I am aware that I can trigger the change event by calling cell.trigger("change") but that does not trigger change:foo.
I could change my listener to listen for "change" instead of "change:foo" but if it's at all possible I'd like to stick with "change:foo" for performance reasons.

You can pass an arbitrary string to trigger, most notably the event you want, change:foo
Try
var cell = new Backbone.Model({
foo: 'bar'
});
cell.on('change:foo', function() {
console.log('foo changed', cell.get('foo'));
});
cell.trigger('change:foo');
And a demo http://jsfiddle.net/nikoshr/tk33rme2/

Modify change event of Kendo UI Dropdownlist

I'm trying to change the "change" event of a Kendo UI Dropdownlist, but unfortunately I haven't had any luck. Here's the code I've tried so far: http://trykendoui.telerik.com/ukeV
Specifically, here's my dropdownlist initializer:
var onChange = function(e)
{
alert("something changed");
};
// create DropDownList from input HTML element
$("#dropdown").kendoDropDownList({
dataTextField: "text",
dataValueField: "value",
dataSource: data,
index: 0,
change: onChange
});
And this is my attempt to change that function later:
onChange = function(e){alert("attempt 1");};
var dropDownData = $("#dropdown").data("kendoDropDownList");
dropDownData.options.change = function(e){alert("attempt 2");}
dropDownData.refresh();
Specifically, I first tried just changing the onChange function, and then (when that didn't work), I tried changing the options.change function directly. While the options.change function did change (when I examined it in chrome debugger), the dropdownlist's actual functionality remained unchanged. I think I need to refresh the dropdownlist or something to make my edits actually take effect. Does anyone know how I can actually get the kendo grid to refresh and display my data?

I see you've already found a work-around, but I thought I'd add some more explanations.
The reason why changing it like this
onChange = function(e){alert("attempt 1");};
doesn't work is that you're passing a function to the widget, and the widget calls that function at appropriate times. You're not passing a reference to the variable onChange. So changing the variable won't affect the widget.
The reason why
dropDownData.options.change = function(e){alert("attempt 2");}
doesn't work is that Kendo stores handlers in its own structure (which is necessary since you can bind multiple handlers for the same event!), so it doesn't call whatever is in options.change at any given moment in time.
However, there is a setOptions method, and with that you could've made your second approach work:
dropDownData.setOptions({
change: function (e) {
alert("attempt 2");
}
});

I ended up using a simple work-around. When I put in the line
change: onChange
Kendo actually hardcoded in the function body into the dropDownData.options.change function, rather than referencing my named javascript function. It looked like this in the debugger:
function(e)
{
alert("something changed");
};
So my workaround was simply to use an anonymous function in the Kendo call. So I changed change: to
change: function(e) { onChange(e) };
Then when I changed onChange later, kendo referenced the named javascript function and called my updated version. Here's the working demo: http://trykendoui.telerik.com/AkIW/2

jQuery focus blur pass parameter

I can't seem to access the variable defaultValue down in my .blur() function. I've tried various stuff but with no luck. So far I only get an empty object. What's wrong?
jQuery(document).ready(function(){
jQuery('#nameInput, #emailInput, #webInput').focus(function(){
var defaultValue = jQuery(this).val();
jQuery(this).val("");
})
.blur(function(defaultValue){
if(jQuery(this).val() == ""){
jQuery(this).val(defaultValue);
}
});
});

Looks like the question is about the passing data into the .blur or .focus event.
per jQuery API - http://api.jquery.com/blur/
blur( [eventData ], handler(eventObject) )
So if you want to pass data - you can send a parameter to event - which will appear as data in event object.
see this fiddle for more info
http://jsfiddle.net/dekajp/CgP2X/1/
var p = {
mydata:'my data'
};
/* p could be element or whatever */
$("#tb2").blur(p,function (e){
alert('data :'+e.data.mydata);
});

Because your code is wrong :-) you define var inside function (var defaultValue) which is then immediately wiped out.
There are two solutions: define your var as a global var before you bind blur event, or store it in the data of object liket his (which I recommend):
$(document).ready(function(){
$('#nameInput, #emailInput, #webInput').focus(function(){
$(this).val("").data('defaultValue',jQuery(this).val());
}).blur(function(defaultValue){
if($(this).val() == ""){
$(this).val($(this).data('defaultValue'));
}
});
});

It seems to me that you don't understand the basics of JavaScript.
First of all variables in JS are localized to function's scope, so you can't declare variable with var in one function and access it in other function
Second, you can't pass anything to DOM-event handler, except event-object, this is defined by the DOM specification, sometimes you can use event data parameter to the blur jQuery method.
Try this:
jQuery(document).ready(function(){
var defaultValue;
jQuery("#nameInput, #emailInput, #webInput").focus(function(){
defaultValue = jQuery(this).val();
jQuery(this).val("");
})
.blur(function(){
if(jQuery(this).val() == ""){
jQuery(this).val(defaultValue);
}
});
});
First of all, you need to distinguish blur method (function) and handler (function) which is the argument to the blur. You was trying to pass the defaultValue exactly to handler, but that can't be done. Inside handler the defaultValue would be equal eventObject, so you can do smth like console.log(defaultValue.timeStamp) and you'll see smth like 123482359734536
In your approach you can't even use event.data argument to the blur cause it will be set at the time of blur's call (attaching handler). You need to declare a var outside of the both handlers, so it will be visible to both of them
You may consider to read some comprehensive book on JS.
I read "Professional JaveScript For Webdevelopers" by Nicolas Zakas. There is a new edition

Using .bind (mootools) with onClick event

I have the code (inside one object)
onclick: this._addX.bind(this)
and then inside another object
onclick: this._addY.bind(this)
Now, _addX() and _addY are nearly identical, except they both end up calling (on the click event) a function with different argument values, say _addX calls foo('x') and _addY calls foo('y'). So I tried:
onclick: this._add.bind(this,'x') and
onclick: this._add.bind(this,'y') in the two objects. And of course I changed _add to accept an argument.
At runtime, when _add is called, it does not see any incoming arguments! I have fumbled around with different syntaxes but nothing works. Any ideas? The original syntax works fine (no arguments) but forces me to duplicate a large function with only one line different, which pains me. Thanks in advance.
_add: function(which) {
var me = this;
var checkFull = function(abk) {
if (abk.isFull) {
alert("full");
} else {
alert(which); // which is always undefined here!
}
};
getAddressBook(checkFull); //checkFull is a fn called by getAddressBook
},

this works and it keeps the scope within an element click event with the scope set to the class and not the element--there is no point in passing scope to the add method, it already has that:
var foo = new Class({
Implements: [Options],
add: function(what) {
alert(what);
},
initialize: function(options) {
this.setOptions(options);
this.options.element.addEvents({
click: function() {
this.add(this.options.what);
}.bind(this)
});
}
});
window.addEvent("domready", function() {
new foo({
element: $("foo"),
what: "nothin'"
});
});
just make an element with id=foo and click it to test (alerts nothin'). if your onclick is a function / event handler within your class as opposed to a normal element click event, then things are going to differ slightly - post a working skeleton of your work on http://mootools.net/shell/

If you read my previous answer, disregard it. The MooTools .bind method supports passing parameters. So something else isn't working as you expect:
onclick: this._add.bind(this, 'y');
Here is a simple setup on JSBin to show how bind truly does pass parameters.

The only purpose of bind is to "tell" the JS what object you mean when you say this. i.e. you pass as a parameter to bind an instance of the object you wish the this key word will refer to inside the function you used the bind on.