6

I cannot set the list property of an <input> element. sel.list = id is not working in my code.

var sel = document.createElement("input");
sel.type = "text";
sel.id = "inputSelectName";
sel.list = "inputNamesList"; // Does not work.
//sel.setAttribute("list", "inputNamesList"); // Works
sel.name = "name"; // FIXME: We should reconsider the name name...
frm.appendChild(sel);

var datl = document.createElement("datalist");
datl.id = "inputNamesList";
// Populating the dataList
frm.appendChild(datl);

Of course, this doesn't work because the list attribute is not the list = {id for datalist} that I want. The only way to make this work is with the setAttribute method.

How can I solve this without using the setter, but by changing the attribute directly?

When I look in the developer tools, I see that setAttribute("list", id) is not setting the list attribute.

mfluehr
  • 2,832
  • 2
  • 23
  • 31
  • 1
    @DavidThomas, [the list attribute](http://www.w3.org/html/wg/drafts/html/master/single-page.html#attr-input-list). – zzzzBov Mar 19 '13 at 22:02
  • @zzzzBov: indeed: [`input`](https://developer.mozilla.org/en-US/docs/HTML/Element/Input). – David Thomas Mar 19 '13 at 22:02
  • 2
    Why do you want to solve it without setter? What's wrong with `setAttribute` ? – inser Mar 19 '13 at 22:11
  • whoa, edit your question no one can understand what you just posted as a comment... – Ryan Mar 19 '13 at 22:13
  • 1
    Ok. You can not change it directly for now. It is element interface: http://www.w3.org/TR/dom/#element – inser Mar 19 '13 at 22:17
  • One can set the list attribute. But sel.list seems to be something different in my code. By using setAttribute list = null and setAttribute changes the outerHTML. –  Mar 19 '13 at 22:23
  • 2
    @JorisSpekreijse—yes, there is a distinct difference between a DOM property and an HTML attribute. Some properties and attributes always reflect each other, some don't, and there are differences between browsers. – RobG Mar 19 '13 at 23:45

0 Answers0