Codeigniter AJAX电子邮件验证 [英] Codeigniter AJAX email validation
问题描述
使用CI和email类完成php表单后，我能够接收包含用户数据很好的html电子邮件。现在，除了CI验证之外，我还希望包括具有良好的fadeIn或fadeOut效果的客户端验证（AJAX），并且在关闭javascript的情况下仍可以运行CI验证。
After completing a php form using CI and the email class, i am able to receive html emails with the users data included-great. Now, as well as the CI validation, i would like to include client side validation (AJAX) with a nice fadeIn or fadeOut effect and still have CI validation running in case javascript is turned off.
这里包含的代码是到目前为止我从各种来源获得的成就，我知道这还不完整，但是甚至不确定我是否在正确的轨道上？到目前为止，对于我所拥有的表格，它仍然可以正常运行，并且我认为它仍在运行CI验证脚本，并且没有任何效果。
The code included here is what i have achieved so far from various sources and I know this is not complete but not even sure if I'm on the right track? So far with what I have the form still works fine and I assume it's still running the CI validation script and there are no effects taken place.
如果有人可以引导我到到目前为止我哪里出了问题，并且如果可能的话，应该采取什么下一步措施，我将不胜感激。这是支持我的问题的代码：
I would be gratfeul if someone could guide me to where i have went wrong so far and if possible what next steps to take? Here is the code to support my question:
VIEW
<div id="contact">
<?php
//This is loaded in the view as it wont be used in the other pages
$this->load->helper('form');
echo form_open('contact/send_email');
//success message if passed validation checks
echo $success;
// empty div for error messages (php)
if(validation_errors() != ""){
echo '<h3>Please correct the following errors:</h3>';
echo '<div id="errors">';
echo validation_errors();
echo '</div>';
}
echo form_label('Name: ', 'name');
$data = array (
'name' => 'name',
'id' => 'name',
'value' => set_value('name')
);
echo form_input($data);
echo form_label('Email: ', 'email');
$data = array (
'name' => 'email',
'id' => 'email',
'value' =>set_value('email')
);
echo form_input($data);
echo form_label('Message: ', 'message');
$data = array (
'name' => 'message',
'id' => 'message',
'value' =>set_value('message')
);
echo form_textarea($data);
?>
<br />
<?php
echo form_submit('submit', 'Send');
echo form_close();
?>
----------- AJAX --------- ----------
-----------AJAX-------------------
$(function() {
$('form').click(function() {
// get the form values
var form_data = {
name: $('name').val(),
email: $('email').val(),
message: $('message').val()
};
// send the form data to the controller
$.ajax({
url: "<?php echo site_url('contact/send_email'); ?>",
type: "post",
data: form_data,
success: function(msg)
{
if(msg.validate)
{
$('form').prepend('<p>Message sent!</p>');
$('p').delay(3000).fadeOut(500);
}
else
$('form').prepend('<div id="errors">Message Error</div>');
$('p').delay(3000).fadeOut(500);
}
});
// prevents from refreshing the page
return false;
});
});
</script>
控制器
类联系人扩展CI_Controller {
class Contact extends CI_Controller {
function __construct() {
parent::__construct();
}
public function index()
{
$data['success'] = '';
$data['page_title'] = 'Contact';
$data['content'] = 'contact';
$this->load->view('template', $data);
}
public function send_email (){
$this->load->library('form_validation');
[SET RULES ARE LOCATED HERE]
[ERROR DELIMITERS HERE]
if ($this->form_validation->run() === FALSE) {
$data['success'] = '';
$data['page_title'] = 'Contact';
$data['content'] = 'contact';
$this->load->view('template', $data);
}else{
$data['success'] = 'The email has successfully been sent';
$data['name'] = $this->input->post('name');
$data['email'] = $this->input->post('email');
$data['message'] = $this->input->post('message');
$html_email = $this->load->view('html_email', $data, true);
//load the email class
$this->load->library('email');
$this->email->from(set_value('email'), set_value('name'));
$this->email->to('-----EMAIL----');
$this->email->subject('Message from Website');
$this->email->message($html_email);
$this->email->send();
$data['page_title'] = 'Contact';
$data['content'] = 'contact';
$this->load->view('template', $data);
return null;
}
}
}
推荐答案
让我尝试在该社区中发布我的第一个答案：
1.这是jQuery文件，因此应使用.submit（）方法用于处理表单提交
Let me try to post my first answer in this community:
1. This is jQuery file, so you should use .submit() method for handling form submit
$('form').submit(function() {
但如果要使用点击，则应使用提交按钮将其绑定
but if you want to use click, you should bind it with 'submit' button
$('input[type="submit"]').click(function() {
2。您可以使用.serialize（）方法代替收集数组中的所有表格数据
2. Instead of gather all you form data in array, you can use .serialize() method
data: $('form').serialize(),
3。在你里面控制器，为什么要加载视图？它是Ajax调用，所以常见的方法是根据结果返回JSON响应：
3. In you controller, why you load view? it's Ajax call, so the common method is return JSON response depend on your result:
if ($this->form_validation->run() === TRUE) {
$data['success'] = 'The email has successfully been sent';
$data['name'] = $this->input->post('name');
$data['email'] = $this->input->post('email');
$data['message'] = $this->input->post('message');
$html_email = $this->load->view('html_email', $data, true);
//load the email class
$this->load->library('email');
$this->email->from(set_value('email'), set_value('name'));
$this->email->to('-----EMAIL----');
$this->email->subject('Message from Website');
$this->email->message($html_email);
$this->email->send();
$response->validate = true;
echo json_encode($response);
}
在这种情况下，我消除了FALSE，因为您已经在回调中检查了结果函数：
In this situation, I eliminate the FALSE because you already check your result on callback function:
success: function(msg)
{
if(msg.validate)
{
$('form').prepend('<p>Message sent!</p>');
$('p').delay(3000).fadeOut(500);
}
else
$('form').prepend('<div id="errors">Message Error</div>');
$('p').delay(3000).fadeOut(500);
}
});
尽管这是2012年的问题，但希望对那些偶然发现此问题的人有所帮助。
Although this is 2012 question, hope this help for people who stumble upon to this question.
这篇关于Codeigniter AJAX电子邮件验证的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！
