一、submit提交

在form标签中添加Action(提交的地址)和method(post),且有一个submit按钮(<input type=’submit’>)就可以进行数据的提交,每一个input标签都需要有一个name属性,才能进行提交。

<form action=’http://www.123.com/postValue’ method=’post’>

<input type=’text’ name=’username’ />

<input type=’password’ name=’password’/>

<input type=’submit’ value=’登陆'/>

</form>

当点击登陆时,向数据库发生的数据是:username=username&password=password.

这种默认的提交方式,一般会进行页面的跳转(不成功时跳转到当前页面)。而有时候我们是对弹出框进行数据提交的,希望提交成功则关闭弹出框并刷选父页面,失败则提示失败原因,且弹出框不关闭。此时可以采用Ajax进行数据提交.

二、Ajax提交form表单

$('#documentForm').submitForm({
            url: "/Document/SubmitDocumentCreate",
            dataType: "text",
            callback: function (data) {
                endFileUpload();
                data = eval("(" + data + ")");
                alert(data.Content);
                if (data.Result > 0) {
                    location.href = data.Redirect;
                }
            },
            before: function () {
                startFileUpload();
                var errMsg = "";
            }
        }).submit();

此时可以在callback函数中对请求结果进行判断,然后执行不同的动作(页面跳转或刷选数据、提醒错误都可以)

三、Easyui的form插件

通过easyui的form插件也可以达到上面的目的。

$('#ff').form('submit', {

url:...,

onSubmit: function(){

//进行表单验证

//如果返回false阻止提交

},

success:function(data){

alert(data)

}

});

四、form表单提交附件

需要设定form的enctype="multipart/form-data"并且添加<input type=’file’>

而且附件只能通过submit方法进行提交,

Form表单提交数据的几种方式的更多相关文章

  1. 浏览器原生 form 表单POST 数据的两种方式

    我们在提交表单的时候,form表单参数中会有一个enctype的参数.enctype指定了HTTP请求的Content-Type. 常用有两种:application/x-www-form-urlen ...

  2. form 表单提交的另一种方式 js

    <html> <head> <script type="text/javascript"> function formSubmit() { fm ...

  3. js模拟form表单提交数据, js模拟a标签点击跳转,避开使用window.open引起来的浏览器阻止问题

    js模拟form表单提交数据, js模拟a标签点击跳转,避开使用window.open引起来的浏览器阻止问题 js模拟form表单提交数据源码: /** * js模拟form表单提交 * @param ...

  4. thinkPHP5.0使用form表单提交数据和删除文章,不用TP的提示页面,使用弹出提示信息

    form表单提交数据和删除文章时,TP的默认信息提示页面的看起来不是很好看,想要实现弹窗提示怎么做呢? 前端:可以使用前端的一个知识--iframe,iframe元素会创建包含另外一个文档的内联框架: ...

  5. springboot框架中集成thymeleaf引擎,使用form表单提交数据,debug结果后台获取不到数据

    springboot框架中集成thymeleaf引擎,使用form表单提交数据,debug结果后台获取不到数据 表单html: <form class="form-horizontal ...

  6. form表单提交数据的数据格式

    form表单提交的数据格式默认是 enctype="application/x-www-form-urlencoded"这样将input框的数据与input框的name属性以键值对 ...

  7. asp.net.mvc 中form表单提交控制器的2种方法和控制器接收页面提交数据的4种方法

    MVC中表单form是怎样提交? 控制器Controller是怎样接收的? 1..cshtml 页面form提交 (1)普通方式的的提交

  8. 关于AJAX与form表单提交数据的格式

    一 form表单传输文件的格式: 只有三种: multipart/form-data 一般用于传输文件,图片文件或者其他的. 那么其中我们默认的是application/x-www-form-urle ...

  9. form表单提交数据给后台

    1.完整登录示例 1. form表单往后端提交数据注意三点 1.所有获取用户输入标签都应该放在form表单里面 2.action属性控制往哪儿提交,method一般都是设置成post 3.提交按钮必须 ...

随机推荐

  1. jquery 时间控件怎么能禁止输入只能选择日期?

    jsp一个input输入框用的是easyui时间控件,现在问题是如何是这个input只能点击选择日期,而禁止手动输入 解决方法::: 在日期的input标签里面添加::::editable=" ...

  2. sql server 查询和Kill死锁进程

    查询死锁进程语句 select        request_session_id spid,       OBJECT_NAME(resource_associated_entity_id) tab ...

  3. C# 科学计数法转换成数字

    /// <summary> /// 判断输入的数是否是科学计数法.如果是的话,就会将其换算成整数并且返回,否则就返回false. /// </summary> /// < ...

  4. Singleton in C++11 style

    #include <iostream> #include <memory> #include <mutex> class SingletonOld { static ...

  5. Light OJ 1027 - A Dangerous Maze (数学-期望)

    题目链接:http://www.lightoj.com/volume_showproblem.php?problem=1027 题目大意: 一个迷宫, 有n个门,选择一个门花费为|ai|, 如果选择的 ...

  6. 第三章 centos安装git

    yum install git 安装后的默认存放地点/usr/bin/git

  7. 10款免费而优秀的图表JS插件

    http://www.open-open.com/lib/view/open1406378625726.html http://www.ichartjs.com http://echarts.baid ...

  8. expense KK [ɪkˋspɛns] DJ [iksˋpens]

    https://tw.dictionary.yahoo.com/dictionary?p=expense expense 1 Dr.eye譯典通   KK [ɪkˋspɛns] DJ [iksˋpen ...

  9. opencv单目摄像机标定(一)

    #include <string> #include <iostream> #include <cv.h> #include <highgui.h> u ...

  10. JavaWeb 学习007-4个页面,5条sql语句(添加、查看、修改、删除)2016-12-2

    需要复习的知识: 关联查询 =================================================================================班级模块学 ...