Array push not working in IE5 using javascript?

Question

When I try to load the select options into the optStored array using the array push, the array always remains empty. In chrome, firefox, and safari the code is working correctly but not in Internet Explorer. Is there a work around for this or nothing can be done about this?

Updated 2:12am 10/11/16: Made some changes to the code, previous code is commented out but the array still remains empty! Is there a solution?

// array to store select options
var optStored = [];

// filter select 
function filterFruits(el) {
  var value = el.value.toLowerCase();
  var form = el.form;
  var opt, sel = form.fruits;
  if (value == "") {
    restoreOpts();
  } else {
    for (var i = sel.options.length - 1; i >= 0; i--) {
      opt = sel.options[i];
      if (opt.text.toLowerCase().indexOf(value) == -1) {
        sel.removeChild(opt);
      }
    }
  }
}

// Restore select options
function restoreOpts() {
  var sel = document.getElementById('fruits');
  sel.options.length = 0;
  for (var i = 0, iLen = optStored.length; i < iLen; i++) {
    // Recent Update 2:12am 10/11/16:
    // Found aworkaround for restoring the select options 
    // This method works with versions of IE4+
    sel.options[sel.options.length] = new Option(optStored[i].text, optStored[i].value, false, false);

    // Recent Comment Update 2:12am 10/11/16: 
    // Console complains of a type mismatch error
    // sel.add(optStored[i], null); 
  }
}

// Load select options
window.onload = function() {
  var sel = document.getElementById('fruits');
  for (var i = 0, iLen = sel.options.length; i < iLen; i++) {
    // Recent Comment Update 2:12am 10/11/16: 
    // tried this method as well but no luck. 
    // it was also mentioned in the comments below
    // the array still remains empty!
    optStored[i] = sel.options[i];

    //optStored.push(sel.options[i]);
  }
};

<form>
  <input type="text" onkeyup="filterFruits(this);" placeholder="Filter">
  <select id="fruits">
    <option value="1">Apple</option>
    <option value="2">Orange</option>
    <option value="3">Cherry</option>
    <option value="4">Banana</option>
  </select>
</form>

What versions do you mean by "older versions of IE"? Maybe those versions don't have the add method on a Select element? Maybe it has that method, but it takes different arguments (like a String instead of an <option> tag? — Greg Burghardt
– Greg Burghardt, Commented Oct 10, 2016 at 17:05
Man, IE5 is Windows 98-era. It's market share was already below 1% at the end of 2006, and there is virtually nobody still using it today, except perhaps nostalgists. I'm interested -- why do you need this? — John Weisz
– John Weisz, Commented Oct 11, 2016 at 6:52
I wish I could have a few words with your teacher, but... eh. Bergi posted a good approach, basically you could use the length property to implement a push yourself, easily. There is also one over here: stackoverflow.com/q/31533963/2788872 — John Weisz
– John Weisz, Commented Oct 11, 2016 at 7:59

Bergi · Accepted Answer · 2016-10-11 02:25:10Z

3

According to https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Array/push#Browser_compatibility, IE does support the push method only as of version 5.5. Try the following instead:

window.onload = function() {
  var sel = document.getElementById('fruits');
  for (var i = 0, iLen = sel.options.length; i < iLen; i++) {
    optStored[i] = sel.options[i];
  }
};

answered Oct 11, 2016 at 2:25

Bergi

671k162 gold badges1k silver badges1.5k bronze badges

Sign up to request clarification or add additional context in comments.

Comments

danwellman · Accepted Answer · 2016-10-07 13:11:33Z

1

If you press F12, does it give any errors in the console? The IE console is nowhere near as good as the Chrome/Firefox developer tools, but it should display any errors.

I'm wondering about passing undefined as the second argument to the add method, according to the docs it should null to append the new option to the end of the list

before is optional and an element of the collection, or an index of type long, representing the item item should be inserted before. If this parameter is null (or the index does not exist), the new element is appended to the end of the collection.

https://developer.mozilla.org/en-US/docs/Web/API/HTMLSelectElement/add

answered Oct 7, 2016 at 13:11

danwellman

9,4018 gold badges65 silver badges92 bronze badges

2 Comments

John Weisz Over a year ago

Wait, IE5 had a developer console?

danwellman Over a year ago

The question has been changed, originally it just said 'old versions of IE' without specifying a particular version. Calling it a 'developer console' is a bit of a stretch, but it almost certainly had a way to at least view errors. There were also plugins for IE that gave some kind of development experience, tools such as Debug Bar [shudders]

Collectives™ on Stack Overflow

Array push not working in IE5 using javascript?

2 Answers 2

Comments

2 Comments

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

Comments

2 Comments

Your Answer

Sign up or log in

Post as a guest

Linked

Related