使用 bootstrap modal 和 ajax 在 laravel 10 中使用外键插入数据

Question

对于一个“档案”，我有两个表“档案”和“仓库”，我们有多个“仓库”，我创建了一个带有引导程序模式的表单来插入一个新的“仓库”，我使用 ajax 发布数据，这里是 ajax功能：

$(document).on('click', '.ajouterDepotBtn', function(){
                var dossierId = parseInt($(this).data('dossier_id')); //foreign key
                $('#dossier_id_depot').val(dossierId);
            });

            $('#create-depot-btn').click(function(e){
                e.preventDefault();
                $.ajax({
                    //url: '/depots',
                    url: "{{ route('depots.store') }}",
                    method: 'POST',
                    data: $('#create-depot-form').serialize(),
                    success: function(response) {
                        alert('Création de dépôt réussie!');
                        location.reload();
                    },
                    error: function(xhr) {
                        alert('Une erreur est survenue lors de la création du dépôt.');
                    },
                });type here

这意味着当用户点击这个类“.ajouterDepotBtn”的按钮时，我们检索外键然后显示表单，当我们点击“#create-depot-btn”女巫是表单提交时，我们发布数据。 “#dossier_id_depot”是我添加到我的表单中以存储档案 ID 的输入，当我打开表单时，它似乎没有问题。

这里是视图：

<div class="modal fade" id="ajouterDepotModal" tabindex="-1" aria-labelledby="ajouterDepotModalLabel" aria-hidden="true">
    <div class="modal-dialog">
        <div class="modal-content">
            <div class="modal-header">
                <h5 class="modal-title" id="ajouterDepotModalLabel">Ajouter dépôt</h5>
                <button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button>
            </div>

            <div class="modal-body">
                <form id="create-depot-form" method="POST">
                    @csrf
                    @method('POST')
                    <div class="form-group">
                        <label for="nom_fournisseur_depot">Nom fournisseur</label>
                        <input type="text" class="form-control" id="nom_fournisseur_depot" name="nom_fournisseur_depot" placeholder="Nom fournisseur" required>
                    </div>

                    <div class="form-group">
                        <label for="prenom_fournisseur_depot">Prénom fournisseur</label>
                        <input type="text" class="form-control" id="prenom_fournisseur_depot" name="prenom_fournisseur_depot" placeholder="Prénom fournisseur" required>
                    </div>

                    <div class="form-group">
                        <label for="telephone_fournisseur_depot">N°Téléphone fournisseur</label>
                        <input type="text" class="form-control" id="telephone_fournisseur_depot" name="telephone_fournisseur_depot" placeholder="N°Téléphone fournisseur" required>
                    </div>

                    <div class="form-group">
                        <label for="email_fournisseur_depot">Email fournisseur</label>
                        <input type="text" class="form-control" id="email_fournisseur_depot" name="email_fournisseur_depot" required>
                    </div>

                    <div class="form-group">
                        <label for="date_depot">Date dépôt</label>
                        <input type="date" class="form-control" id="date_depot" name="date_depot" placeholder="Date dépôt" required>
                    </div>

                    <div class="form-group">
                        <label for="num_ordre_depot">Numéro ordre</label>
                        <input type="number" class="form-control" id="num_ordre_depot" name="num_ordre_depot" placeholder="Numéro ordre" required>
                    </div>

                    <input type="number" id="dossier_id_depot" name="dossier_id_depot">

                </form>
            </div>

            <div class="modal-footer">
                <button type="button" class="btn btn-secondary" data-bs-dismiss="modal">Fermer</button>
                <button type="submit" class="btn btn-primary" id="create-depot-btn">Ajouter dépôt</button>
            </div>

        </div>
    </div>
</div>

这里是 DepotController 中的存储函数：

public function store(Request $request)
    {
        $validatedData = $request->validate([
            'nom_fournisseur_depot' => 'required',
            'prenom_fournisseur_depot'=> 'required',
            'telephone_fournisseur_depot' => 'required',
            'email_fournisseur_depot' => 'required',
            'date_depot' => 'required',
            'num_ordre_depot' => 'required',
            'dossier_id_depot' => 'required',
        ]);

        $depot = Depot::create($validatedData);

        return response()->json(['depot' => $depot]);

    }

这是路线：

"Route::post('/depots', 'App\Http\Controllers\Prequalification\DepotController@store')->name('depots.store');"

显示表格但未插入数据。我总是收到我定义的错误消息。请问有什么解决办法吗？