CODEWITHSUNDEEP
jqueryinternet-explorer
user2826111
user2826111

Reputation: 152

Browser issue, script works in Firefox but not with Internet Explorer

I have search jquery script, on this jsfiddle link http://jsfiddle.net/kzpFA/ but it works fine with firefox but not with Internet Explorer. What should I do so that this script works same like FF in IE also. Please help

Below snippet I am getting problem for simple click event also

$("select option").click(function(){
    var proid = $(this).text().split(":");
    $("#searchInput").val(proid[0]);
});

Upvotes: 0

Views: 227

Answers (3)

artygus
artygus

Reputation: 615

Probably IE cannot bind js events to option elements, but you can set value attribute to options and use the onchange event of select element: 

$("select").change(function() {
     var proid = $(this).val().pop().split(":"); 
     ...
});

But if user select multiple items using ctrl or shift key (as you set multiple attribute) you're only able to get the lowest or topmost selected value in the list without logic complication

http://jsfiddle.net/kzpFA/12/

Upvotes: 1

Ishan Jain
Ishan Jain

Reputation: 8161

You have multi-select drop-down list and you bind the options click event: this not correct

for this you can try to bind drop-down onchange event to do this(because it's an html element event and it's work on all browsers):

HTML- 

 <input id="searchInput">    
 <select name="" id="selectbox" multiple="multiple" onchange="getset();">
     <option value="">ankit:naredi</option>
     <option value="">suyog:ma dle</option>
     <option value="">sushil:tade</option>
     <option value="">dipen tiwari: kumar</option>
     <option value="">suyog: sarang</option>
     <option value="">sushil</option>
     <option value="">suyog</option>
     <option value="">sushil</option>
     <option value="">suyog</option>
     <option value="">sushil</option>  
 </select>

Javascript - 

function getset(){
    var proid = $('#selectbox option:selected').text().split(":");
     $("#searchInput").val(proid[0]);    
}

Try This

Upvotes: 1

Rajiv Ranjan
Rajiv Ranjan

Reputation: 1869

Need to update you jQuery code and select html code.

jQuery Updated code:

$('#selectbox').on('change', function (e) {
var optionSelected = $("option:selected", this);
var valueSelected = this.value;
var proid = valueSelected.split(":");
$("#searchInput").val(proid[0]);
});

Html Updated code:

<select name="" id="selectbox" multiple="multiple">
<option value="ankit:naredi">ankit:naredi</option>
<option value="suyog:ma dle">suyog:ma dle</option>
<option value="sushil:tade">sushil:tade</option>
<option value="">dipen tiwari: kumar</option>
<option value="">suyog: sarang</option>
<option value="">sushil</option>
<option value="">suyog</option>
<option value="">sushil</option>
<option value="">suyog</option>
<option value="">sushil</option>
</select>

Need to put option value to work above jQuery. http://jsfiddle.net/kzpFA/9/

Upvotes: 1

Related Questions