前台:

  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-*\.*)+@(\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 }

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

  1. Ajax表单提交插件jquery form

    jQuery Form插件是一个优秀的Ajax表单插件,我们可以非常容易的使用它处理表单控件的值,清空和复位表单控件,附件上传,以及完成Ajax表单提交. jQuery Form有两个核心方法ajax ...

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

    现象: 使用jquery的from做ajax表单提交的时候,后台处理完毕返回json字符串,此时浏览器提示下载一个json文件而不是在success里面继续解析该json对象. 具体的原因: 浏览器兼 ...

  3. form表单提交和ajax表单提交,关于移动端如何通过软键盘上的【搜索】和【前进】进行提交操作

    [文章来源]由于自己对于form研究甚少,所以一直用的都是AJAX进行提交,这次后台提出要用form提交,顺便深入研究一下:之前在做表单的时候,发现input可以通过设置不同的type属性,调用不同的 ...

  4. 20151223jquery学习笔记--Ajax表单提交

    传统的表单提交, 需要多次跳转页面, 极大的消耗资源也缺乏良好的用户体验. 而这款form.js 表单的 Ajax 提交插件将解决这个问题.一. 核心方法官方网站: http://malsup.com ...

  5. Ajax表单提交及后台处理简单应用

    首先先说下表单提交吧,要提交表单那么就得先收集表单数据(至于验证这个我就不说了,要说留下下次吧),有了jquery取个html的值还是简单$("xxid").val()等就完了,但 ...

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

    Form插件地址: 官方网站:http://malsup.com/jQuery/form/ 翻译地址:http://www.aqee.net/docs/jquery.form.plugin/jquer ...

  7. 使用bean接收ajax表单提交数据包含文件上传

    这几天写带图片上传的表单提交,一个配置小程序活动弹出框样式的功能,记录一下一些需要注意的地方 首先是 前端 JSP 文件的表单 <form class="search-wrapper& ...

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

    有如下几种区别: 1. Ajax在提交.请求.接收时,都是异步进行的,网页不需要刷新: Form提交则是新建一个页面,哪怕是提交给自己本身的页面,也是需要刷新的: 2. A在提交时,是在后台新建一个请 ...

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

    jQuery Ajax 异步提交 Form 表单,如果使用 get 请求,注意中文乱码问题,jquery 会先使用 iso8859-1 解码,然后发给服务器,如果使用 post 请求,则直接将中文内容 ...

随机推荐

  1. e776. 设置JList组件项的提示语

    // Create a list, overriding the getToolTipText() method String[] items = {"A", "B&qu ...

  2. TPshop下载安装

    一. 首先 修改 C:\Windows\System32\drivers\etc\hosts 文件 加一行 127.0.0.1 www.tpshop.com // 这里可以改成你想要的域名 二. 修改 ...

  3. css3 -- 自动生成序号(不使用JS,可任意排序)

    需求:一个table 需要在第一列生成序号:1.2.3.4.5......  并且自适应行数 不使用后台程序,开始考虑使用JS,但是一旦前台排序后,序号就乱了,最后采用CSS的一个计数器方法实现! & ...

  4. (原创)OpenStack服务如何使用Keystone(一)---Keystone端的操作

    (一)Keystone端的操作 (二)如何在OpenStack服务上部署Keystone中间件 (三)详细配置keystonemiddleware OpenStack项目如果要使用Keystone作为 ...

  5. 如何在Web.config中注册用户控件和自定义控件

    问题: 在ASP.NET 的早先版本里,开发人员通过在页面的顶部添加 指令来引入和使用自定义服务器控件和用户控件时,象这样: <%@ Register TagPrefix="scott ...

  6. 移动端控制在input里输入的值只能是数字

    <input type='text' oninput="(this.v=function(){this.value=this.value.replace(/[^0-9-]+/,''); ...

  7. Mac homebrew类似apt-get命令安装包

    INSTALL brew ruby -e "$(curl -fsSL https://raw.githubusercontent.com/Homebrew/install/master/in ...

  8. PHP数据库备份与恢复

    先说下关于数据库备份与恢复的原理: 1.查找所有表->2.查找所有字段->3.查找所有数据->4.生成SQL 备份注意点: 2=>需要列出所有字段名,字段类型等相关信息 3=& ...

  9. 黏性Session和非黏性Session

    黏性Session和非黏性Session黏性Session:此模式下同一会话中的请求都被派送到同一个tomcat实例上,这样我们就无须在多台服务器之间实现session共享了,这是其好处,不好的地方就 ...

  10. Java编程思想学习笔记——枚举类型

    前言 关键字enum可以将一组具名的值有限集合创建一种为新的类型,而这些具名的值可以作为常规的程序组件使用. 正文 基本enum特性 调用enum的values()方法可以遍历enum实例,value ...