laravel 多条添加新增

最新推荐文章于 2024-10-16 00:58:42 发布

原创最新推荐文章于 2024-10-16 00:58:42 发布 · 2.9k 阅读

1 ·

CC 4.0 BY-SA版权

laravel 专栏收录该内容

23 篇文章

订阅专栏

本文介绍了一种在前端动态添加多个输入框的方法，并通过点击事件触发这些输入框的增加，最后将数据批量提交到后端进行处理。文章详细展示了如何使用HTML和JavaScript实现该功能，并提供了后端控制器的示例代码。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

多条添加就是你触发一个点击事件+的时候弹出来一个一模一样的文本框填写数据，进行后台多条新增入库

代码实现： html：

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Document</title>
</head>
<body>

</head>
<form action="{{url('insert')}}" method="post">
        <div class="col-xs-3" style="padding: 3px;">多条新增<input class="form-control" type="text" name="label[]" value=""></div>

    <div class="label">
    </div>
    <a class="add-label">再来一条</a><input type="submit" value="添加">
</form>
</body>
</html>
//这里引入自己的js文件
<script src="../js/app.js"></script>
<script type="text/javascript">
    $(function(){
        //添加标签
        $('.add-label').click(function(){
            var html = '<div class="col-xs-3" style="padding: 3px;">多条新增<input class="form-control" type="text" name="label[]" value=""></div>';
            $('.label').append(html);
        });

    });
</script>

控制器：

    public function insert(Request $request){
        $params = $request->all();  //获取所有
        print_r($params);
        //单字段多条添加
        $data=implode(',',$params['label']); //数组分割成字符串
        print_r($data);

        //多条新增
        for($i=0;$i<count($params['label']);$i++){
            $array[]=array('label'=>$params['label'][$i]);
        }
        print_r($array);

    }

//单字段多条渲染  
@foreach($info->label as $key=>$v)
<div class="col-xs-3" style="padding: 3px;">
<input class="form-control" type="text" name="label[]" value="{{$v}}">
</div>
 @endforeach