jQuery - disabling select option depends on value from another div field

Question

I have problem with disabling some value from option field. I try to disable all the values who is less than value from another div field. My code looks like this:

<div id="cur-hour">09</div> <select id="time_to_hour" class="select"> <option value="">---</option> <option value="1">1</option> <option value="2">2</option> <option value="3">3</option> <option value="4">4</option> <option value="5">5</option> <option value="6">6</option> <option value="7">7</option> <option value="8">8</option> <option value="9">9</option> <option value="10">10</option> <option value="11">11</option> <option value="12">12</option> <option value="13">13</option> <option value="14">14</option> <option value="15">15</option> <option value="16">16</option> <option value="17">17</option> <option value="18">18</option> <option value="19">19</option> <option value="20">20</option> <option value="21">21</option> <option value="22">22</option> <option value="23">23</option> </select>

And I have this js code:

$(function(){ if($("#time_from_hour > option").val() < $("#cur-hour").val()) { $('#time_from_hour > option').prop('disabled', true); } });

But it didn't work - here is jsfiddle: http://jsfiddle.net/qhPp7/36/

it looks exactly the same - it can be deleted from test code - DONE — Adrian
– Adrian, Commented Dec 9, 2013 at 9:29
The div element doesn't have a .val(). It has .text() or .html(). — emerson.marini
– emerson.marini, Commented Dec 9, 2013 at 9:36

user2587132 · Accepted Answer · 2013-12-09 09:35:47Z

$(function(){ var n=parseInt($("#cur-hour").html()); $("#time_to_hour option").each(function(){ if(parseInt($(this).val()) < n ) { $(this).prop('disabled', true); } }); });

http://jsfiddle.net/qhPp7/38/

Praveen · Accepted Answer · 2013-12-09 09:38:01Z

Your condition won't work because the value of option tag is a string.

Also val() is not used for divs, so instead use .html() or .text()

Also it has to parsed as integer

Satish Sharma · Accepted Answer · 2013-12-09 09:53:24Z

try this

$(function(){ var options = document.getElementById('time_to_hour').options; var chk = document.getElementById('cur-hour').innerHTML; for(var o=0;o< options.length;o++) { var va = parseInt(options[o].value); if(va!="" && va<chk) { alert(va); options[o].disabled=true; } } });

Nitish Katare · Accepted Answer · 2013-12-09 10:50:35Z

Kindly use span to store the value it makes easier to find it.

09

$(function(){

$('#time_to_hour option').each(function () {

 if (parseInt($("#index").text()) > parseInt($(this).text())) { this.disabled = true; } });

});

I hope above code will work out for you... Here is the working example from your fiddle http://jsfiddle.net/qhPp7/35/

Collectives™ on Stack Overflow

jQuery - disabling select option depends on value from another div field

4 Answers 4

Comments

Comments

Comments

Comments

Hot Network Questions

Collectives™ on Stack Overflow

4 Answers 4

Comments

Comments

Comments

Comments

Related