jquery - 我正在使用 laravel 5.4 并使用 ajax 提交

问题描述

laravel 表单代码

 @foreach($products as $product) <form action="{{ url('/cart/add') }}" method="post">
                      {{ csrf_field() }}
                      <input type="text" name="img" value="{!! $product->product_image !!}" id="img{!! $product->product_image !!}">
                      <input type="text" name="price" value="{!! $product->product_price !!}" id="price{!! $product->product_price !!}">
                      <input type="text" name="name" value="{!! $product->product_name !!}" id="pro_name{!! $product->product_name !!}">
                      <input type="text" name="id" value="{!! $product->id !!}" id="pro_id{!! $product->id !!}"><br>
                      <!--<input id="form-control" type="number" max="10" min="1" class="form-control" name="qty" value="1">-->
                      <div class="col-lg-1"></div>
                      <div class="col-lg-3 col-xs-4">
                        <select class="select_val" id="form-control{!! $product->id !!}" name="qty" >
                          <option value="1">1</option>
                          <option value="2">2</option>
                          <option value="3">3</option>
                          <option value="4">4</option>
                          <option value="5">5</option>
                          <option value="6">6</option>
                          <option value="7">7</option>
                          <option value="8">8</option>
                          <option value="9">9</option>
                          <option value="10">10</option> 
                        </select>
                      </div>
                      <div class="col-lg-3 col-xs-6">
                        <button type="submit" class="btn btn-primary" id="addtocart<?php echo $product->id ?>">
                            <i class="fa fa-shopping-cart"></i> &nbsp;Add-to-cart
                        </button>
                      </div>
                    </form>
     @endforeach

javascript代码

jQuery(document).ready(function() {

 @foreach($products as $product) 

      jQuery('#addtocart{!! $product->id !!}').on('click',function(e){

            $.ajaxSetup({
                         headers: {
                        'X-CSRF-TOKEN': 
                         $('meta[name="_token"]').attr('content')
                  }
            });

            e.preventDefault();

        var  pro_name  = $('#pro_name{!! $product->product_name !!}').val();

        var  id   = $('#form-control{!! $product->id !!}').val(); 

        var  image  = $('#img{!! $product->product_image !!}').val();

        var  price  = $('#price{!! $product->product_price !!}').val();

         alert("qty-"+id+"-"+pro_name+"-"+"-"+image+"-"+price);

jQuery.ajax({ url:'{{ url("/cart/add") }} ', 方法: 'post',
数据: { 令牌:token, 名称: pro_name, 数量: 数量, img: 图片, 价格:价格
}，成功：函数（数据）{控制台.日志（数据）；}

        });         

      }); 
    @endforeach   
 });`

这是我的表格

另一个图像是警告框

i am not getting proper value price and image name in alert box

我正在使用 laravel 5.4 并使用 ajax 提交

如何摆脱这个错误

标签： jqueryajaxlaravel-5

读取循环，获取与表单相关的输入

jQuery(document).ready(function() {

      jQuery('[id^="addtocart"]').on('click',function(e){

            $.ajaxSetup({
                         headers: {
                        'X-CSRF-TOKEN': 
                         $('meta[name="_token"]').attr('content')
                  }
            });

            e.preventDefault();

        var  pro_name  = $(this).closest('form').find('[id^="pro_name"]').val();

        var  qty =  $(this).closest('form').find('[id^="form-control"]').val(); 

        var  image  =  $(this).closest('form').find('[id^="img"]').val();

        var  price  =  $(this).closest('form').find('[id^="price"]').val();

         alert("qty-"+qty+"-"+pro_name+"-"+"-"+image+"-"+price);

      });  
 });`

jquery - 我正在使用 laravel 5.4 并使用 ajax 提交

问题描述

解决方案

推荐阅读