Вычисление полей в jquery на основе выбора в раскрывающемся списке

Я пытаюсь сделать небольшое приложение для отслеживания ставок на Ruby, и у меня есть небольшая форма, в которую я ввожу все виды данных (дата, матч и т. д.). Наиболее важной частью формы являются два текстовых поля «ставка» и «нечет». Я придумал простой код jQuery, который вычисляет «потенциальную выплату» сразу после ввода ставки и нечетных данных, и это выглядит так:

$(function() {
  $("#stake, #odd").keyup(function() {
    var p = $("#stake").val();
    var q = $("#odd").val();

    $("#potential_payout").val(q * p);
  });
});

Теперь я хотел бы добавить раскрывающийся список, в котором я могу выбрать, была ли ставка успешной, выбрав «Да» или «Нет», и в то же время, если ставка была выиграна, сделать еще один расчет для:

прибыль = (потенциальная_выплата - ставка), которая также будет рассчитываться в реальном времени в текстовом поле #профит.

Я искал решение, но не нашел ничего похожего на мою проблему (но, вероятно, это просто). Я искал, как установить некоторые глобальные переменные, но не мог понять, так как я полный нуб во всем этом javascript, jquery, ajax.... Если нужно, я могу опубликовать из html, но я думаю, что это довольно просто .

Буду признателен за любой совет.


person Bor Glavic    schedule 11.06.2015    source источник
comment
Используйте .change в раскрывающемся списке, поскольку вы используете .keyup. Код аналогичен тому, что вы уже сделали.   -  person Lelio Faieta    schedule 11.06.2015
comment
Я использовал .change и даже попробовал еще раз с кодом, который Гэри разместил ниже, но, похоже, он не работает.   -  person Bor Glavic    schedule 14.06.2015


Ответы (2)


У вас уже есть большая часть кода. Осталось произвести расчеты. Я также пошел дальше и кэшировал селекторы.

$(function() {

  var $stake = $('#stake');
      $odd = $('#odd'),
      $won = $('#won'),
      $payout = $('#potential_payout'),
      $profit = $('#profit');

  $stake.on('keyup', calculate);
  $odd.on('keyup', calculate);
  $won.on('change', calculate);

  function calculate() {
    var stake = $stake.val(),
       odd = $odd.val(),
       won = $won.val();
    $payout.val( stake * odd);
    if (won.toLowerCase() === "yes") {
      $profit.val( (stake*odd) - stake );
    }
  } 
});
person Gary Storey    schedule 11.06.2015
comment
Привет Гэри, спасибо за ваш вклад. Но каким-то образом поле прибыли не меняется, когда я выбираю «Да» в раскрывающемся списке. Я не уверен, что это как-то связано с выпадающим кодом, но это не должно - person Bor Glavic; 14.06.2015
comment
Я проверил код в консоли firebug, и проблема выглядит так: TypeError: won is undefined if (won.toLowerCase() === yes) { - person Bor Glavic; 14.06.2015

Сегодня я поиграл и отредактировал рубиновый код для раскрывающегося списка на

<%= f.select :win, [['Yes','yes'],['No','no']], {include_blank: true, :onchange => "calculate()"}, :id =>"won" %>

из

<%= f.select :win, [['Yes','yes'],['No','no']], include_blank: true, :id =>"won" %>

и теперь это работает. Спасибо за вашу помощь!

person Bor Glavic    schedule 15.06.2015