dojo Select box, triggering events on select - javascript

Hi I am using a dojo select, I have a text box where a certain ID is entered and then based on what is chosen on the select box an action is performed. Now the problem is, suppose over two different requests the action remains the same and the id changes I cant trigger the function with the onChange event. How do i handle this? Even if the user opens the select box and chooses the same item as last time I want the function i've written to be called.

onchange fires when any option is changed of the combo box.In your case you are not changing the options so obviously that event will not fired.
You can try onclick instead.
Write the same code in onclick for the select element (however with some intelligent logic since onclick will keep on firing even before you are able to select any option which may not expected in your case..!).

Related

Hidden focus on blur of an input element in dom

A little Explanation : I am using List view control of kendo UI(Telerik). I am triggering an update event of that control after editing the fields in list view. The list view control is having some text-boxes, a dropdown,checkbox and a submit button. When a user change something, ideally it should trigger update but its not doing update because control is not able to judge if there is a change in model.
It is only working if I input something in textbox and just click on outside of textbox i.e just do a onblur before hitting submit. I don't know why it is happening but what I need is to just trigger a focus event but in a hidden mode so that user is unaware of it but it just happens after a user input something in textbox so that the list view control works successfully.
I am trying to do it like below but it will get noticed to user. How can i trigger focus in hidden mode after a user just enter something in textbox before hitting a submit?
function BlurFunc() {
debugger;
$(this).closest('li').find('.inputField').focus();
}
Without your code it is not clear whether you are using MVVM data binding to your model, but this may help; from http://docs.telerik.com/kendo-ui/framework/mvvm/bindings/value:
By default the value binding relies on the change DOM event, which is
raised after blurring the element whose value has changed. This means
that the value from the View-Model is updated when the element loses
focus. The data-value-update attribute can be used to specify a
different DOM event, such as keyup or keypress. The keydown event is
not supported, because the DOM element value is not yet updated when
that event triggers.
For example, try adding data-value-update="keyup" as an attribute to your text box input element:
<input data-value-update="keyup" data-bind="value: inputValue" />
This should then update the model value upon each key press and not wait until focus has been removed.

jQuery capture the change event of a dropdown when change is performed by JavaScript

I would like to be able to detect when the selected value of dropdown has changed using jQuery. The selected value of the dropdown is changed by other JavaScript, so I want to be able to catch this event.
I can see the dropdown changing, however the following code does not capture the event correctly. Does the change event only capture the event when it is performed by the user and not other code?
$('select[name=b_country]').live('change', function() {
alert('the country dropdown has changed');
});
<select name="b_country" style="display: block;">
Yes, only user interactions fire the event. Otherwise you wouldn't be able to (re)set values in a listener without entering an infinite loop.
If you want to inform other (listening) scripts that you changed the value, you can manually trigger an event. With jQuery, this is easy:
$('select[name=b_country]').val(…).change();

Attach onclick event to a dropdown with one element

I have a dropdown. Initially it is empty and at some point it is filled with elements dynamically. When the user choose an option the onchange event is triggered. This works when there are at least two values in the dropdown.
What I want to accomplish is, when there is only one element in the dropdown and the user clicks it, some event to be triggered. I tried the onclick event but this does not worked on the dropdown.
Here is my jsfiddle:
http://jsfiddle.net/MwHNd/551/
Some option may be to have defaut value like "Choose an option" in the dropdown and this way the onchange will always trigger. Is there are way to do it without this option?
Documentation is your friend:
http://www.kendoui.com/documentation/ui-widgets/dropdownlist/events.aspx
Example: http://jsfiddle.net/MwHNd/553/
well its not as simple as that, there are two aways you can go about doing this, both requires if statements..
you can either "dyamically" in js see how many options there are in a selector and tell it to change the element to a button OR do a focus function with jquery if there is only one element in your dropdown
$selector.focus(function(){
then whatever you wants etc
also you said you would not want to do this with a drop down. use a javascript function to click the event plus the selected index of the option values you want
function change(){
document.getElementById("your-element").selectedIndex =2;
}
function changeit(){
document.getElementById("your element").selectedIndex =1;
}
function changeitup(){
document.getElementById("your element").selectedIndex =0;
}
so if you wanted the selected index plus the event you want to do
<input type='button' onclick="change();otherfunction()"> would give you the selected index plus the function you wanted originally

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.

javascript or jquery event that fires whenever the selected value of a select changes

I know i can use the javascript event onchange, or the jquery event change, however, enother of these cover the senario when the user does not change the value of the select him self.
For example, when using javascripts onchange event if I have three cascading selects and I select the first one, and the second one populates and the default value if the second one is the one the user wants, the onchange event of the second select is never fired, hence the third select is never populated.
ideas?
two ways you can do
1>
on second <select> create first option with value= "[choose something]" this way user will be forced to choose some thing from select2
2> When you populate the second select ,trigger its onchange event
How about putting a dummy value at the beginning on the select ,like a blank option. So that the user is forced to select another that has a value.
Insert a dummy item in the second select as the first item:
<option value="">-- select one --<option>
That way the user must fire the change event to select an item,
Autopopulate the third select box with the values it should have for the default of the second is one option. Otherwise as others have suggested a Please Choose option that forces onchange to fire.
If your changing the content via javascript, you can also trigger the change event explicitly.

Categories