tp3.2 ajax 表单提交

前台:

  1 <form action="javascript:;" method="post" class="form_div" id="tj">
  2
  3                     <ul class="feed_ul clearfix">
  4                         <li>
  5                             <div class="div_biao"><i class=" icon-user"></i> 姓名<i>*</i></div>
  6                             <input style="background: #ededed;" class="form-control" type="text" name="lc_name" placeholder=""   id="name"/>
  7
  8                         </li>
  9                         <li>
 10                             <div class="div_biao"><i class=" icon-home"></i> 公司<i>*</i></div>
 11                             <input style="background: #ededed;" class="form-control" type="text" name="lc_company" placeholder=""  id="phone"/>
 12
 13
 14                         </li>
 15                         <li>
 16                             <div class="div_biao"><i class=" icon-volume-down"></i> 电话<i>*</i></div>
 17                             <input style="background: #ededed;" class="form-control" type="text" name="lc_tel" placeholder=""  id="add"/>
 18
 19                         </li>
 20                         <li>
 21                             <div class="div_biao"><i class=" icon-comment"></i> 邮 箱<i>*</i></div>
 22                             <input style="background: #ededed;" class="form-control" type="text" name="lc_email" placeholder=""   id="email"/>
 23
 24                         </li>
 25
 26                         <br />
 27
 28                         <li>
 29
 30                             <input type="text" name="code" class="form-control pword" id="code" placeholder="验证码" oncontextmenu="return false" onpaste="return false"  style="background: #ededed;" />
 31                             <br />
 32                             <img onClick="this.src=this.src+‘?‘+Math.random();" title="看不清楚?点击刷新验证码?" class="verifyimg reloadverify" alt="点击切换" src="{:U(‘verify‘)}" height="80%";  />
 33
 34                         </li>
 35
 36                         <br/>
 37
 38             <li style="text-align: center">
 39                 <input  type="button" class="btn btn-primary"  onClick="formsubmit()" value="提交"> </input>
 40             </li>
 41
 42
 43
 44             <script type="text/javascript">
 45                 function formsubmit()
 46                 {
 47
 48                     var name=$("input[name=lc_name]").val();
 49                     var tel=$("input[name=lc_tel]").val();
 50                     var company=$("input[name=lc_company]").val();
 51                     var email=$("input[name=lc_email]").val();
 52                     var code=$("input[name=code]").val();
 53
 54
 55
 56                     if(!name)
 57                     {
 58                         alert(‘姓名不能为空!‘);
 59                         return false;
 60                     }
 61                     if(!company)
 62                     {
 63                         alert(‘公司地址不可以为空!‘);
 64                         return false;
 65                     }
 66
 67                     //手机号
 68                     if(!/^1\d{10}$/.test(tel)){
 69                         alert(‘请输入正确手机号码!‘);
 70                         return false;
 71                     }
 72
 73                     if(!/^(\w-*\.*)[email protected](\w-?)+(\.\w{2,})+$/.test(email) )
 74                     {
 75                         alert(‘请输入正确邮箱!‘);
 76                         return false;
 77                     }
 78                     if(!code)
 79                     {
 80                         alert(‘验证码不可以为空!‘);
 81                         return false;
 82                     }
 83
 84
 85                     //$("#tj").attr("action","zxbm").submit();
 86
 87
 88                     $.ajax({
 89                         async:false,
 90                         url:"__ROOT__/Home/Index/zxbm",
 91                         data:{lc_name:name,lc_tel:tel,lc_company:company,lc_email:email,code:code},
 92                         type:"POST",
 93                         datatype:"TEXT",
 94                         success:function(data){
 95
 96                             if(data=="在线报名成功!")
 97                             {
 98                                 alert(data);
 99                                 window.location.href="__ROOT__/Home/Index/index";
100                             }
101                             else
102                             {
103                                 alert(data);
104                             }
105
106
107                         }
108                     });
109
110
111                 }
112
113
114
115             </script>
116
117
118
119
120         </ul>
121
122 </form>

后台:

 1     public function zxbm()
 2     {
 3
 4         if(IS_POST)
 5         {
 6
 7
 8             $verify = new \Think\Verify();
 9             $yzjg = $verify->check($_POST[‘code‘]);
10             if($yzjg)
11             {
12                 $zxbm = D("zxbm"); // 实例化User对象
13                 $zxbm->create(); // 生成数据对象
14                 $res = $zxbm->add(); // 新增用户数据
15
16                 if($res)
17                 {
18                     $data =‘在线报名成功!‘;
19                     $this->ajaxReturn($data);
20                 }
21                 else
22                 {
23                     $data =‘在线报名失败!‘;
24                     $this->ajaxReturn($data);
25                 }
26             }
27             else
28             {
29                 $data =‘输入的验证码有误!‘;
30                 $this->ajaxReturn($data);
31             }
32
33
34
35         }
36
37
38         $this->display();
39
40     }
41
42     public function verify(){
43         $config =    array(
44             ‘fontSize‘    =>    45,    // 验证码字体大小
45             ‘length‘      =>    4,     // 验证码位数
46         );
47         $Verify = new \Think\Verify($config);
48         $Verify->entry();
49
50
51     }
时间: 2024-10-15 11:20:54

tp3.2 ajax 表单提交的相关文章

PHP jQuery ajax 表单提交小示例(含insert, select)

功能描述:能够通过表单向MySQL数据库新增记录,能够表单提供关键词进行查询 index.html <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"&g

使用Jquery.form.js ajax表单提交插件弹出下载提示框

现象: 使用jquery的from做ajax表单提交的时候,后台处理完毕返回json字符串,此时浏览器提示下载一个json文件而不是在success里面继续解析该json对象. 具体的原因: 浏览器兼容性的问题.在谷歌和火狐下没这个问题,我用的ie9测试是有这个问题的.具体的详细我参照的该链接: http://zhidao.baidu.com/link?url=uTXondC9ECEfdObEWbq7V2O7-UW_oXtoVcneVqH_Dmj2hUXjM3y6wMFnQYsUupdWC0Tf

Ajax表单提交插件jquery form

jQuery Form插件是一个优秀的Ajax表单插件,我们可以非常容易的使用它处理表单控件的值,清空和复位表单控件,附件上传,以及完成Ajax表单提交. jQuery Form有两个核心方法ajaxForm()和ajaxSubmit(),本文我们重点介绍ajaxSubmit()的应用. HTML 首先我们载入jquery库和jquery.form.js插件.jquery.form.js插件的官网地址:http://www.malsup.com/jquery/form/ <script type

Ajax表单提交

jQuery Form插件是一个优秀的Ajax表单插件,可以非常容易地.无侵入地升级HTML表单以支持Ajax.jQuery Form有两个核心方法 -- ajaxForm() 和 ajaxSubmit(), 它们集合了从控制表单元素到决定如何管理提交进程的功能.另外,插件还包括其他的一些方法: formToArray().formSerialize().fieldSerialize().fieldValue().clearForm().clearFields() 和 resetForm()等.

jquery.form.js(ajax表单提交)

Form插件地址: 官方网站:http://malsup.com/jQuery/form/ 翻译地址:http://www.aqee.net/docs/jquery.form.plugin/jquery.form.plugin.html#getting-started 一.准备工作 写一个表单: <form id="reg" action="123.php" method="post"> <p> <label for

Jquery Ajax表单提交插件jquery form用法

首先我们载入jquery库和jquery.form.js插件.jquery.form.js插件的官网地址:http://www.malsup.com/jquery/form/  代码如下 复制代码 <script type="text/javascript" src="jquery.js"></script> <script type="text/javascript" src="jquery.form.m

jquery ajax 表单提交被浏览器拦截解决办法

通常jquery的submit表单提交是不会被拦截的,但是用jquery ajax异步提交是会被拒绝的,既然是异步提交造成的问题,那就好解决了,因为jquery ajax方法提供了参数选项: async :true, 默认设置下,所有请求均为异步请求.如果需要发送同步请求,请将此选项设置为 false.注意,同步请求将锁住浏览器,用户其它操作必须等待请求完成才可以执行. 原文地址:https://www.cnblogs.com/richardcastle/p/8297325.html

jQuery ajax表单提交实现局部刷新

jQuery Ajax 异步提交 Form 表单,如果使用 get 请求,注意中文乱码问题,jquery 会先使用 iso8859-1 解码,然后发给服务器,如果使用 post 请求,则直接将中文内容提交给服务器解析. 引入插件: jquery.min.js jquery.form.js 提交表单: 以下为引用内容: // 动态加载页面 // id 显示页面的容器组件ID2 // url 欲加载页面网址 // gop get请求还是post请求,默认get function loadPage(i

form表单和ajax表单提交(Html.BeginForm()、Ajax.BeginForm())的差别

有如下几种区别: 1. Ajax在提交.请求.接收时,都是异步进行的,网页不需要刷新: Form提交则是新建一个页面,哪怕是提交给自己本身的页面,也是需要刷新的: 2. A在提交时,是在后台新建一个请求: F却是放弃本页面,而后再请求: 3. A必须要使用JS来实现,不启用JS的浏览器,无法完成该操作: F却是浏览器的本能,无论是否开启JS,都可以提交表单: 4. A在提交.请求.接收时,整个过程都需要使用程序来对其数据进行处理: F提交时,却是根据你的表单结构自动完成,不需要代码干预: 注意: