Dynamically change input id with value - input type=range

Question

I'm making a phone gap query mobile iOS app for course evaluation at my uni. This app primary function will be a form that in it's original form uses radio buttons where each value also has a corresponding id - e.g.

<input name="q10" id="1" value="1" type="radio" />
<input name="q10" id="2" value="2" type="radio" />
<input name="q10" id="3" value="3" type="radio" />
<input name="q10" id="4" value="4" type="radio" />
<input name="q10" id="5" value="5" type="radio" />
<input name="q10" id="6" value="6" type="radio" />

But radio buttions aren't that intuitive on iOS devices so I'm using input type range instead. This works great for changing the value between 1 and 6 but the problem is that one only specifies one id for the whole input, not one id per value.

<input type="range" name="q10" id="q10" value="0" min="0" max="6"  />

Is there a way to change the id with the value? I think this should be doable through JavaScript but I lack the know-how. I also cannot change the way the database is set up (requiring both id and value) as this database belongs to the university's IT-department.

Manse · Accepted Answer · 2012-01-06 10:30:00Z

1

You can use the change event

<input type="range" onchange="this.id=this.value" name="q10" id="q10" value="0" min="0" max="6" />

Working example here - http://jsfiddle.net/aVHm8/

Note: I always feel uneasy about changing the ID of a DOM element .. perhaps you should investigate better options to resolve your issue

answered Jan 6, 2012 at 10:30

Manse

38.1k11 gold badges88 silver badges112 bronze badges

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

Comments

Quentin · Accepted Answer · 2012-01-06 10:28:50Z

0

The database can't know what the id is unless you use JavaScript to send it to the server (standard form submission sends the name and the value). In which case find the bit of JS that pulls out the ID and just send the value twice instead.

answered Jan 6, 2012 at 10:28

Quentin

949k136 gold badges1.3k silver badges1.4k bronze badges

Collectives™ on Stack Overflow

Dynamically change input id with value - input type=range

2 Answers 2

Comments

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Related