Develop Reference

Set the default value in select list using jQuery

If I have only one option in my dropdownlist, I need to select this option as default. How can I do this using jQuery?

I think you are new to SO, the usual procedure here is to provide some code of your own efforts on the matter before posting. That said, this is simple JQuery:
Edit to fit new specifications:
if($("#select_id option").length == 2){ //if there are exactly 2 options in the select element
$("#select_id option:nth(1)").attr("selected",true); //take the second option (element 0) inside the element with id "select_id" and set the selected attribute.
} //I think we do not need an else if any other thing will select the first option by default
Anyway, first option should be selected by default.
<select id="select_id">
<option value=1>First option is selected by default</option>
</select>
<!--adding proof that it is selected-->
<script>
$(function(){
alert($("#select_id").val()); //this will alert 1, since is the value of my first option
});
</script>

find a select option with same value as select data-status and load option as "selected" with jquery

I am loading 2 separate ajax responses into a select dropdown and the select dropdown will have a data-status, what I am looking to achieve is to loop through the options and find the option that has the same value as the select data-status and load it as "selected".
Given my html code generated from my ajax call:
<select class="orderCurrentStatus" data-status="1215458">
<option value="608653">Goods Received</option>
<option value="608654">Purchase - Awaiting Payment</option>
<option value="608655">Purchase - Payment Received</option>
<option value="766705">EXCHANGE FEE PAID</option>
<option value="838627">Order Refunded</option>
<option value="1215458">Goods Dispatched</option>
<option value="2322397">Paid - Custom Order Under Production</option>
<option value="2384172">WRONG/INCOMPLETE ADDRESS!</option>
<option value="2544576">Paid - Awaiting Pre-Ordered Items</option>
</select>
My attempt to make it work:
var order_status = $(".orderCurrentStatus").data("status");
var options = $(".orderCurrentStatus option");
if (options.val(order_status)) {
$(this).attr("selected");
}
I just can't get it to work.

You can just use the attribute selector [value="'+ order_status +'"] in order to select an option element that has a value equal to the variable order_status.
From there, set the selected property value to true or selected.
$('.orderCurrentStatus option[value="'+ order_status +'"]').prop('selected', true);
There were a couple issues with your initial code.
The variable this refers to the global object, in this case the window object, since there is no functional scope.
If you don't specify a value when using the .attr() method, the selected attribute value is returned. You need to specify a second parameter in order to set a value for the selected attribute. Specifying true or selected will work in your case. However, the .prop() method is better suited for this since you should be setting the property.
Additionally, if you want to do this for all select elements, then you could iterate over them, then retreive the data-status attribute value, and set the corresponding option element's selected property:
$('select').each(function () {
var status = $(this).data("status");
$(this).find('option[value="'+ status +'"]').prop('selected', true);
});

You should somehow check if an option with the value specified exists! This what you actually tried is assigning a value to every option element.
This should be simple solution:
var order_status = $(".orderCurrentStatus").data("status");
if( $('.orderCurrentStatus option[value=' + order_status + ']').length )
$('.orderCurrentStatus option[value=' + order_status + ']').attr('selected','selected');
You could verify the code on JSFiddle:
https://jsfiddle.net/cwma9h5m/

You can always iterate through the option values to match with the data-status value.
var status = $('.orderCurrentStatus').data("status");
$('.orderCurrentStatus option').each(function(){
if( $(this).val()==status){
$(this).prop('selected', true);
}
});

How to select the <select> tag including checked and unchecked options using queryselectorAll()?

//initial code
var selectInputs = document.querySelectorAll('option:checked');
var selectArray=[];
for(var i=0;i<selectInputs.length;i++)
{
selectArray[i]=selectInputs[i].value;//am doing this since I found out (from stackoverflow) that selectInputs contains a NodeList and in order to use it, it must be converted or saved as an array
}
//later stage manipulation code
var input_select= document.querySelectorAll('option:checked');
for(var i=0;i<input_select.length;i++)
{
input_select[i].value=selectArray[i];//I am trying to change the value of the <select> option
}
PURPOSE: User selects option in a form and data is saved in local storage.
I want to reflect the same when the form reloads. I am not working for a specific form so using Jquery seems futile(as it works with class or id and I don't know the id or class of any tag of the generic form)
PROBLEM:
The problem is that I wanna select the entire options set of tag and not just the ones that have been checked/selected.The code above sets the value of the default selected option to the one stored in local storage but doesn't reflect the change in the form. It always displays the default value though giving
alert(input_select[i].value);
reflects the internal change perfectly!

Guess I gotta answer my own question :-D
If you could see, there's just one silly change in the
//later stage manipulation code
ABOVE.
ANSWER:
var input_select= document.querySelectorAll('select');
for(var i=0;i<input_select.length;i++)
{
input_select[i].value=selectArray[i];//I am trying to change the value of the <select> option
}
Instead of
var input_select= document.querySelectorAll('option:checked');
It must be
var input_select= document.querySelectorAll('select');
REASON: I have been trying to assign the stored value into the option itself (the option tag) rather than the select tag as a whole.
WARNING: In the code
input_select[i].value=selectArray[i];
It could also be
input_select[i].value="Friday";
provided that you already have an option like that, else it would show a blank.
<select name="days" id=days">
<option value="0"> Friday </option>
<option value="1"> Monday </option>
</select>
works
<select name="days" id=days">
<option value="0"> Saturday </option>
<option value="1"> Monday </option>
</select>
doesn't work. Shows a blank.

HTML Combo Box selected Item's value

Im trying to make this HTML combo box equal to a value.
<select name="file_type">
<option value=".jpg">.JPG</option>
<option value=".png">.PNG</option>
<option value=".gif">.GIF</option>
</select>
So when i select jpg on my web page, does that mean that file_type = .jpg? I'd think so.
So then im trying to call that value from javascript, like so:
var fileType = document.getElementByID("file_type").value;
is that how it is done? How else can I get the value of the selected item in the combo box?
Regards

First your control has no ID attribute set only name so you need to add the id to the html
<select id="file_type" name="file_type" >
Then the way you get the selected of a combo is like:
var selectCtrl = document.getElementById("file_type");
var selectedItem = selectCtrl.options[selectCtrl.selectedIndex];
This selectedItem has to properties value and text:
selectedItem.value //<-- ".jpg"
and
selectedItem.text //<-- ".JPG"
Online Demo

mvc3 dropdownlist setting the selected value from model

I am creating a select list in my .aspx page.
<label for="AccessType" class="required"><span class="required">*</span><%=Html.Resource("accessType")%>:</label>
<select id="AccessType" name="AccessType">
<% foreach (var item in Enum.GetValues(typeof(Security.AccessType)))
{%>
<option value="<%=(int)item%>"><%=item%> </option>
<%}%>
</select><br />
Now every time I load the page it is selecting the first value as default, where as I want the value present in model to be the selected.
I am biniding the dropdown to a enum in my code. Security.AccessType is a enum and not a model. so every time the page loads it shows the selected value of the dropdown as first enum
I want the selected item to be say Model.AccessType...
I know its a very basic question but still any help?

You can give the option which you want to be default a "selected" attribute, like:
<option value="apple" selected="selected">apple</option>
If you want to select an option dynamically, you can do it by javascript. Eg:
var el = document.getElementById("AccessType");
el.selectedIndex = yourIndex; //index of the option you want to select
//or
el.value = "yourValue"; //value of the option you want to select

I used the followig and got the result..
$('#ddlAccessType').val($("#ddlAccessType option:contains('" + $('#AccessTypeValue').val() + "')").val());
This is first getting the AccessType value then checking for its index in the dropdown list and then setting the selected index to the index found out.
A bit bizzare, but worked fine for me..