首页 > 解决方案 > 如何通过larvavel中的ajax将div的子元素传递给控制器​​?

问题描述

我想通过 ajax 调用将 div 的子元素传递给 laravel 项目中单击按钮的控制器。

这里是div ..`

 <button type="button" id="saveForm" class="btn btn-primary float-right">Save</button>

<div class="col-9 canvas">
      <input type="text"  name="firstname" placeholder="email">
      <input type="text" name="firstname" placeholder="password" >
      <input type="button" onclick="myBtn()" value="login">
</div>

为了将元素传递给控制器​​,我使用了以下 ajax 代码..

<script>
    $(document).ready(function(){
      $("#saveForm").click(function(){
          var canvas = $(".canvas");

          $.ajax({
          url: "{{ route('save.form') }}",
          type: "post",
          data:{data:canvas},
          success: function(data){
            console.log(data);
          }
        });
      });
    });
</script>

但顺便说一句,我不能传递 div 的子元素。如何传递子元素?

标签: jqueryajaxlaravelparent-childelement

解决方案


如果您正在寻找传递 .canvas 块的 html

var canvas = $(".canvas")[0].outerHTML;

如果您正在寻找 .canvas html 的内部,那么

var canvas = $(".canvas").html();

完整代码

<script>
    $(document).ready(function(){
      $("#saveForm").click(function(){
          var canvas = $(".canvas")[0].outerHTML;

          $.ajax({
          url: "{{ route('save.form') }}",
          type: "post",
          data:{data:canvas,"_token": "{{ csrf_token() }}"},
          success: function(data){
            console.log(data);
          }
        });
      });
    });
</script>

推荐阅读