WorknHardr
asked on
FireFox 33.0.3 and Input Type Select option:selected Not Working?
I need to 'reset' all the dropdowns on a form showing in Jquery-ui dialog.
The following code works with Chrome 38.0.2125.111 and IE 11.0.9600.17358 but NOT with FireFox 33.0.3...
I have two code examples and only use one and comment-out the other. Just wanted to show both...
[Jquery UI Dialog]
The following code works with Chrome 38.0.2125.111 and IE 11.0.9600.17358 but NOT with FireFox 33.0.3...
I have two code examples and only use one and comment-out the other. Just wanted to show both...
[Jquery UI Dialog]
var $dialog = $('#myModal').dialog(
{
autoOpen: false,
open: function (event, ui) {
},
close: function (event, ui) {
$('#form1 select option:first-child').attr('selected', 'selected');
$("#form1 select").each(function ()
{
$(this).find('option:first-child').attr("selected", "selected");
});
},
buttons: [
{
text: "Clear All",
width: "100",
click: function () {
$('select option:first-child').attr('selected', 'selected');
$("#form1 select").each(function () {
$(this).find('option:first-child').attr("selected", "selected");
});
}
}
]
});
<div id="myModal">
<div>
<div>
<div>
<form id="form1">
<div class="form-group">
<div class="col-sm-4">
<label class="col-sm-3 control-label">Class</label>
<select class="form-control" id="class" name="class">
<option value="class">Any</option>
<option value="class">Article</option>
<option value="class">Conjunction</option>
</select>
</div>
</div>
<div class="form-group">
<div class="col-sm-4">
<label class="col-sm-3 control-label">Case</label>
<select class="form-control" id="case" name="case">
<option value="case">Any</option>
<option value="case">Accusative</option>
<option value="case">Dative</option>
</select>
</div>
</div>
</form>
</div>
</div>
</div>
</div>
ASKER
That works too good, I need the first option to display in each dropdown. Sorry I didn't specify on original post ;)
and what did you get?
ASKER
All selects have blank text area, but dropdown values show on dropdown open.
which line is the blank area here ?
<select class="form-control" id="class" name="class">
<option value="class">Any</option>
<option value="class">Article</option>
<option value="class">Conjunction</option>
</select>
ASKER
Line one, all elements show text when click down arrow.
I don't understand what you mean
I think you should open a new question and close this one as your initial requirement (resetting a dropdown) work fine in firefox now
I think you should open a new question and close this one as your initial requirement (resetting a dropdown) work fine in firefox now
ASKER
How bout this: $("#form1 select").prop('selectedInd ex', 0);
what is the difference?
ASKER CERTIFIED SOLUTION
membership
This solution is only available to members.
To access this solution, you must be a member of Experts Exchange.
ok.
ASKER
Found answer myself
click: function () {
$("#form1 select").val("");
}