Question

我尝试用ajax更新price属性但是它不起作用，所以我测试了如果我从响应中得到了什么但仍然没有

这是我的控制器：

public function attributePrice(Request $request){


        if ($request->has('size')) {

            return response()->json(['price'=>'ok']);


        }else {



        }
    }

这是我的脚本功能

 <script>
        $('#size').change(function () {
            $.ajax({
                type: 'GET',
                url : 'size-price',
                dataType: "json",
                data : {
                    size : document.getElementById('size').value
                },

                success:function(data){

                    $('#price').html(data.price);



                }


            });
        });
    </script>

最后这里是我想要更新id = price

价格的地方

<div class="col-md-6">
                <h2 class="text-normal">{{$product->name}}</h2><span class="h2 d-block">
                <!--<del class="text-muted text-normal">$68.00</del>&nbsp; $47.60</span>-->
                    <span class="text-muted text-normal" id="price">{{$product->price}} €</span>
                    <div class="padding-top-1x"></div>
                <!--description -->
                <p>
                   {{$product->description}}
                </p>


//Specefic Price
Route::post('/size-price' , 'ProductController@attributePrice');

Answer 1

我现在经历了两次代码，没有问题！

您有专门的Ajax进程功能/控制器。

调用 attributePrice ，它应该正确返回所有内容。

并且在评论中更正了获取路线尺寸价格

我不确定你是如何在你的刀片上显示#size的，但改变事件似乎足够了。

你在问题中没有显示的唯一剩下的2件是你传递的价值，

console.log（）以下代码，检查它是否返回正确的数据。

document.getElementById('size').value

另外，检查chrome dev工具中的网络选项卡，然后按XHR，你应该看到你的ajax请求，你会找到你的链接，然后是问号，然后是size =你选择的值，就像这样

size-price?size=your-selected-value

和BTW，应该显示一个状态，这应该是发生了什么的线索。

工作代码

HTML
    <div class="panel-body">
        <select id="read-data">
                <option value="volvo">Volvo</option>
                <option value="saab">Saab</option>
                <option value="mercedes">Mercedes</option>
                <option value="audi">Audi</option>
              </select>
              <input type="text" value="">
</div>

AJAX

$('#read-data').change(function () {
        $.ajax({
            type: 'GET',
            url : 'test/read-data',
            dataType: "json",
            data : {
                size : $("#read-data").attr("value")
            },

            success:function(data){
                console.log(data);
                $("input").attr("value", data.price);
            }
        });
    });

路线

Route::get('test/read-data','AjaxController@readData');

控制器

   public function readData(Request $request){
if ($request->has('size')) {
    return response()->json(['price' => $request->size]);
} else{
    return 'no data!';
}
}

Answer 2

您必须使用ajax请求发送csrf令牌请检查以下代码：

$('#country').change(function(){
    $.ajax({
       type:'POST',
       url:"{{ url('getStates')}}",
       data: {
            country: $(this).val(),
            '_token': '{{ csrf_token() }}',
        },
       success : function(data){
            var data = JSON.parse(data);
            var option = '<option value="">--- state ---</option>';
            for(var i in data){
                option += '<option value="'+data[i].id+'">'+data[i].name+'</option>';
            }
            $("#state").html(option);
       }
    });

});

Laravel Ajax无法正常工作

2 个答案:

工作代码