Проверить форму перед отправкой на php

Привет, я внедряю страницу входа, все отлично работает со стороны PHP, но теперь я бы выполнил еще одну функцию с помощью jQuery: я хотел бы проверить, являются ли поля логина пустыми и если не печатать что-то на странице, в противном случае продолжить с php, как это сделать?

Вот часть моего HTML-кода:

<form id="loginForm" action="login-exec.php" name="loginForm" method="post" class="ui-body ui-body-a ui-corner-all" data-ajax="false"> <fieldset> <div data-role="fieldcontain"> <label class="ui-input-text" for="login">Login:</label> <input name="login" type="text" class="textfield" id="login" /> </div> <div data-role="fieldcontain"> <label class="ui-input-text" for="password">Password:</label> <input name="password" type="password" class="textfield" id="password"/> </div> <input type="submit" name="Submit" value="Login" /> </fieldset> </form> 

Привязать событие к представлению формы (Примечание: НЕ щелчок кнопки отправки). Вот где идет ваш код, который проверяет форму и, при необходимости, останавливает ее отправку.

 $('#loginForm').on('submit', function(e){ if ($('#login').val()=='' || $('#password').val()==''){ e.preventDefault(); // alert('Fill in both fields'); // You can use an alert or a dialog, but I'd go for a message on the page $('#errormsg').text('Fill in both fields').show(); }else{ // do nothing and let the form post } }); 

Если вы предпочитаете показывать сообщение, чем использовать диалог, где-то на странице, предпочтительно рядом с кнопкой «Отправить», добавьте errormsg div

 <p id="errormsg" style="display:none;"></p>