Проверка javascript на кнопку отправки

Question

Хотите использовать проверку javascript для работы, когда я нажму кнопку «Отправить». Что происходит сейчас, даже если я введу небольшое значение, которое представляет значение. но мне нужно, чтобы проверить проверки, прежде чем я нажмите на кнопку отправить ...

Это Javascript:

$(function() { 
    $("#newMonoReading").on('focusout', function() { 
     var str = ""; 

     var initialMonoReading = $('#InitialMonoReading').val(); 
     var newMonoReading = $('#newMonoReading').val() 
     if (~~newMonoReading < ~~initialMonoReading) { 
      $('#MonoErrorMessage').text("New Mono Readings must be MORE than existing"); 
      $('#MonoErrorMessage').show(); 
     } else { 
      $('#MonoErrorMessage').hide(); 
     } 
    }); 
}); 

Теперь на моей форме, вы можете увидеть тип входа (Submit)

<div class="modal-footer"> 
<input type="submit" value="Submit New Readings" class="btn btn-primary"> 

<button type="button" class="btn btn-default" data-dismiss="modal">Cancel</button> 
</div> 
</fieldset> 
</form> 

Как получить функцию JavaScript для кнопки отправки, поэтому, когда я вхожу в submit, она не работает, потому что я ввел небольшое значение.

Answer 1

function validateForm() { 
    var str = ""; 

    var initialMonoReading = $('#InitialMonoReading').val(); 
    var newMonoReading = $('#newMonoReading').val(); 
    if (~~newMonoReading < ~~initialMonoReading) { 
     $('#MonoErrorMessage').text("New Mono Readings must be MORE than existing"); 
     $('#MonoErrorMessage').show(); 
     return false; 
    } else { 
     $('#MonoErrorMessage').hide(); 
    } 
} 

Этот пример ясно вещи FIDDLE

<form onsubmit="return validateForm()" method="post"> 
    <div class="modal-footer"> 
    <input type="submit" value="Submit New Readings" class="btn btn-primary"> 

    <button type="button" class="btn btn-default" data-dismiss="modal">Cancel</button> 
    </div> 
    </fieldset> 
    </form> 

Answer 2

Вы действительно не хотите, чтобы валидация на кнопке submit, так как есть другие способы отправки формы. Вы действительно хотите, чтобы валидация обработчика onsubmit формы.

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

До этой линии:

$("#newMonoReading").on('focusout', function() { 

Добавьте эту строку:

alert($("#newMonoReading").length); 

Там есть хороший шанс, что вы пытаетесь запустить этот код до того, как DOM была оказана. Если это возвращает 0, у вас есть три варианта:

• делегация Используйте событие (избыточно в данном случае)
• Перенести код внутри блок $(function() {...});
• нагрузки скриптов в нижней части страницы.

Answer 3

Изменить кнопку представить кнопку Таким образом, вы будете иметь полный контроль над представить. Вы можете выполнить собственную логику в функции validate() и решить, следует ли разрешить форма представить или не

<input type="button" onclick="validate()" value="Submit New Readings" class="btn btn-primary"> 

и ваша функция Validate будет

function validate() { 
    var initialMonoReading = $('#InitialMonoReading').val(); 
    var newMonoReading = $('#newMonoReading').val() 
    if (~~newMonoReading < ~~initialMonoReading) 
    { 
    alert("Value is not valid"); 
    return; 
    } 
    ///else submit 
    $("yourform").submit(); 
});