We Keep Coding

Update input value when using jQuery UI slider

I'm using the jQuery slider to change the value of an input.
div#slider
input#amount
I use the value of the input to perform some math with:
$("input#amount").change(function() {
...
The thing is, when I enter some value in the input, it works fine, but playing with the slider, the value appears to change, but no calculation is performed.
jsfiddle:
http://jsfiddle.net/mfeqoL7L/
Why/How to fix this?
Thx!

The problem is that setting a value on an input element using .val doesn't fire the change event: Why does the jquery change event not trigger when I set the value of a select using val()?
To manually fire the event call .change explicitly after setting the .val.

set event on dynamically changed data in field via jquery

I have several field
$("#a1").change(function(){
console.log('fire'); });
but when value change not user event not work
form[0].val = 100;
event not work
how can i catch this change data ?
ps data changes from different places not my code suggestions like trigger('change') not good idea

I do not think that events will fire when you set the value in that fashion.
Does it work when you set the value of the element in the browser?
What you can do is call form[0].change(), and it should work.

Changing the value property will not fire the change event.
In fact, your code should be changing value and not val.
You could call it explicitly after updating it.
form[0].value = 100;
form.change();
But you mention that is not an option.
The only other way is to poll for changes.

You could define a way of working with the controls inside your form. Create a javascript function that external developers can call to set the value of a given field and make them use that method. Then you can fire change or do whatever you want to your hearts content.

Detect change of select list using Jquery

Is there a way to detect when the value of a select list is set to empty by a javasscript and not by the user? It seems that the change-event only triggers by mouse or keyboard.
And is there a way to detect when the number of options in a select list changes (added, removed)?

You have to trigger the change event manually, when you are changing the value of a select with javascript. E.g:
$('#myselect').val(10).change();
In this example the value is set to 10 and the change event is triggered. If there is an event handler attached to the select, it will be executed.

Use Jquery's change function
$("#idofselect").change(function(){ });

To answer your first question, not it's not possible to detect what caused the change in the select list in the change event itself.
However, if there is javascript code changing the select list you could add some logic in there to perform the tasks needed in this scenario.

onchange not getting triggered

I have a calendar which comprise of an input tag and an image on click of image calendar popups comes and sets the value for input tag using javascript.
now i have added onchange event on input tag which doesnt gets triggered since m changing the value using javascript, so what should be done to trigger it i dont want to trigger it explcitly
i tried focusing on input on click of image and focus out on setting the data(into input element) but it didnt worked any workaround?

You can call the onchange handler manually.
Example: http://jsfiddle.net/NQCy7/
element.value = 'new value';
element.onchange();

just tested what you described, it's the same problem here.
a simple workaround would be to call the onchange-method directly (where you're doing the .focus()/.blur() now)

How to stop onChange in JavaScript

In one of my selection boxes, I have an onChange="..." specified...
because I want to change some other form value after any selection changes.
However, in the same page, some weird case I have to manually set the value.
So I have to use some JavaScript to set the value of the selection combobox, but in this case, I don't want that onChange event to be fired.
How can I walk around it?
Forgot to mention that I am actually using dijit.form.comboBox.
For normal HTML form comboBox, it won't cause any issue.
Only I use the dijit comboBox, and I try to set the value to some other value, dojo will trigger the onChange.

If you are using Dijit, then you can pass an additional false flag at the end of the set() method that will prevent the widget from firing the onChange event.
For example:
dijit.byId(myComboBox).set("value","Choose an option...",false);

Found this answer from Paul Christopher at http://dojo-toolkit.33424.n3.nabble.com/onchange-event-firing-when-setting-value-of-a-Select-programmatically-td3985692.html. It worked perfectly!
myDigit._lastValueReported = myValue;
myDigit.set('value', myValue);

You don't need to do anything. Setting the value with Javascript will not fire your onchange event handler.

In general, setting the value with JavaScript won't fire onchange. If you're dealing with a strange browser that does fire it, you could remove the onChange (element.onchange = null), change the value, then add it back (element.onchange = functionname) afterwards.

FYI, this answer is not fully correct. It is true that simply setting the value does not trigger the onChange event, BUT as soon as the control loses focus, the change will be detected and onChange will be fired.
So delaying onChange is not really the same as preventing onChange - which is what I need to do!
I could temporarily remove the event, blur and refocus the field, and then restore the event, but this is an ugly hack. It is complicated by dynamicaly added events like jQuery. so really what I'd like is to set the 'focus value' to the 'new value', but haven't been able to find this. I could try setting the defaultValue, but this would prevent a correct form.reset().