Set selection dropdown value in Javascript - javascript

I'm trying to set a value for a selection dropdown using javascript. Please see the pictures below. When I manually change the value of the dropdown list (by clicking), the timeline changes in accordance to the new value.
selection dropdown
timeline
When I do the following with javascript:
myDropdown.selectedIndex = 4;
The value is changed in the dropdown, but it doesn't update on the timeline. Is there any way to trigger this update?

I solved it by going through a huge javascript file.
What eventually worked was to call the dropdown change function with: $(".timeslotdrop").change();

Related

How to get selected values of all dynamically created multiple dropdowns using jquery

I have created dynamically row with drop-down list, i want to get all selected values from dropdowns of rows with JQuery. Please help me.
Since you haven't posed any code snippet, I'm just gonna wing it, assuming it's a standard <select>-box.
// Loop all parents and grab the value which is set by the browser whenever update occurs.
var values = [...document.querySelectorAll('select')].map(x =>x.value)

select2 change selection programmatically

I've got a select2 selection that I'm trying to set the value for using javascript.
I've created a fiddle at this address.
https://jsfiddle.net/rfeynman/wn9v3bud/
I'm trying both he following
// method 1
$('#groupList').select2('data',{id:"group2", text:"group2"},true);
// method 2: as seen on the select2 website
var groupList = $('#groupList').select2();
$(groupList).val("group2").trigger("change");
My problem is that I'm unable to change the selection for a select2 input that loads data using ajax. Any idea what i'm doing wrong?
looks like this can be done using the following code. you need to add the option to the select list and then set the value.
var option=$("<option>").attr("value","group2").html("group2");
$("#groupList").append(option);
$("#groupList").val("group2").trigger("change");

Angular JS seemingly loses binding to ng-model when selecting drop down value manually

I have a select control that I'm populating based on a list of objects:
<select data-ng-options="obj.QuestionText for obj in jumpToList track by obj.OrderNumber" data-ng-model="questionSelectionJumpTo"
data-ng-change="questionDDLChange(questionSelectionJumpTo)" id="ddlJumpTo"></select>
In my controller, I'm setting the default value when the modal that contains the drop down list appears by setting questionSelectionJumpTo like this:
$scope.questionSelectionJumpTo = $scope.jumpToList[someIndexNumber];
This works correctly.
As long as I change the value via the controller, such as when I call a function from a button, and I set $scope.questionSelectionJumpTo, it correctly updates the drop down list to show the appropriate option.
However, when I manually change the drop down list by selecting one of the options, the controller can no longer set the selected option using $scope.questionSelectionJumpTo.
Any ideas on what might be causing this? Thanks for the assist!

Updating gridview's drop down lists using JavaScript?

I have a gridview with several fields. Fields in question are PreviousPoints, GainedPoints, TotalPoints. In the edit mode PreviousPoints is not editable, just data bind, GainedPoints is a drop down list and Total Points is a Drop Down List.
When GainedPoints drop down list selected value changes, I need the TotalPoint selected value to be set to the value of PreviousPoints control + GainedPoints selected value.
But, I cannot refresh the whole page using post back.
How can it be done using JavaScript or something similar without reloading the page?
you can use the onselect() function in javascript and have your computations there.

asp:ListBox control selecting a row using javascript

I have an asp:ListBox control on my web page. I am trying to select an item in the list using javascript. After looking at the underlying structure I have tried:
catListBoxCtl[0].Selected = true;
Which does indeed set the 'selected' value to true but it doesn't highlight the appropriate row. I am just trying to replicate what a user does when you select a row using a mouse. How do you select a row programatically so that it get's highlighted etc?
Thanks.
I think you're missing the reference to the options. Try:
catLIstBoxCtl.options[0].selected = true;

Categories

Resources