Установить значение поля ввода на основе выбранной опции - PullRequest
Новая
       0

Установить значение поля ввода на основе выбранной опции

0 голосов
/ 01 сентября 2011

Я создаю форму бронирования для группы отелей. У каждого отеля есть страница специального предложения, доступ к которой можно получить, добавив параметр &ratePlanID=xxx в URL запроса.

Как динамически добавить ratePLanID, когда пользователь выбирает отель из раскрывающегося списка?

Я пытался написать функцию, которая устанавливает значение поля ввода с правильным значением ratePlanID, когда пользователь выбирает отель, но я не могу заставить его работать.

Вот что я придумал: http://jsbin.com/oduhet/3/edit#javascript,html,live

Есть идеи, что я здесь не так сделал или другой способ сделать это?

Ответы [ 4 ]

0 голосов
/ 01 сентября 2011

Несколько вещей.Я использую гораздо более новую версию JQuery, так как я не уверен, что v1.0 отсутствует.

Я добавляю слушателя в список выбора, используя jQuery ПОСЛЕ ТОЧКИ ДОМА, готовой для манипулирования.Это делается путем добавления слушателя к «документу», ожидающему события «готово», который при срабатывании выполнит функцию, переданную слушателю.Я также дал полю ввода идентификатор ratePlanInput, чтобы я мог ссылаться на него в JavaScript. 

<!DOCTYPE html><html><head>
<script class="jsbin" src="http://ajax.aspnetcdn.com/ajax/jQuery/jquery-1.6.min.js"></script>
<script type="text/javascript">
  $(document).ready(function() {    // add listener for document ready
    $('#destination').change(function() {     //add a listener for change
      var selectedValue = $(this).find(":selected").val();
      $('#ratePlanInput').val(selectedValue);
    });

  });


</script>

</head><body>


<form action="http://www.example.com" method="get">

  <select name="hotelID" id="destination">
    <option value="" class="first_option" selected="selected" disabled="disabled">Select a property:</option> 
    <option value="15205">City Hotel</option> 
    <option value="15206">Beach Hotel</option>
    <option value="15207">Business Hotel</option> 
  </select>

  <input type="text" name="ratePlanID" value="" id="ratePlanInput" />           

  <button type="submit">Check availability</button>     

</form>  


</body></html>
0 голосов
/ 01 сентября 2011

Я думаю, что проблема в вашем case утверждении, что вы должны искать строковые значения (значения - это строки, а не целые числа).

Как: 

switch(hotel)
    {
      case '15205': 
        $('[name=ratePlanID]').val(1);
        break;
      case '15206': 
        $('[name=ratePlanID]').val(2);
        break;
          case '15207': 
        $('[name=ratePlanID]').val(3);
        break;
    }
0 голосов
/ 01 сентября 2011

Ваше утверждение "case" должно искать "строки", а не "целые".Положите '' вокруг каждого случая.

0 голосов
/ 01 сентября 2011 
$(document).ready(function() {
  $('#destination').change(function() {
    var hotel = $('#destination').val();
   $('[name=ratePlanID]').val(hotel);
  });
});

замените это в своем коде JavaScript

А для корпуса переключателя 

$(document).ready(function() {
  $('#destination').change(function() {
    var hotel = $('#destination').val();
   switch(hotel)
{
  case '15205': 
    $('[name=ratePlanID]').val('1');
    break;
  case '15206': 
    $('[name=ratePlanID]').val('2');
    break;
      case '15207': 
    $('[name=ratePlanID]').val('3');
    break;
}

  });
});
Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.

Нет похожих вопросов

...