表单验证不改变CI结构加入AJAX效果

zhengfeity

思路就是输入框失去焦点 提交表单数据 返回form_error 此输入框的错误信息 下方这段可写入HELPER 变成通用类效果图

代码段 jquery 段

JS复制代码

<script language="javascript" src="<?php echo base_url();?>js/jquery.js"></script>
<script language="javascript">
$(document).ready(function(){
        $('input,textarea').live("blur",function(){
                var ajax_id = $(this).attr('name');  // 获取文本框的名称
                var arg = {};
                var arg1 = ajax_id;
                var value1 = $(this).val();
                arg[arg1] = value1;  //提交POST
                $.post("/" + ajax_id,arg,
                function(data,status){
                        if(data == "")
                        {
                                //$("#" + ajax_id).parent().find('span').css('color','green');  //显示错误信息
                                $("#" + ajax_id).parent().find('span').text(" * ");            
                        }      
                        else
                        {
                                //$("#" + ajax_id).find('span').css('color','red');
                                $("#" + ajax_id).parent().find('span').text(' * ' + data);
                        }
                });
    });
});
</script>

复制代码

HTML view视图 代码段

HTML复制代码

 
 <?php echo form_open('/',array('id'=>'form'));?>
 
      <table width="100%" border="0" cellspacing="0" cellpadding="0" class="tab">
        <tr>
    <td colspan="3">如您对我们的产品和服务有技术方面的疑问，我们对您反 映的有关问题，并尽力给您提供必要的帮助。</td>
    </tr>
  <tr>
    <td width="13%">您的姓名：</td>
    <td width="74%"><input type="text" name="name" id="name" class="input_shuru" />
      <span class="red"> * <?php echo form_error('name')?></span></td>
    <td width="13%">&nbsp;</td>
  </tr>
  <tr>
    <td>留言主题：</td>
    <td><input type="text" name="title" id="title" class="input_shuru2" />
      <span class="red"> * <?php echo form_error('title')?></span></td>
    <td>&nbsp;</td>
  </tr>
  <tr>
    <td>电子邮件：</td>
    <td><input type="text" name="email" id="email" class="input_shuru" />
      <span class="red"> * <?php echo form_error('email')?></span></td>
    <td>&nbsp;</td>
  </tr>
    <tr>
    <td>移动电话：</td>
    <td><input type="text" name="telphone" id="telphone" class="input_shuru" />      <span class="red"> * <?php echo form_error('telphone')?></span></td>
    <td>&nbsp;</td>
  </tr>
  <tr>
    <td>反馈内容：</td>
    <td><textarea name="content" cols="" rows="" class="text" id="content"></textarea>
      <span class="red"> * <?php echo form_error('content')?></span></td>
    <td>&nbsp;</td>
  </tr>
  <tr>
    <td>&nbsp;</td>
    <td>
      <input type="submit" name="button" id="button" value="提交" class="btn" /></td>
    <td>&nbsp;</td>
  </tr>
</table>
</form>
 
 

复制代码

PHP代码段

PHP复制代码

 
function form_books($ajax = false)
{
//规则省略
 if ($this->form_validation->run() == FALSE)
                         {
                                if($ajax == false)
                                {
                                        $page = $this->input->post('page');
                                        $this->index($page);
                                }else
                                {
                                        echo form_error($ajax);
                                }
                               
                         }
                         else
                         {
                                if($ajax == false)
                                {
                                        //保存到数据库
                                }
                         }
 
}
 

复制代码

smilecc123

这个很早就有了，应该蛮简单的

一叶扁舟

多谢分享

dayrui

感觉表单验证类纯属鸡肋

goyuquan

大神对表格情有独衷啊

bob

谢谢分享，学习了