Jquery: получить значение для проверки max - min при изменении от входов добавления - PullRequest
0 голосов
/ 27 апреля 2020

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

Вся моя система работает, я могу добавить больше входных данных с помощью функции добавления, например:

$(add_button).click(function(e){
        e.preventDefault();
        if(x < max_fields){
            x++;
            $(wrapper).append('<div class="tier' + x + '" id="tier'+x+'"><table><tbody> <tr><th class="center">Tier ' + x + '</th><th class="thBorder center"> Range </th><td class="tdBorder td20"><input type="number" class="center min'+x+'" name="min[]" id="min'+x+'" value="0"><label for="min"> Min </label></td><td class="tdBorder td20"><input type="number" class="center max'+x+'" id="max'+x+'" name="max[]"><label for="max"> Max </label></td><th class="thBorder center">   Percentage   </th><td class="tdBorder_right centered"><input type="number" class="center Percentage'+x+'" name="Percentage[]" id="Percentage'+x+'"><label for="Percentage"> % </label></td></tr></tbody></table></div>'); //add input box
        }
        else
        {
            alert('You reached the tier limits')
        }
    });

На моем бэкэнде я получаю массив с информацией и могу добавить в свою базу данных, но я хочу проверить входы в режиме реального времени следующим образом:

Уровни: Входы: Мин. - Макс. - Процент.

На первом уровне значение Мин по умолчанию равно 0, они могут выбрать любое максимальное значение, но на следующем уровне минимальное значение должно быть максимальным значением последнего (возможно, если они пишут другое значение, они получают предупреждение. «Минимальное значение отличается от максимального значения последнего уровня, необходимо быть таким же ", idk).

Пример: Уровень 1: Мин - 0 | Макс - 20 | Процент: 5% Уровень 2: Мин - 20 | Макс - 40 | Процент: 7% Уровень 3: Мин - 40 | Макс - 70 | Процент: 9%

Единственное решение, которое у меня есть, проверяет значения после их записи с помощью кнопки проверки:

$("button#check").click(function(){
        $( "div.tiers input" ).each(function( index ) {

            console.log($( this ).val() );
        });
    });

И это мой div с уровнями:

<div class="tiers">
                        <div>
                            <table>
                                <tbody>
                                <tr>
                                    <th class=" center"> Tier 1 </th>
                                    <th class="thBorder center"> Range </th>
                                    <td class="tdBorder td20">
                                        <input type="number" class="center min" name="min[]" id="min" max="0" min="0" value="0">
                                        <label for="min"> Min </label>
                                    </td>
                                    <td class="tdBorder td20">
                                        <input type="number" class="center" name="max[]" id="max"  min="0" value="0">
                                        <label for="max"> Max </label>
                                    </td>
                                    <th class="thBorder center">   Percentage   </th>
                                    <td class="tdBorder_right centered">
                                        <input type="number" class="center" name="Percentage[]" id="Percentage" max="" min="" step="0.01" placeholder="%" value="0">
                                        <label for="Percentage"> % </label>
                                    </td>
                                </tr>
                                </tbody>
                            </table>
                        </div>
                    </div>

Может ли кто-нибудь помочь мне, пожалуйста?

Заранее спасибо, Привет.

...