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
Related
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..!).
I have a page where a series of checkboxes are displayed next entries from a database, they each have an onClick event to do an Ajax write of their value to the database.
I want to have a button on the form that toggles all the checkboxes, so I used the following function/jQuery:
function toggle_chk_links(){
$(".chk_user_link").click();
};
It works fine visually, the only problem is that although it triggers the onClick event as required the checkbox is read with it's old value, so the database gets the opposite value to the one required! This is the line reading the checkbox in its' onClick event:
active=Number($("#chk_brandlink"+brand_ID).prop("checked"));
I need users to be able to manually click on each checkbox, as well as toggle them all, ideally using one onClick function call. Any suggestions?
The easiest solution is to handle the onchange event instead of the onclick event.
$(".chk_user_link").change(function() {
// your change handler
});
Example: http://jsfiddle.net/7zHRm/1/
I have a select box that needs to act even if the user selects the currently selected item. I have used onChange (via JQuery) but it doesn't fire if the same item is selected because it hasn't changed.
Is this even possible?
I'm not sure i understand your question clearly cause of my English. You want to know when a checkbox is clicked if it is already checked you want to fire a function. If i'm right then you can do it in many ways. E.g If you have 2 classes for your checkbox checked or unchecked you can look if that checkbox got "checked" class with .hasClass or you can store index of a checkbox in an array when it is clicked, and every click on a checkbox you can search array if that array has index of that checkbox. If result is true, you fire your function.
You can try in each of your select box to include the onclick event and call your desired function when that happens.
Or you can use the onblur event in your element and fire your function when that happens.
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 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.