How to change the dropdown list value in javascript? - javascript

i have this dropdown list,
a,b,c,
and 2 radio buttons rdbButton1 and rdbButton2.WHen i click on rdbButton1 dropdownlist will appear and when i click on rdbButton2 i have to set dropdownlist value as a.how can i change dropdownlist value (i want to change it in javascript or jquery)

$('#id_of_the_option_element').val('new_value');
$('#id_of_the_option_element').html('new_caption');
$('#id_of_the_option_element').attr('selected','selected');
search how autoid works by searching "autoID asp.net" on google. This may help, too.
http://msdn.microsoft.com/en-us/library/system.web.ui.clientidmode.aspx
you should go to the source view to check how the ID's of the html elements change.

Related

Is there a way to put checkboxes inside a Select with antd?

I'm looking for a way to put checkboxes in an antd Select, instead of the icon displayed when an item is selected.
I have tried to use the menuItemSelectedIcon prop, but it only displays the Checkbox when the item is selected, which is not what I'm looking for.
I'm trying to display a checkbox that is checked when the item is selected, and isn't when the item isn't.
I'm kind of looking for an equivalent of the "treeCheckable" prop available for the TreeSelect.
Is there a way to put checkboxes inside a (simple) Select ?
use menuItemSelectedIcon this prop... u can read abut it in Api section of Select component. Then, do same style in options focus, active & select selector. style should be such as the icon that you will use became different color when it is focused, active or select. you can change options global classname when it will be selected. By doing this, it will look like the checkbox is working but behind the scene it's just a icon of checkbox which will change style .

How can I show a hidden DIV for a selection included with others?

I have a javascript file that when called, checks to see if a particular option is selected on a form. The form allows for multiple selections before being submitted. When a particular item is selected within the given choices it shows a hidden menu. In this case with "audits" I am able to show the hidden menu fine when just "audits" is selected from the list. However, I'm having much difficulty in figuring out how to get the menu to show when "audits" would be selected/highlighted with others. Eg: I had audits, services, someotheroption
Below you can see the code I'm currently using and that's working only when the single item is selected. Any guidance would be much appreciated.
function toggleFields(){
function toggleFields(){
if ($("#installations").val() == "audits"){
$("#dbcredentialsfield").show();
}
else
$("#dbcredentialsfield").hide();
}
Using the code you have so far, I assume you probably want something like this:
$('#installations').on('change', function(){
$("#dbcredentialsfield").toggle($(this).val() == 'audits');
});
This says; when the select element (assuming your dropdown has the id of installations) changes, toggle the visibility of the element with id dbcredentialsfield depending on if the value of the select is audits or not.

Change selectbox depending on radio button checked

I want to change the content of a selectbox based on a radio button.
I'm using AngularJS. So, my select box looks like this:
<select ng-controller="MyController">
<option ng-repeat="o in array_of_values" value="{{o.id}}">{{o.value}}</option>
</select>
Now, depending on wether my radio button is checked or not, I want a different set of values loaded in the select box.
I don't have much experience with Angular, but I suspect I could dynamically change $scope.array_of_values in MyController. Something similar to this example (official documentation)
I've seen another example, where you can change the content of a div based on a radio button, just using ng-model + ng-show
EDITED: But I have another difficulty: I really have several pairs radio button / select box, as table's rows, and they are dynamically generated. I could use plain jQuery plus a javascript function to get the id of each radio button and just change a specific select box based on the onClick event of the radio button. But I tend to think there is a more elegant way to do this, using AngularJS. Am I right?
Any clues? What approach should I follow?
Many thanks in advance
You should start by reading the doc and pick the right components.
Select angular way: https://docs.angularjs.org/api/ng/directive/ngOptions
Radio: https://docs.angularjs.org/api/ng/input/input%5Bradio%5D
$watch the radio models and change the array_of_values values. Prefer use object agains values ({id:0, value:"value0"}).
$scope.radio = {name:"Radio1"};
$scope.$watch('radio', function(newVal, lastVal){
if(newVal.name === 'radio2')
$scope.array_of_values = values2
};
});

How to change dropdown list label text on click?

I have a <select> element in my HTML that is bound via ng-model to an object in the scope.
Initially I want the dropdown to read "Group..." but when the user clicks on the control I want "Group..." to be renamed to "All" so that "Group..." can never be selected, in the same sense that sites use text boxes with default text that gives you a hint to what the form is for and disappears when it gets user focus (e.g. A "Search..." field).
Here is my JSFiddle example which isn't working as I expected: http://jsfiddle.net/TXPJZ/561/
I figured that ng-onclick="myOptions[0].label = 'All'" would work, it should change the value of the data structure that populates the dropdown and thus change the dropdown options but it doesn't.
How do I make this work like I want?
ng-click is the directive you want, not ng-onclick. Using that it seems to work the way you want it to:
http://jsfiddle.net/TXPJZ/562/

DJANGO HTML TEMPLATES : How to know Selected item in drop Down and display In the html page without any action

I want to display the selected item info which is selected From the drop down in, the same html page without dong any action.How to know which item is selected and how to assign that selected value in a variable in html.
You can use jQuery's onchange event handler to detect when choice is changed and also get the value. There is good example on the .change() api page.

Categories