Делаем форму:
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 | <form id="regForm" name="regForm" action="" method="post"> <h2>Форма обратной связи</h2> <table cellpadding="0" cellspacing="15" class="feedback"> <tr> <td> <p> Ваше имя:<br /> <div class="message" id="err_name"></div> <input name="name" id="name" size="40" maxlength="40" class="input" type="text"> </p> <p> Ваш e-mail:<br /> <div class="message" id="err_email"></div> <input name="email" id="email" size="40" maxlength="40" class="input" type="text"> </p> <p> <strong>ЗДЕСЬ CAPTCHA</strong> </p> </td> <td> <p> Ваше сообщение:<br /> <div class="message" id="err_text_message"></div> <textarea name="text_message" id="text_message" cols="40" rows="6" class="input"></textarea> </p> </td> </tr> <tr> <td colspan="2" style="text-align:center;"> <input name="mail_submit" type="submit" onclick="SendForm('regForm','name,email,text_message','sendemail.php');return false" value="Отправить сообщение"> </td> </tr> </table> </form> |
обработотчик нажатия кнопки отправить:
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 | function SendForm(formid,fieldnames,action){ var count = -1; //проверяем заполненность нужных полей var field = fieldnames.split(','); for(var i=0;i<=field.length;i++){ if($('#'+field[i]).val()==''){//если поле пустое, выделяем его count++; $('#'+field[i]).css({backgroundColor: "#FFCECE",border: "1px solid #BB0000"}); if(count==0)$('#'+field[i]).focus();//ставим курсор в первое незаполенное поле //выводим сообщение $('#err_'+field[i]).hide(); $('#err_'+field[i]).html('заполните поле'); $('#err_'+field[i]).fadeIn('slow'); }else{//если поле заполено, отменяем выделение $('#'+field[i]).css({backgroundColor: "#fff",border: "1px solid #888"}); $('#err_'+field[i]).empty(); } } //если все поля заполены, отправвляем обработчику if(count==-1){ var dataString = $('#'+formid).serialize();//собираем все данные в строку $.ajax({ type: "POST", url: action, data: dataString, success: function(data){ //если в ответе содержится символ '/', выводим сообщение об ошибке заполнениия if(data.indexOf('/')>-1){ field = data.split('/');//отделяем сообщение от id (name) поля $('#'+field[1]).css({backgroundColor: "#FFCECE",border: "1px solid #BB0000"}); if(count==0)$('#'+field[1]).focus(); $('#err_'+field[1]).hide(); $('#err_'+field[1]).html(field[0]); $('#err_'+field[1]).fadeIn('slow'); }else{ //если форма отправлена успешно выводим alert с текстом сообщения alert(data); $('#'+formid)[0].reset(); //сбрасываем значения формы } } }); } } |
ну и сам отбработчик запощеных данных sendemail.php:
1 2 3 4 5 6 | if(!preg_match("|^[-0-9a-z_]+@[-0-9a-z_]+\.[a-z]{2,6}$|i", $_POST['email'])) { echo"Указан некорректный e-mail/email"; exit(); } //дальше заносим данные в базу или т.п. echo "Спасибо! Вашe сообщение отправленно."; |