首页 > 解决方案 > 如何将数据从按钮传递到模态 laravel 8

问题描述

我无法从所选产品中传递数据,我使用 jquery 传递数据,但是当模式打开时没有显示

在此处输入图像描述

<div class="modal fade" id="product" tabindex="-1" aria-labelledby="exampleModalLabel" aria-hidden="true">
  <div class="modal-dialog">
    <div class="modal-content">
      <div class="modal-header">
        <h5 class="modal-title" id="exampleModalLabel">Agregar producto</h5>
        <button type="button" class="close" data-dismiss="modal" aria-label="Close">
          <span aria-hidden="true">&times;</span>
        </button>
      </div>
      <div class="modal-body"> 
  
 
    <form method="PUT" action="productos">
    @csrf     
     <div class="form-group">
         <label>Name</label>
         <input type="text" class="form-control" id="name" name="name" required >
     </div>
     <div class="form-group">
        <label >description</label>
        <input type="text" class="form-control" id="description" name="description" required>
    </div>    
  </form>


  <script>
  $('#product').on('show', function(e) {
    var link     = e.relatedTarget(),
        modal    = $(this),
        name = link.data("name"),
        description    = link.data("description");

    modal.find("#name").val(name);
    modal.find("#description").val(description);
});
  </script>

<script src="https://code.jquery.com/jquery-3.5.1.slim.min.js" integrity="sha384-DfXdz2htPH0lsSSs5nCTpuj/zy4C+OGpamoFVy38MVBnE+IbbVYUew+OrCXaRkfj" crossorigin="anonymous"></script>
<script src="https://cdn.jsdelivr.net/npm/bootstrap@4.6.0/dist/js/bootstrap.bundle.min.js" integrity="sha384-Piv4xVNRyMGpqkS2by6br4gNJ7DXjqk09RmUpJ8jgGtD7zP9yug3goQfGII0yAns" crossorigin="anonymous"></script>

@endsection

这就是我按下编辑按钮时的样子

在此处输入图像描述

我怎样才能解决这个问题?或者为什么我的 jquery 不工作我尝试使用另一个选项,比如在数据目标中放这个data-target="#product-model-{{ $product }}但不起作用。

标签: jquerylaravelmodal-dialog

解决方案


推荐阅读