jquery показать/скрыть поле формы на основе значения переменной числа

Я новичок в jquery и пытаюсь показать/скрыть поле параметров в поле выбора ввода на основе сравнения числового значения (из запроса БД). Когда число из запроса БД достигает 50, мне нужно скрыть параметр выбора. Погуглил, поискал и нашел множество вариантов отображения/скрытия, но не смог найти рабочего решения. Это мой последний подход, и он тоже не работает. Любые предложения или возможные направления для изучения будут высоко оценены.

JQuery:

    $(document).ready(function () {
    var myCount = '50';   //will be pulled from a DB query

    $("#date-time2-1").attr("temp", 'myCount');

    if ($("#date-time2-1").val($(this).attr("temp")) > '49') {
    $("#date-time2-1").hide();
    } else {
    $("#date-time2-1").show();

    }

    );

HTML-форма формы:

<h2>Example Registration Form</h2>

    <form id="form1" name="form1" method="post" action="">
      <table width="600" border="0">
        <tr>
          <td><label for="exfname">First Name</label>
          <input class="validate[required]" type="text" name="exfname" id="exfname" />
          <label for="exlname">Last Name</label>
          <input class="validate[required]" type="text" name="exlname" id="exlname" /></td>
        </tr>

        <tr>
          <td>
          <label for="datetime">Date-Session</label>
          <select class="validate[required]" name="datetime" size="1" id="datetime">
          <option value="" selected="selected">Please Select Date/Time</option>
          <option  id="date-time2-1"  value="" >Sept 3,2013 - 8:00AM</option>
          <option id="date-time1-2"  value="">Oct. 5, 2013 - 9:00AM</option>
          <option id="date-time1-1"  value="">Nov. 23, 2013 - 10:00AM</option>
          </select>
          </td>
        </tr>

        <tr>
          <td><p>
            <input  type="submit" name="submit" id="submit" value="Submit" />
            &nbsp;
            <input type="reset" name="Reset" id="Reset" value="Clear Form" />
          </p>
          </td>
        </tr>
      </table>
    </form>

благодарю вас.

Боб П.


person user2640112    schedule 01.08.2013    source источник
comment
Почему вы используете строки 49, 50 вместо чисел 49, 50?   -  person u_mulder    schedule 01.08.2013


Ответы (4)


вам нужно "раскавычить"

$("#date-time2-1").attr("temp", 'myCount');

to

$("#date-time2-1").attr("temp", myCount);

потому что вы хотите передать переменную, а не строку

и лучше разобрать запрос БД как Int как

var myCount = parseInt(numberfromDB);

тогда вы можете обращаться с ним как с реальным целым числом, а также без кавычек

> '49'

to

> 49
person john Smith    schedule 01.08.2013

Несколько вещей не так с кодом, я пройдусь по ним:

$(document).ready(function () {
    var myCount = '50';   //will be pulled from a DB query

    //Right here, myCount shouldn't be quoted, or else your setting the attribute temp to "myCount"
    //$("#date-time2-1").attr("temp", 'myCount');
    $("#date-time2-1").attr("temp", myCount);

    //What is "this" referring to, the DOM ready statement? Simply compare the value like this: 
    //if ($("#date-time2-1").val($(this).attr("temp")) > 49) { //unquoted your number as well, since you're comparing numbers not strings

    //Or if you want to compare the temp value, use .attr("temp")
    if ($("#date-time2-1").val() > '49') {
        $("#date-time2-1").hide();
    } else {
        $("#date-time2-1").show();
    }
);
person tymeJV    schedule 01.08.2013
comment
Всем откликнувшимся. Спасибо. Я удалил кавычки из значений 50 и 49 и myCount, но все равно не работает. - person user2640112; 01.08.2013
comment
Удалено использование $this..., изменена эта строка на: if ($(#date-time2-1).attr(temp) › 49) { ..... но не работает. - person user2640112; 01.08.2013
comment
Аааа? Что случилось @user2640112 - person tymeJV; 01.08.2013
comment
Теперь у меня есть это, но это не работает.......:$(document).ready(function () { var myCount = 50;//будет извлечено из запроса БД time2-1).attr(temp, myCount); if ($(#date-time2-1).attr(temp) › 49) { $(#date-time2-1).hide(); } else { $ (#дата-время2-1).show();} }); - person user2640112; 01.08.2013
comment
@ user2640112 -- Что говорит ваша консоль? - person tymeJV; 01.08.2013
comment
Поместите console.log('test'); в свой оператор if, он когда-нибудь запускается? - person tymeJV; 01.08.2013
comment
Я получил сообщение об ошибке консоли при запуске сценария (не cosole.log). Отметка времени: 01.08.2013, 11:48:18. Ошибка: компонент вернул код ошибки: 0x80004005 (NS_ERROR_FAILURE) [nsIDOMWindow.content] - person user2640112; 01.08.2013
comment
Спасибо за помощь, буду изучать дальше - person user2640112; 01.08.2013
comment
@user2640112 user2640112 -- Кажется, это связано с Firefox, это был ваш браузер при тестировании? - person tymeJV; 01.08.2013

Вы используете числа, а не строки

И myCount это переменная в атрибуте

var myCount = 50;//get ride of the '

$("#date-time2-1").attr("temp", myCount);//get ride of the "

if ($("#date-time2-1").val($(this).attr("temp")) > 49) {//get ride of the '
person kilkadg    schedule 01.08.2013

Что ж, давайте начнем с того, что сделаем ваш код привлекательным:

$(document).ready(function () {
  var myCount = '50';   //carefull with the quotes, if your not sure about the input you can always use intval()

$("#date-time2-1").attr("temp", myCount); // myCount has no quotes or else it wont work, because you dont want a string here
  if ($("#date-time2-1").val($(this).attr("temp")) > '49') { //Again same as above not a fan of the quotes
      $("#date-time2-1").hide();
  } else {
     $("#date-time2-1").show();
  }
}); //Close the document.ready
person JonathanRomer    schedule 01.08.2013