CODEWITHSUNDEEP
javascriptjqueryhtmlgoogle-chrome
kamaci
kamaci

Reputation: 75127

Chrome Drop-Down List Problem

I have a problem with Chrome. I have a drop-down list. Except for Chrome, it works well. However with chrome it adds an empty element at first.

HTML Part:

<head>   
<script type="text/javascript">       
  $(document).ready(function() {
  townDistrictObject.bind({cityId:1});
});
</script>
</head>
    <body>               
        <div class="left marginleft15">
            <p>Town</p>
            <p>
                <select name="town1" id="townId" style="width: 152px;">
                    <option selected="selected" value="999999999">Whole Istanbul</option>
                    <option value="999999998">Anatolian Part</option>
                </select>
            </p>
        </div>
        <div class="left marginleft15">
            <p>District</p>
            <p>
                <select id="districtId" name="districtid1" style="width: 174px;" >
                    <option selected="selected" value="0">Whole Districts</option>
                </select>
            </p>
        </div>
    </body>

There is something like that at script side:

var townDistrictObject = {
   defaults : {
      cityId :1, 
      townElementId : "townId",
      districtElementId : "districtId",
      allDistricts: true
},

bind : function(options) {
  $.extend(this.defaults, options);
  var that = this;
  var opts = this.defaults;
  var townElement = $('#' + opts.townElementId);
  townElement.val(0);           
 }
};

Explanation of problem:

Firstly, there is an empty element at top of list.(It shouldn't be!)

enter image description here

Secondly, I will click one of them.("Whole Istanbul" for my example.)

enter image description here

Lastly, I check the list and that element at top disappears. Everything is OK after that time.

enter image description here

PS: I checked the code and I think that the problem is related to script side. Thanks for your help.

Upvotes: 0

Views: 3256

Answers (2)

kamaci
kamaci

Reputation: 75127

The problem is setting with wrong id at this line:

townElement.val(0);

The answer with Jquery replacing it with: 

townElement.get(0).selectedIndex = 0;

Upvotes: 0

Liam Galvin
Liam Galvin

Reputation: 726

Could it be that you are doing:

townElement.val(0);

You are setting the dropdown value to zero, when there is no option with this value. Instead of zero, should you be using the value from the defaults?

Upvotes: 2

Related Questions