当前位置: 首页 > article >正文

form表单—2种提交方式

只提交参数到后台,不接收返回值

html代码

<!--第1步:设置 action,method-->
<form id="editForm" action="app/edit/destination" method='POST'><!--第2步:表单元素 --><div>名称<input id="getName" name="name" /></div><div>id<input id="getAreaId" name="id" /></div><div>纬度<input id="getName" name="latitude" /></div><div>经度<input id="getAreaId" name="longitude" /></div><!--第3步:提交方式 submit--><input type="submit" value="获取" /></form>

js代码

<script>
/*如果需要做表单验证,如果不做表单验证,js代码可以省略*/$("#editForm").validate({/*第1步:做表单验证,省略*//*第2步:提交表单到后台   */submitHandler : function(form) {form.submit();   }})
</script>

java代码

@ResponseBody
@RequestMapping(value = "edit/destination", method = RequestMethod.POST)
public void editDestination(Long id, String name, Float longitude, Float latitude, String username) {//处理参数,没有返回值}

提交参数到后台,并且接收后台返回值

html代码

    <form id="editForm"><div>名称<input id="getName" name="name" /></div><div>id<input id="getAreaId" name="id" /></div><div>纬度<input id="getName" name="latitude" /></div><div>经度<input id="getAreaId" name="longitude" /></div><input type="submit"  value="提交" /></form>

如果需要做表单验证 js代码如下:

    <script>$("#editForm").validate({//做表单验证rules : {name : { //格式:domId: 规则minlength : 2,//无效maxlength : 30,required : true}},messages : {name : {required : "请输入第一个参数",minlength : jQuery.validator.format("至少需要{0}字符"),maxlength : jQuery.validator.format("不能超过{0}字符")}},//验证成功后提交参数submitHandler : function(form) {ajaxSubmit();}});function ajaxSubmit() {$.ajax({async : false,cache : false,type : 'POST',data : $("#editForm").serialize(),url : "app/edit/destination",//请求的action路径  error : function() {//请求失败处理函数  alert('失败');},success : function(data) { //请求成功后处理函数。    alert(data);}});}</script>

如果不需要做表单验证,js代码如下:

 <!--input提交按钮改为如下--> 
<input type="button" onclick="ajaxSubmit()" value="提交" /><script>function ajaxSubmit() {$.ajax({async : false,cache : false,type : 'POST',data : $("#editForm").serialize(),url : "app/edit/destination",//请求的action路径  error : function() {//请求失败处理函数  alert('失败');},success : function(data) { //请求成功后处理函数。    alert(data);}});}
</script>

java代码

@ResponseBody
@RequestMapping(value = "edit/destination", method = RequestMethod.POST)
public long editDestination(Long id, String name, Float longitude, Float latitude, String username) {long result = 0; /*处理参数*/return result;
}
http://www.lryc.cn/news/2416769.html

相关文章:

  • Win7系统提示找不到MSVCRTD.DLL文件的解决办法
  • MaskedTextBox
  • 缓存背后的智慧:旁路、读写穿透和写回三种策略全面解析
  • CSS——滤镜(filter )
  • 关于Loadlibrary 失败-找不到指定模块126错误
  • DAS~~
  • ThinkPHP6+Layui自定义分页样式
  • 博客搜索引擎列举|博客搜索引擎的浅比较
  • 多线程开发实战:Java实现多线程四种方式及相关方法原理
  • 端口详解及如何开起端口关闭端口
  • C语言之多线程编程
  • plsql学习笔记
  • MFC窗口之间的消息传递
  • Robot之Setting table部分
  • 从Java角度看区块链实践系列3——P2P网络:区块链P2P网络拓扑结构的演变史
  • 高并发高流量网站架构
  • 史上最简单易懂的 简析utf-8编码
  • C语言实战-贪吃蛇
  • 沟通CTBS物流行业远程接入解决方案
  • STM32CubeMX 下载安装使用(一)
  • H3C交换机配置DHCP中继
  • 编译hyperscan
  • CydiaSubstrate的简单使用
  • 探索MS17-010漏洞利用工具:All-In-One全方位解析
  • mysql用decimal_MySQL数据类型DECIMAL用法详解
  • MySQL - 存储过程 [Stored Procedure] - 学习/实践
  • INA3221和 ESP8266 6通道电流表
  • HTML自动暂停按钮,css 播放暂停按钮实现_html/css_WEB-ITnose
  • Linux命令及详解
  • c语言学习网站大全