ajax 不使用form提交表格

html代码:

<div class="message">

            <div><span>工号</span><input type="text"  class="phone"><div class="clear"></div></div>
            <div><span>密码</span><input type="password"  class="password"><div class="clear"></div></div>
            <div><span>验证码</span><input type="text" class="verifys" style=" width: 188px;"><img class="verify" src="{:U(‘Index/verify‘)}" alt="验证码" onClick="this.src=this.src+‘?‘+Math.random()" />
                <div class="clear"></div></div>
            <div><div class="btn">确定</div></div>

 </div>

jquery代码

<script type="text/javascript">

    $(".message .btn").click(function(){
        var phone = $.trim($(‘.message .phone‘).val());
        var password = $.trim($(‘.message .password‘).val());
        var verify = $.trim($(‘.message .verifys‘).val());
        $.ajax({
            type: "POST",
            url: "{:U(‘Index/staff‘)}",                       //提交给后台函数 Index 中的 staff()函数
            data: {password:password,phone: phone, verify:verify},
            dataType: "json",
            success: function (data) {
                if( data.id ==1  ){

                    window.location.href = "{:U(‘Index/knowledge‘)}";
                }else{
                    alert(data.info);
                }
            }
        })
    });

后台函数代码 可依据自身需求写

function staff(){

    if( IS_AJAX ){

             if(I(‘post.phone‘) =="" || I(‘post.password‘) ==‘‘ ){
                         //$this->error("用户名或者密码为空!");
                 $this->ajaxReturn(array(‘id‘ =>0,‘info‘=>‘用户名或密码为空!‘ ));
            }}
时间: 2024-10-12 21:10:42

ajax 不使用form提交表格的相关文章

2016 系统设计第一期 (档案一)jQuery ajax serialize()方法form提交数据

jQuery ajax serialize()方法form提交数据,有个很奇怪的问题,好像不能取到隐藏控件的值. //点击提交按钮保存数据 $('#btn_submitUser').click(function () { var UserId = $('#UserId').val(); if (UserId == "") { $.ajax({ type: "POST", url: '/Users/Create/', data: $("#SaveUserFo

jQuery的ajax的form提交方法应用

1.如果不用ajax的form提交,就必须把表单的每一条数据进行获取,并提交给action进行处理.这样做比较麻烦,现在用了jQuery的easyui,使用封装好的ajax的form提交.脚本代码如下: //提交表单 function sysusersave(){ if($.formValidator.pageIsValid()){//校验表单输入信息是否合法 //使用jquery的ajax from提交,指定from的id和回调方法,提交的url使用提from中的action,参数为空,传递J

js实现无刷新表单提交文件,将ajax请求转换为form请求方法

最近在做项目的时候遇到一个需要上传文件的需求,因为ajax请求是无法上传二进制文件流的,所以只能用form表单提交,而form提交有一个问题就是会使页面刷新,本文解决了form表单提交文件时页面刷新的问题. 一.无刷新实现form提交文件 将form的target指向为一个iframe就可以实现无刷新提交文件了,但关键是还需要看到后台返回的数据,所以还需要为该iframe注册一个回调函数,因为iframe和该页面在同域内,所以可以在iframe里可以调用该回调函数,就可以看到后台返回的数据了.实

使用ajax方法实现form表单的提交

转http://www.cnblogs.com/han-1034683568/p/7199168.html 写在前面的话 在使用form表单的时候,一旦点击提交触发submit事件,一般会使得页面跳转,页面间的跳转等行为的控制权往往在后端,后端会控制页面的跳转及数据传递,但是在某些时候不希望页面跳转,或者说想要将控制权放在前端,通过js来操作页面的跳转或者数据变化. 一般这种异步的操作,我们都会想到ajax方式,因此在实现了功能后就整理了这篇文章,通过ajax方法实现form表单的提交并进行后续

Extjs ajax form 提交

1.form 提交 form.form.submit({ url: "/HandlerExcelToDB/UploadFile.ashx", params: {}, success: function (formUpload, action) { var PicName = action.result.FileName; Ext.MessageBox.alert("提示", "上传成功!"); Ext.MessageBox.hide(); win

用javascript动态创建并提交表单form,表格table

<script> //helper function to create the formfunction getNewSubmitForm(){ var submitForm = document.createElement("FORM"); document.body.appendChild(submitForm); submitForm.method = "POST"; return submitForm;} //helper function t

jquery.form.js实现将form提交转为ajax方式提交的使用方法

本文实例讲述了jquery.form.js实现将form提交转为ajax方式提交的方法.分享给大家供大家参考.具体分析如下: 这个框架集合form提交.验证.上传的功能. 这个框架必须和jquery完整版结合,否则使用min则无效. 原理:利用js进行对form进行组装成ajax的url和data,原理还是用ajax来提交,其实这完全可以自己写,但是有这个框架可能会更简单. 一.最简单例子: 第一步:引用js <!--这里的min是自己用js压缩工具对完整版进行的压缩 并不是真正的min,所以好

Form提交前,ajax校验,并阻止提交

var addSyncForm = Horn.getComp("addSyncForm"); if(!addSyncForm){ return ; } addSyncForm.el.submit(function(){ var data = {"businAccount":Horn.getComp("businAccount","_add").getValue(),"systemNodeItem":Horn

ajax Form提交与Payload提交

后端处理前端提交的数据时,既可以使用Form解析,也可以使用JSON解析Payload字符串. Form解析可以直接从Request对象中获取请求参数,这样对象转换与处理相对容易,但在大片JSON数据需要提交时,可能会出现大量的数据拆分与处理工作,另外针对集合类型的处理,也是其比较孱弱的地方. 而Payload的优势是一次可以提交大量JSON字符串,但无法从Request从获取参数,也会受限于JSON解析的深度(尤其是有多层对象级联的情况,最底层的对象几乎无法转换为具体类型). 以Chrome浏