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.
Related
I use https://github.com/Dimox/jQueryFormStyler for styling form inputs.
I set the property ng-model="c.model.acept".
If I click on "styled checkbox", then input gets to property "checked", but the angular model still has the old value.
I tried to trigger the change event with no result.
If I trigger the click event, then the checkbox gets changed twice (once from click, and then the second time from the triggered click event).
How to fix it?
You can not change "ng-model" of particular input field conditionally.
In this condition what you can do is, keep two input field and use "ng-show" or "ng-if" attribute to show & hide input field conditionally.
Hope this will hep you.
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.
I want to check if user changes the value of a textbox. If the user changes the value, then I want to display the changed value in a different textbox.
jquery has an event for this, .change(), this event will detect content changes when the textbox looses focus.
If you are wanting to detect the change at every keypress, .keyup() and .keydown() might be better suited for your needs.
Examples for your intended use:
//just change '.change' to '.keyup' or '.keydown' the rest is the same.
$('input').change(function() {
$('target').val(this.value);
});
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)
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().