精华内容
下载资源
问答
  • 前端如何利用form表单传数组

    千次阅读 2020-03-09 19:23:20
    在写前端的时候碰到了传数组的问题,于是我利用form表单测试了一下。 如何利用form表单传数组 form表单的常用形式如下: <form action=...

    在写前端的时候碰到了传数组的问题,于是我利用form表单测试了一下。

    如何利用form表单传数组

    form表单的常用形式如下:

    <form action="http://192.168.43.158:8082/uploadImage"  method="post" enctype="multipart/form-data">
        <input type="file" name="filename" size="45"><br>
        <input type="submit" name="submit" value="submit">
    </form>
    

    根据我目前的需求:传数组

    <form action="http://192.168.43.158:8082/game/examination/addMul"  method="post" enctype="multipart/form-data">
        <form>
            <div class="form-control">
                books1:
                <input type="text" name="books[]" />
            </div>
            <br>
            <div class="form-control">
                books2:
                <input type="text" name="books[]" />
            </div>
            <input type="submit" value="Submit" />
        </form>
    </form>
    

    关于form表单,一个

    表示一行,所以写多个
    表示多行,在submit的时候就是一个数组了

    Java后端的接收

    关于后端我是用的SpringMvc,所以接收传值常用@RequestParam和@RequestBody两个注解

    • 关于@RequestParam注解,赋值的过程在我看来更像是从map中取值(default key就是变量名),所以我还真不是很确定能取到值

    跟随前人的足迹

    • 网上有很多关于此的文章,我找了一个看起来比较靠谱的做法,套到我的代码中去
    @PostMapping("/addMul")
        public HashMap addMulQuestion(@RequestParam(value = "books[]", required = false) ArrayList<String> books) {
            System.out.println(books);
            return null;
        }
    

    结果

    确实有打印,说明此方法可行

    摸索

    各位仔细回看一下代码会发现我的前端代码的name=“books[]”,而后端接收的value的name也是"books[]",那么我是否有理由猜测,其实根本没必要命名成数组,只要名字统一即可,在底层如果有value名字相同的就会自动封装成数组

    验证

    我将name改成books

    <form action="http://192.168.43.158:8082/game/examination/addMul"  method="post" enctype="multipart/form-data">
        <form>
            
            <div class="form-control">
                books1:
                <input type="text" name="books" />
            </div>
            <br>
            <div class="form-control">
                books2:
                <input type="text" name="books" />
    
            </div>
            <input type="submit" value="Submit" />
        </form>
    </form>
    

    后端也做相应的改变

    @PostMapping("/addMul")
        public HashMap addMulQuestion(@RequestParam(value = "books[]", required = false) ArrayList<String> books) {
    
    
            System.out.println(books);
    
            return null;
        }
    

    测试结果是:

    测试结果

    • 我的猜想是对的

    为了进一步证实猜想,我用postman再一次验证了一下

    请求.png
    结果.png

    结论

    发送key相同的表单,@RequestParam接收会自动封装成数组

    展开全文
  • 下面小编就为大家带来一篇form表单传递数组数据、php脚本接收的实例。小编觉得挺不错的,现在就分享给大家,也给大家做个参考。一起跟随小编过来看看吧
  • js表单提交数组

    千次阅读 2019-01-04 10:55:53
    // 批量购买(数组)  $('#batch_buy').on('click', function() {  var gids = [];  $('.table .checkbox').each(function() {  if ($(this).prop('checked')) {  ...

    // 批量购买(数组)
            $('#batch_buy').on('click', function() {
                var gids = [];
                $('.table .checkbox').each(function() {
                    if ($(this).prop('checked')) {
                        gids.push($(this).data('gid'));
                    }
                });
                if (gids.length == 0) {
                    layer.msg('请选择购买的商品');
                    return false;
                }
                var ugsd = {
                    gid: gids,
                    status: 1
                };
                open_iframe('编辑', '<{site_url('/manager/goods/goods_info/batchAdd')}>?gids=' + gids)

                // 获取url参数(数组)
                var param = parseUrl();
                var arry = param.gids.split(',')
                let html = ''
                $.each(arry, function(i, n) {
                    html += `<input type="hidden" name="gids[]" value="${n}">`
                })

                $("#channel").after(html)

    //管理员购买(单个)
            $('body').on('click', '.g_buy', function() {
                var thisid = $(this).parents('tr.text-c').find('.checkbox').data('gid');
                open_iframe('编辑', '<{site_url('manager/goods/goods_info/buyAdd')}>?gid=' + thisid)
            });


            // 获取参数(单个)
            var param = parseUrl();
            let gid = param.gid
            let html = `<input type="hidden" name="gid" value="${gid}">`
            $("#channel").after(html)

    展开全文
  • ajax传递数组、form表单提交对象数组

    千次阅读 2020-12-21 05:43:41
    在JSP页面开发中,我们常常会用到form表单做数据提交,由于以前一直只是使用form表单提交单个对象,只要表单文本域的name值和接收的对象的属性名一致,那么传值就没有什么问题。不过,在前几天的开发任务中,遇到了...

    在JSP页面开发中,我们常常会用到form表单做数据提交,由于以前一直只是使用form表单提交单个对象,只要表单文本域的name值和接收的对象的属性名一致,那么传值就没有什么问题。不过,在前几天的开发任务中,遇到了需要批量传递对象,也就是需要传递对象数组,在此做个总结。今天又遇到需要向后台传递数组,便一并写下来吧。

    1、ajax传递普通数组

    前台代码

    var deleteNum= [];//定义要传递的数组

    deleteNum.push("1");

    deleteNum.push("2");

    deleteNum.push("3");//向数组中添加元素

    $.ajax({

    type:"post",

    url:"deleteNum.do",

    data:{deleteNum:deleteNum},

    traditional: true,//必须指定为true

    success:function(data){

    if(data.success){

    deleteNum = [];

    }

    }

    });

    后台代码

    public ActionResult deleteNum(String[] deleteNum){

    //这个时候已经得到了deleteNum数组值

    return Json(new {status=1});

    }

    form表单提交自定义对象数组

    之后在form表单提交给后台时,需要先定义一个对象,当然,别忘了定义User对象,属性为name,password,重点是下面这个用于接收form表单提交的对象数组,如果还有其他对象数组需要接收,那在这个类里面再定义相应的ArrayList属性即可。

    /**

    * 类型描述

    * 表单列表对象 用于接收form表单提交的对象数组

    *@since 2016-2-25

    *@author 古时一轮月

    *

    */

    public class FormListObject {

    private ArrayList userlist;

    public ArrayList getUserlist() {

    return userlist;

    }

    public void setUserlist(ArrayList userlist) {

    this.userlist= userlist;

    }

    定义好该对象之后,在controller层接收就可以了

    public AjaxResult saveOrUpdateUser(FormListObject list){

    List userlist = list.getUserlist(); //你会看到你想要的

    }

    转自:http://blog.csdn.net/u014252157/article/details/50751302

    展开全文
  • 表单的各个元素的name都设置成同一个数组对象既可以以数组的方式传递表单值 html页面如下: <form method="post" action="arrayformdata.php"> <label>Tags <input type="text" name="tags[]"/> <...
  • springBoot 前台传数组处理

    千次阅读 2020-04-22 09:22:41
    springBoot 教程

    springBoot 教程

    前台传参 

    [{"nTh":"94","cDa":"ABCD"},{"nTh":"540","cDa":"ABC"},{"nTh":"510","cDa":"A"}]

     

    后台接收

      @PostMapping("/submitDaily3question")
        public List<TkglEntity> submitDaily3question(@RequestBody List<DailyDtOption> dtlist) {
            return daily3questionService.submitDaily3question(dtlist);
        }

     

    展开全文
  • }然后将此String放在inputHidden html标记中,以便在HTML表单中传递。 现在在Servlet中,使用此方法将字符串反序列化为对象: private static Object fromString( String s ) throws IOException , ...
  • 主要介绍了vue elementUI 表单校验(数组多层嵌套)功能的实例代码,代码简单易懂,非常不错,具有一定的参考借鉴价值 ,需要的朋友可以参考下
  • form表单控件向后台传递数组

    千次阅读 2018-09-29 10:05:10
    后台: public class MSelectDetail { private Integer xxx; private String xxxx; private String xxxx; private String xxxx; private String xxxx;... //==================给本表字段======...
  • 前后端联调之Form表单提交数组

    千次阅读 2019-01-14 19:02:29
    后端以Form表单的Content-type形式接收Integer数组,接口和前端代码如下,前后端联调时,后端接收不到前端传递的参数 接口: @ResponseBody @RequestMapping(&quot;/testIntegerArray&quot;) public...
  • Form表单传递数组

    万次阅读 2011-03-13 20:22:00
    对于一个问题的多个答案,如果我们可以通过form表单传递数组,那程序处理起来会简单多了: <table> <tr><br /> <td><input type="checkbox" name="how_hear[]" id="how_hear1" value="Website...
  • 数组方式进行表单提交

    万次阅读 2017-04-18 15:37:39
     今天遇到一个问题,要保存很多表单信息,苦恼了许久,终于发现一个挺不错的方法,以数组的形式把表单中的数据提交至后台进行保存。  其实实现起来很简单,就是给表单中要提交的信息的name命名时要有一定的规范,...
  • form 表单 添加数组

    2020-11-24 10:18:29
    form 表单二次添加数组 ,如果直接append 数组被当作字符串,服务器无法识别 var form = new FormData(document.getElementById("add")); var person = ['1','2','3']; for (var i = 0; i < person.length; ...
  • 1:今天请求后台数据的时候遇到了一个以表单方式提交的请求,数组直接变成了 2:但是在控制台上面打印又是正常的 3:解决的办法就是使用JSON.stringify()转换为json字符串。 ...
  • form表单数组的校验

    千次阅读 2020-11-11 10:28:58
    1,校验的form对象中,包含数组,对数组进行循环 <template> <div class="hello"> <el-form ref="form" :model="form" :rules="rules"> <!-- 对form中的数组进行校验 --> <div v-...
  • Vue 创建基于数组的动态表单

    千次阅读 2019-08-29 16:42:00
    在开发vue项目中,有时会遇到需要增删的列表表单,比如添加一堆人员信息,数据格式如下 postData=[formData1,formData2,formData3....] 这时可以直接创建一个基于数组的form对象,这样增减操作也可以基于数组的push和...
  • form表单提交数组数据

    千次阅读 2018-12-20 18:36:00
    数组数据可以通过ajax提交给后台,但是如果要跳转页面的话ajax是无法跳转的,要到success做location.href的跳转, 先定义一个class是接受数组类型的 public class TicketCart { private int count; ...
  • 实现效果: 参考官网最后一项: 去官网 也可以看一下在线示例 : https://run.iviewui.com/17l6oYA6 代码实现: <!-- 自定义栏位 --> <Card :title="$t('自定义栏位')" class="mt10">...draggable
  • curl命令怎么传数组

    千次阅读 2020-12-30 12:04:04
    //所需数组用http_bulid_query()函数处理一下 //执行并获取url地址的内容 $output = curl_exec($ch); $errorCode = curl_errno($ch); //释放curl句柄 curl_close($ch); if(0 !== $errorCode) { return false; }...
  • SpringBoot 如何从前台传递数组

    千次阅读 2019-04-18 14:24:00
    1.SpringBoot 如何从前台传递数组 2、前台 $.ajax({ url: 'deleteBsGiftById', type: 'post', dataType: 'json', ...
  • 如下 data接受了ids数组表单数据,在这里要把ids数组处理,因为获得的ids是String类型 @RequestMapping(value = "batchEdit.do") public @ResponseBody Map,String> batchEdit(@RequestParam Map,Object> ...
  • 数组表单例如本来呢使用 layui 的form.on('submit(systemsave)', function(data){//data.field 这个提交到后端 用$_POST接受就是个多维数组//})这个data.field数据结构为但是后端要要求提交之前就是json格式。...
  • form表单提交对象包含对象数组

    千次阅读 2019-08-22 15:18:54
     总所周知,form表单提交与后台接收之间的桥梁是通过标签内name与对象属性一致来进行传值的,这里简单只测试活动信息id,活动名称,活动简介以及其中关联的奖项信息中的奖品名称。      上图可以看到,...
  • 欢迎来到 vue-form 表单提交演示间, 你有更好的建议,请告知楼主额!1. 客户端 htmlTitle欢迎来到 vue-form 表单提交演示间, 你有更好的建议,请告知楼主额!boxnewrankdesctitle{{v.box}}{{v.new}}{{v.rank}}{{v....
  • Ajax 提交数组 @PostMapping("/save") public void saveUser( @RequestParam("user...Form表单提交数组 普通第一种方式就够了,第二种属于要上传附件,还要提交数组。当然了不上传附件也可以用啦!!! @PostMappi

空空如也

空空如也

1 2 3 4 5 ... 20
收藏数 170,173
精华内容 68,069
关键字:

表单传数组