We Keep Coding

Get the value of Select dropdown list when the value sent by the form and that appearing in the dropdown list are different

I have a form which has the following Select dropdown list.
<select name="some_options" id="some_options">
#foreach(options as option)
<option value="{{$option->id}}">{{$option->value}}</option>
#endforeach
</select>
Here , the data are being sent from the database via the Controller
The Select data look like this
<select name="some_options" id="some_options">
<option value="opt001">Value 1</option>
<option value="opt002">Value 2</option>
<option value="opt003">Value 3</option>
<option value="opt004">Value 4</option>
<option value="opt005">Value 5</option>
</select>
Now, I have another disabled field which should get the value once the user changes the select option
<div>
<input type="text" id="some_options_cng" disabled>
</div>
My Javascript code
var opt = $('#some_options').val();
$('#some_options').on('change',function(){
opt = $('#some_options').val();
$('#some_options_cng').val(opt);
});
Now, the value in the <disabled> input field shows as
opt001 or opt002 and so on.
I want to show values as
Value 1 or Value 2.
How do I do it?

This code will work.
$('#some_options').change(function(){
var opt = $("#some_options").find(":selected").text(); //This line of code is
//important
$('#some_options_cng').val(opt);
})
$(document).ready(function(){
$('#some_options').change(function(){
var opt = $("#some_options").find(":selected").text();
$('#some_options_cng').val(opt);
})
});
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<select name="some_options" id="some_options">
<option value="opt001">Value 1</option>
<option value="opt002">Value 2</option>
<option value="opt003">Value 3</option>
<option value="opt004">Value 4</option>
<option value="opt005">Value 5</option>
</select>
<div style="height:5px;"></div>
<div>
<input type="text" id="some_options_cng" disabled>
</div>

how to determine specific item to be selected in combobox with javascript

when I open the combobox via contextMenu, always the same item is selected.
How can I determine that one of the other items is selected?
For instance, there are 3 items "car1", "car2", "car3" and when I open the combobox "car1" appears in the list first. So how would I get e.g. "car2" appears in the list first?
Thanks very much!

if you mean a select element, you can change the order of items
<select id="list">
<option value="2">Car 2</option>
<option value="1">Car 1</option>
<option value="3">Car 3</option>
</select>
you could also set the default item with the selected attribute:
<select id="list">
<option value="1">Car 1</option>
<option value="2" selected>Car 2</option>
<option value="3">Car 3</option>
</select>

in JS you simply have to set the value of your select
const myForm = document.forms['my-form']
// set the select on the second cat
myForm.miaou.value = 'c2'
<form action="xxx" name="my-form">
<!-- other form elements -->
<select name="miaou">
<option value="c1">Cat 1</option>
<option value="c2">Cat 2</option>
<option value="c3">Cat 3</option>
</select>
</form>

jQuery get the <select> value rather than the selected <option> value

In the above example the console logs a value of 1 which is the currently selected option. How can you log the <select> tag's value of 2?
$(document).ready(function() {
console.log($('.mySelect').val());
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<select class="mySelect" value="2">
<option value="1" selected>Choice 1</option>
<option value="2">Choice 2</option>
<option value="3">Choice 3</option>
</select>

This is not valid HTML syntax.
Use data attributes like data-someattr for values you want to pass.

This would work for you .
console.log( $('.mySelect[value=2]').val() );

Adding Hidden Attribute To Select Option Based On Option Value

I'm trying to create a working function that will hide specific select options based on certain values. The options will not have a class or id so I need to use the option value as an identifier.
Does anyone see a problem with this function?
function delivery_rate(valMap) {
if(valMap === 5000){
$(".addon-select option[value="1-day-1"]").setAttribute("hidden", true);
}
}

Instead of applying hidden on the options tag, create different versions of <select> and set all to be hidden. When a user selects a value that matches the criteria of that <select> tag, show that specific tag.
<select name="select" class="first-select">
<option value="value1">Value 1</option>
<option value="value2" selected>Value 2</option>
<option value="value3">Value 3</option>
</select>
<select name="select" class="second-select">
<option value="value4">Value 1</option>
<option value="value5" selected>Value 2</option>
<option value="value6">Value 3</option>
</select>

How to get the select box values in a variable

i have a selectbox which have values from 1 to 4 and I need to put the value I select in a javascript variable and send it in a function.Here is the way I am trying to do that..
<form enctype="application/json" method="post">
<select id="select" name="options">
<option>Choose Your Option</option>
<option value="1"> 1</option>
<option value="2"> 2</option>
<option value="3"> 3</option>
<option value="4"> 4</option>
</select>
<input type="submit" value="submit" onclick="aMethod()"/>
I need this values in a variable and want to put that value in this method so that I can use that.can anybody help

You can retrieve the selected value like this:
var val = document.getElementById("select").value;
Working demo: http://jsfiddle.net/jfriend00/ah7TU/

You can do it like this:
var select = document.getElementById('select');
var value = select.value;
FIDDLE