Для обратного звонка можно воспользоваться библиотекой fancybox, которая позволяет создавать модальные окна. В модальном окне будет располагаться форма обратной связи.
В просторах интернета масса всяких скриптов, я лишь предложу вариант которым всегда пользуюсь.
И так, для кнопки по нажатию будет всплывать окно, для этого просто присвоим произвольный класс, который будем использовать в скрипте:
<a class="buttons-click buttons-click-form" href="#mess">Отправить сообщение</a>
Создадим тут же форму
<div id="mess" class="call-form formMess">
<div class="title">Отправить письмо</div>
<div class="content">
<input type="text" name="name" placeholder="Ваше имя" />
<span class="error error_name"></span>
<input type="text" name="email" placeholder="Ваше email" />
<span class="error error_email"></span>
<input type="text" name="phone" placeholder="Ваш номер" />
<span class="error error_phone"></span>
<textarea name="mess" placeholder="Текст сообщения"></textarea>
<span class="error error_mess"></span>
<button class="buttons buttons-click-form">Отправить</button>
</div>
</div>
Напишем функцию js для вызова всплывающего окна с помощью библиотеки fancybox:
$('.buttons-click').click(function(){
$tag=$(this).attr('href');
$.fancybox($tag);
return false;
})
Для того чтобы собрать данные с формы, потребуется функция
$('.buttons-click-form').click(function(){
$('.formMess span').html(null)
$.ajax({
url: 'index.php?route=information/form/mess',
type: 'post',
dataType: 'json',
data: 'name='+$('input[name=name]').val()+'&phone='+$('input[name=phone]').val()+'&email='+$('input[name=email]').val()+'&mess='+$('textarea[name=mess]').val(),
success: function(m){
if(m.error){
$.each(m.error,function(i,e){
$('.error_'+e.name).html(e.text)
})
}
else{
$('.formMess .title').html('Ваше сообщение отправлено!')
$('.formMess .content').remove();
setTimeout(function(){
$.fancybox.close();
},3000);
}
}
})
})
Отправив данные на сервер, добавим в контролер form функцию, которая обработает данные, и возвратит код ошибки, если будет не верное заполненное поле (без перезагрузки страницы)
public function mess(){
$this->load->model('catalog/information');
if (($this->request->server['REQUEST_METHOD'] == 'POST') && $this->validateMess()) {
$mail = new Mail();
$mail->protocol = $this->config->get('config_mail_protocol');
$mail->parameter = $this->config->get('config_mail_parameter');
$mail->smtp_hostname = $this->config->get('config_mail_smtp_host');
$mail->smtp_username = $this->config->get('config_mail_smtp_username');
$mail->smtp_password = html_entity_decode($this->config->get('config_mail_smtp_password'), ENT_QUOTES, 'UTF-8');
$mail->smtp_port = $this->config->get('config_mail_smtp_port');
$mail->smtp_timeout = $this->config->get('config_mail_smtp_timeout');
$mode=$this->model_catalog_information->voiteMail('VOITE_MESS',$this->request->post);
$mail->setTo($this->config->get('config_email'));
if(!empty($this->request->post['email'])){
$mail->setFrom($this->request->post['email']);
}
else{
$mail->setFrom($this->config->get('config_email'));
}
$mail->setSender($this->request->post['name']);
$mail->setSubject(sprintf($this->language->get('email_subject'), $this->request->post['name']));
$mail->setHtml($mode);
$mail->send();
$this->response->addHeader('Content-Type: application/json');
$this->response->setOutput(json_encode($json['success']=true));
}
else{
$json['error']=$this->error;
$this->response->addHeader('Content-Type: application/json');
$this->response->setOutput(json_encode($json));
}
}
Вот и вся функция обратного звонка, Вы спросите, что это за функция?
$this->model_catalog_information->voiteMail()