Блог

Главная - Вопросы по программированию - Сделать действие для 3 кнопок в одной форме

Сделать действие для 3 кнопок в одной форме

#php #laravel

#php #laravel

Вопрос:

У меня проблема с формой ввода с 3 кнопками.

У меня есть кнопка 3:

approved | rejected | deleted

Затем моя форма в модальной начальной загрузке, с формой, подобной этой:

 <form action="" method="POST">
{{csrf_field()}}
    <div class="input-item input-with-label">
        <label class="input-item-label">Admin Note</label>
        <textarea name="notes" class="input-bordered input-textarea input-textarea-sm"></textarea>
    </div>
    <br>
    <div class="text-center">
        <ul class="btn-grp guttar-20px list-unstyled">
            <li><button name="status" value="Approved" class="form-progress-btn btn btn-success btn-md text-uppercase">Approve</button></li>
            <li><button name="status" value="Warning" class="form-progress-btn btn btn-grey btn-md text-uppercase">Missing</button></li>
            <li><button name="status" value="Rejected" class="form-progress-btn btn btn-danger btn-md text-uppercase">Reject</button></li>
        </ul>
    </div>
</form>

И у меня есть такой контроллер:

 switch($request->status) {
    case 'Approved': 
    break;
    case 'Rejected': 
    break;
    case 'Warning': 
    break;
}

Но это не работает. Итак, как мне создать несколько кнопок в одной форме для обновления действия?

Комментарии:

1. Вы не можете иметь то же name самое для своих кнопок. Это то, что отправляется, поэтому они должны быть уникальными.

2. Тогда что, если я использую другое name для создания $request на контроллере?

3. Кроме того, я уверен, что ваша форма даже не должна отправляться. Обычный button не выполняет это действие. Вам нужно указать type="submit" . Для дальнейшего использования: просто сказать, что что-то не работает, слишком расплывчато. Всегда указывайте, каким образом это не работает.

4. Ах да, я забыл type="submit" , потому что я использую форму с ajax. Итак, как мне решить мою проблему, чтобы использовать эти три кнопки? Я пробовал менять на type и разные name , но это все равно не работает.

5. Если это форма AJAX, то покажите и AJAX, чтобы мы знали, каким способом вы отправляете данные. Таким образом, мы должны угадать.

Ответ №1:

Измените свой код следующим образом

 <form action="" method="POST">
{{csrf_field()}}
<div class="input-item input-with-label">
    <label class="input-item-label">Admin Note</label>
    <textarea name="notes" class="input-bordered input-textarea input-textarea-sm"></textarea>
</div>
<br>
<div class="text-center">
    <ul class="btn-grp guttar-20px list-unstyled">
        <li><button name="status" data-status="approved" id"approved" value="Approved" class="form-progress-btn btn btn-success btn-md text-uppercase">Approve</button></li>
        <li><button name="status" data-status="warning" id="warning" value="Warning" class="form-progress-btn btn btn-grey btn-md text-uppercase">Missing</button></li>
        <li><button name="status" data-status="rejected" id="rejected" value="Rejected" class="form-progress-btn btn btn-danger btn-md text-uppercase">Reject</button></li>
    </ul>
</div>

и напишите код jquery

 $("#approved, #rejected, #warning").on("click", function(ev){
    ev.preventDefault();
    const status = $(this).data("status");
    callFunctionForAjax(status)
});

function callFunctionForAjax(status){
    // your ajax logic here
    console.log(status);
}

Комментарии:

1. Итак, вызовите значение $(this).data('status') таким образом?

2. да, он вернет значение состояния данных нажатой кнопки

3. Полезно ли это для вас?

4. @RokoC. Булян, ты прав, сейчас я его обновил. Спасибо за ваше предложение

5. Приведенное выше (хотя я исправил некоторые опечатки) все еще не является идеальным ответом. Вам не нужен щелчок — вы не должны полагаться на нажатие кнопки, чтобы предотвратить отправку формы по умолчанию, и вместо этого использовать AJAX. Форма может быть отправлена даже без нажатия кнопки, вы также можете нажать enter, сосредоточившись внутри <input> помните? 😉 Вместо этого обработчик должен быть в "submit" событии формы. Но это уже другая история.