Выполнение математики на 2 полях в моем модальном всплывающем окне

Question

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

Мне бы хотелось, чтобы в области диалога я тоже поставил стрелку, как бы Я начинаю делать это, пожалуйста? Я уверен, что это действительно легко, и я знаю соответствующий файл php, но я не знаю, как добавить текст в это диалоговое окно.

<div class="col-md-6">
                        <label for="coment"><?php echo esc_html__( 'New Price in ','wprentals').' '.esc_html($wp_estate_currency_symbol);?></label>
                        <input type="text" id="new_custom_price" size="40" name="new_custom_price" class="form-control" value="">
                    </div>

<div class="col-md-6">
                    <label for="period_min_days_booking"><?php echo esc_html__( 'Minimum days of booking','wprentals');?></label>
                    <input type="text" id="period_min_days_booking" size="40" name="period_min_days_booking" class="form-control" value="">
                </div>

Спасибо!

Answer 1

Определите событие для пользовательского ввода и получите значения с помощью jQuery и выполните математическое действие.

$(document).on('keyup', '#new_custom_price', function() {
    var newCustomPrice = Number($('#new_custom_price').val());
    var periodMinDaysBooking = Number($('#period_min_days_booking').val());
    var result = newCustomPrice * periodMinDaysBooking;
    // Do anything with result
    console.log(result)
})