Динамическое обновление форм в рельсах с помощью javascript

Question

У меня есть форма, которая позволяет пользователю выбрать поставщика (фрилансер), тип требуемых услуг и количество смен, в которые поставщик (фрилансер) будет работать. В зависимости от того, какая услуга выбрана и сколько смен требуется фрилансеру, мне нужно динамически изменять общую сумму запроса.

ОБНОВЛЕНИЕ

В модели службы есть столбец с именем rate, который содержит значение (целое число). В моей форме мне нужно получить значение ставки, чтобы вычислить общую сумму на стороне клиента.

Запрос принадлежит к сервису и сервису has_many запросов.

Это мой код:

Форма:

= f.label :supplier_id
= f.collection_select :supplier_id, Supplier.all, :id, :business_name, {prompt: true}, required: true, class: 'form-control select'
= f.label :service_id
= f.collection_select :service_id, Service.all, :id, :name, {prompt: true}, required: true, class: 'form-control select'
= f.label :shifts
= f.text_field :shifts, required: true, class: 'form-control datepicker'
= f.label :total_amout  
= f.text_field :total_amout, readonly: true, class: 'form-control'

Javascript:

function updateCost() {
    var total_shifts = $('#booking_shifts').val().length;
    var service_rate = $('select#booking_service_id :selected').data('rate')

    var total = service_rate * total_shifts

    $('#booking_total_amount').val(total);
}
$('#booking_shifts').change(function(){ updateCost(); })

В поле общая сумма я получаю NaN

В консоли, когда я делаю:

$('select#booking_service_id :selected').data('rate');

Я получаю Не определено

И когда я пытаюсь:

$('select#booking_service_id :selected').data();

Я получаю {} пустой хеш

Не могли бы вы посоветовать, как я могу получить скорость выбранной услуги и сохранить ее в переменной service_rate для выполнения математических расчетов.

javascript jquery ruby-on-rails

0

Pshemski 9 Янв 2018 в 03:17

Answer 1

Я понял это:

В форме я изменил collection_select на select с помощью options_to_select следующим образом:

= f.select :service_id, options_for_select(@services.map{ |s| [s.name, s.id, {'data-rate'=>s.rate}] }, selected_key = f.object.service_id), {prompt: true}, {class: 'form-control select'}

А затем я смог получить данные, которые искал, с помощью javascript следующим образом:

function updateCost() {
    var total_shifts = $('#booking_shifts').val().length;
    var service_rate = $('select#booking_service_id :selected').data('rate');

    var total = parseInt(service_rate) * total_shifts

    $('#booking_total_amout').val(total);
}
$('#booking_shifts').change(function(){
        updateCost();
});

Надеюсь, это поможет кому-то с подобной проблемой.

0

Pshemski 17 Янв 2018 в 20:02

Answer 2

Итак, проблема в том, как вы выбираете ставку. чтобы получить ставку, предполагая, что ставка - это стоимость опциона. Вам следует использовать следующий запрос

var service_rate = $( "#booking_service_id option:selected" ).text();

Теперь, поскольку это значение является текстом, вам нужно разобрать его на int

var total = parseInt(service_rate) * total_shifts

Итого должно содержать ожидаемое значение.

Надеюсь, это поможет

1

Pshemski 11 Янв 2018 в 12:03

Динамическое обновление форм в рельсах с помощью javascript

2 ответа

Похожие вопросы

Новые вопросы

javascript