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)
Related
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.
I have a select inside HTML
<select id="league" name="league">
which I'm listening for changes inside my javascript.
var league = dojo.byId("league");
dojo.connect(league, "onchange", function (evt) { //do stuff }
Which works fine.
However I have a link that I can click which updates the select:
League
The link works as it updates the selected value of the select with the following function.
function updateSelection(NewLeague){
dojo.byId('league').value = NewLeague; // works
dojo.byId('league').onChange; //this isnt working
//dojo.byId('league').onChange(); //this throws: TypeError: dojo.byId("league").onChange is not a function
}
My problem, as I've read through other stack posts is that programmatically updating the value wont trigger onChange, thus I need to call onchange in the code (shown above). As per the comments inline, the onChange isn't being triggered or throws an error. My first thought that it has something to do with the dojo.Connect which listens for onChange, but I havent found any information that says I cant do this, nor any explanation how to get around it.
Any ideas?
Select onchange doesn't fire for programattic changes, you need to fire it yourself with league.onchange();
As noted by #Greg, the call should be lowercase.
Additionally, I don't know if dojo has a trigger method, but in jQuery this would be done as jQuery('#league').trigger('change').
Depending on your version of dojo you may also want to check: http://dojotoolkit.org/reference-guide/1.8/dojo/connect.html
Have you tried just calling the select by it's id using normal js?
document.getElementById('league').onchange.call();
As others have said, you need to trigger the event yourself, just setting the value does not do that. See the code on How to trigger event in JavaScript? to see how in a cross-browser way.
I am having an issue trying to trigger the test() function when updating the input of type text "testName" using the DOM. Does it have something to do with the DOM itself? It works when I am directly clicking on the input of type text and modify it, but not when another JS function access it through DOM to modify it.
document.getElementById('testID').value = "test";
Thank you
If you need to trigger the onchange event your code has to be like shown below
document.getElementById('testID').value = "test";
document.getElementById('testID').onchange();
Hope this solves your problem.
unlike a text field, a text area has no value that gets populated. make a div with id="testID" inside the text area and use that instead.
document.getElementById("testID").innerHTML="New text!";
if it is a text field, then your code should owrk
document.getElementById('testID').value = "something";
what are you using to trigger the event? onclick? onchange? what's it related to
On this page:
http://www.blackdownluxurylettings.co.uk/place_booking/2010-3-18,2
I am using an onchange event on the "number of days" select box to update the "departure date" field.
But currently nothing is happening.
Any ideas?
Just looking at it quickly: wouldn't you want the ONCHANGE event attached to the SELECT tag rather than the individual options?
You can bind it this way using JQuery:
$("#ddlNumberOfDays").bind('change', mainPharmacy_Change)
Maybe for javascript, you should just try 'change'.
If I recall correctly, the regular Javascript onChange event only fires once the select box loses focus AND it's contents have been changed. I don't know how jQuery achieves it, but their change method will fire whenever the contents are updated.
Also, I get the following error in my Javascript console when loading your page:
[cycle] terminating; zero elements found by selector
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().