Question

我有以下表格，我想将数据发送到控制器。问题是来自动态创建的输入的数据没有传递给控制器。这是dd($request->all());

的输出

`array:4 [▼
  "_token" => "gzpNTHPfZl8GCtNbCPGJrc4S4zTUmhhMUve4gyet"
  "course" => "ICTP"
  "section" => "BB3"
  "lecture" => "functions and pointers"
]
`

welcome.blade.php

`

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
    <head>
        <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.5/css/bootstrap.min.css">
        <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.5/css/bootstrap-theme.min.css">
        <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.3/jquery.min.js"></script>
        <script 

    src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.5/js/bootstrap.min.js"></script>

            <META http-equiv="Content-Type" content="text/html; charset=utf-8"></head>
        <body>
            <div>
                @if(count($errors)>0)
                    <div class="alert alert-danger">
                        @foreach($errors->all() as $error)
                        <p>{{$error}}</p>
                        @endforeach
                    </div>
                @endif
            </div>
            <div>

              <form action="{{route('course.save')}}" method="post">
                <input type="hidden" name="_token" value="{{ csrf_token() }}">
                <label>Select a category</label>
                    <select>
                        <option>Category 1</option>
                      <option>Category 2</option>
                      <option>Category 3</option>
                      <option>Category 4</option>
                    </select>
                    <br><br>
                <label>Select a subcategory</label>
                <select>
                    <option>SubCategory 1</option>
                    <option>SubCategory 2</option>
                    <option>SubCategory 3</option>
                    <option>SubCategory 4</option>
                </select>
                <br><br>

                <label for="course">Course Name:</label>
                <input type="text" name="course" id="course"/>

                <div id="content">
                  <div id="section-content-1">
                    <div id="secs">
                        <label for="section">Section 1:</label>
                        <input type="text" name="section" id="section"/>
                    </div>
                    <div id="lects">
                        <label for="lecture">Lecture 1:</label>
                        <input type="text" name="lecture" id="lecture"/>
                    </div>
                    <button type="button" id="add-lect" data-lect="1">Add New Lecture</button><br><br>
                  </div>
                </div>

                <button type="button" id="add-sect" data-sect="1" >Add New Section</button>
                <br><br><br><br>

                <button class="btn-primary" type="submit">Save</button>
                </form>

            </div>
        </body>
    </html>


    <script src="{{asset('/js/code.js')}}"></script>`

这是jquery文件code.js

    //$('#add-lect').click(function
$('#content').on('click', '#add-lect', function() {
    var count = parseInt($(this).parent().children('#lects').children().length / 2) + 1;
    lectures = '<label>Lecture ' + count + ':</label><input type="text" name="lecture" id="lecture"/>'
    $(this).parent().find('#lects').append(lectures);
});

$('#add-sect').click(function(){
    sect_id = parseInt($('#add-sect').attr('data-sect')) + 1;
    $('#add-sect').attr('data-sect',  sect_id)
    var count = ($("#secs").children().length / 2) + 1;

    //section = '<div id="section-content-'+sect_id+'"> <div id="secs"> <label for="section">Section'+sect_id+':</label><input type="text" name="section" id="section-"/></div><div id="lects"><label for="lecture">Lecture 1:</label><input type="text" name="lecture" id="lecture"/></div><button type="button" id="add-lect" data-lect="1">Add New Lecture</button<br><br></div>'
    section = '<div id="section-content-'+sect_id+'"><div id="secs"><label for="section">Section '+sect_id+':</label> <input type="text" name="section" id="section"/></div><div id="lects"><label for="lecture">Lecture 1:</label><input type="text" name="lecture" id="lecture"/></div><button type="button" id="add-lect" data-lect="1">Add New Lecture</button><br><br></div>'

    $('#content').append(section);
});

Answer 1

当您有许多具有相同名称的输入字段时，例如

<input type="text" name="section" id="section"/>
<input type="text" name="section" id="section"/>
<input type="text" name="section" id="section"/>
<input type="text" name="section" id="section"/>

只有最后输入字段才会传递给服务器。

要传递类似数据的数组，需要name属性的特殊符号：

<input type="text" name="section[]"/>
<input type="text" name="section[]"/>
<input type="text" name="section[]"/>

使用它，在服务器端，您将$_POST['section']作为数组，您可以迭代并获取值。

我还删除了id="section"属性，因为id属性在页面上必须唯一。

因此，您需要在blade模板和javascript代码中更改输入的名称。

<强>更新

如果one-to-many关系，您可以将您的命名扩展为：

<input type="text" name="section[1]"/>
<input type="text" name="lecture[1][]"/>
<input type="text" name="lecture[1][]"/>

<input type="text" name="section[2]"/>
<input type="text" name="lecture[2][]"/>
<input type="text" name="lecture[2][]"/>
<input type="text" name="lecture[2][]"/>

<input type="text" name="section[3]"/>
<input type="text" name="lecture[3][]"/>
<input type="text" name="lecture[3][]"/>

因此，如您所见 - 您可以明确定义名称的索引。

在上述情况下，您可以迭代$_POST['section']并获取$_POST['lecture']与索引相同的索引。

来自动态创建的输入的数据未传递给控制器

1 个答案: