Блог

Я хочу передать дочерний элемент div через вызов ajax контроллеру в проекте laravel, нажав на кнопку.

Здесь див … `

  <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 .
Как я могу передать дочерний элемент?

Если вы ищете для передачи html .canvas блока

 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>