Javascript-форум - Проверка обязательных полей в форме

Добрый день.
Есть такая форма:

<form>
      <div class="modal-header">
        <button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">&times;</span></button>
      </div>
      <div class="modal-body"> 
            <input type="text" class="form-control" id="email" placeholder="Email" required="required" />
            <input type="text" class="form-control" id="phone" placeholder="Телефон" required="required" />
            <textarea class="form-control" id="text" cols="30" rows="10" placeholder="Сообщение"></textarea>
      </div>
      <div class="modal-footer">
        <button type="button" class="btn btn-default" data-dismiss="modal">Отмена</button>
        <button type="button" class="btn btn-primary" id="btn-send">Отправить письмо</button>
      </div>
    </form>

Такой скрипт:

$(document).ready(function(){   
    $('#btn-send').click(function () {
        var email = $('#email').val();
        var phone = $('#phone').val();
        var text = $('#text').val();
        $.ajax({
            type: "POST", //метод передачи данных
            url: 'page.php', //обработчик php
            data: {email: email, phone:phone, text:text},//передаваемые данные
            success: function(data) { //получение результата
                var old = $('.modal-header').html();//получаем содержимое div
                $('.modal-header').html(old + data); //добавляем сообщение об отправке
                }
            });
    });
});

И обработчик:

//получаем данные пришедшие post
$email=$_POST[email];
$phone=$_POST[phone];
$text=$_POST[text];
$mess='E-mail: '.$email.'; <br>Номер телефона: '.$phone.' Текст сообщения: '.$text;//сообщение
$headers  = "Content-type: text/html; charset=utf-8 \r\n";//кодировка 
$headers .= "From: admin@admin.ru";//откуда отправлено письмо
//отправляем email админу
if(mail('admin@admin.ru', 'Форма обратной связи', $mess, $headers)){
echo '<div class="alert alert-success alert-dismissible" role="alert">
    <button type="button" class="close" data-dismiss="alert" aria-label="Close"><span aria-hidden="true">&times;</span></button>
    Сообщение успешно отправлено!
    </div>';
}else{
    echo '<div class="alert alert-danger alert-dismissible" role="alert">
    <button type="button" class="close" data-dismiss="alert" aria-label="Close"><span aria-hidden="true">&times;</span></button>
    <strong>Ошибка !</strong> Сообщение не отправлено!
    </div>';
}

Письма приходят. Но не работает required в полях, даже если ни одно поле не заполнено, письмо отправляется.
Подскажите, как в этой форме добавить проверку на заполненность нужный полей?