Запрет на отправку формы - PullRequest
0 голосов
/ 27 января 2012

Я пытаюсь запретить отправку формы, если определенная текстовая область не заполнена, используя jQuery. Тем не менее, текстовое поле не нужно заполнять, если данные уже есть в базе данных. Я использую следующий код, но JQuery не кажется правильным.

HTML & PHP:

    <form id="form" action="page1.php" method="post"> 
    <input type="textarea" name="name1" placeholder="<?= empty($val1)? 'Enter your val here': $val1 ?>" /> 
    <p class="submit"> 
         <input type="submit" value="Go!" /> 
    </p>
    </form>
    <div id="log"></div>

Javascript:

    $("#form[input[placeholder='Enter your val here']]").submit(function(event) {
        event.preventDefault();
       $('<div/>')
         .append('please enter the val first')
         .appendTo('#log');
     });   
    };

Ответы [ 3 ]

1 голос
/ 27 января 2012

Ваш селектор кажется немного выключенным, если вы пытаетесь привязать к событию onsubmit формы.Результат вашего селектора теперь, вероятно, ничто, потому что это неверный селектор.Возможно, вы пытались сделать:

$("#form input[placeholder='Enter your val here']")...

Но на самом деле все, что вам нужно, это:

$('#form').submit(function() {
    var name1 = $('input[name="name1"]', this);
    // if database empty and input is empty then prevent form submissions
    if (name1.attr('placeholder') == 'Enter your val here' && name1.val() == '') {
        $('<div/>')
            .append('please enter the val first')
            .appendTo('#log');
        return false;
    }
});

Логика выше такова, что форма НЕ будет отправлена, если:

  • Значение БД было пустым И пользователь ничего не вводил в поле

Во всех остальных случаях форма будет отправлена, поскольку:

  • Либо местозаполнитель не равен «Введите здесь ваш», либо
  • пользователь набрал что-то в текстовой области для сохранения.
1 голос
/ 27 января 2012

Поместите класс в текстовое поле, чтобы вы знали, нужно ли его заполнять или нет:

<form id="form" action="page1.php" method="post"> 
<input type="textarea" name="name1" class="<?= empty($val1)? 'Required': 'Optional' ?>" placeholder="<?= empty($val1)? 'Enter your val here': $val1 ?>" /> 
<p class="submit"> 
     <input type="submit" value="Go!" /> 
</p>
</form>
<div id="log"></div>

И проверьте, является ли поле пустым и обязательным:

$("#form").submit(function(event) {
    var $textarea = $('#form input');
    if ($textarea.val().trim().length == 0 && $textarea.hasClass('Required')) {
        event.preventDefault();
        $('#log')
            .append('please enter the val first')
            .appendTo('#log')
            ;
        return false;
    } else {
        return true;
    }
});   

(Прошу прощения за любые синтаксические ошибки ... Это просто для общего понимания.)

Кроме того, рассмотрите возможность отключения кнопки отправки и отображения сообщения все время, пока форма не станет действительной и не будет готова для отправки. Это было бы более удобным для пользователя, на мой взгляд.

0 голосов
/ 27 января 2012

Просто return false; всякий раз, когда вы не хотите отправлять

...