Thanya Thanya - 1 month ago 6
Ajax Question

Ajax doesn't work anymore on the prod server

I'm a web developper in a small company that decided to make its selling website in PHP5/Laravel 4.2 instead of Prestashop or anything else. The site is hosted by another company, and we don't have the liberty to make anything we'd want on the server.

I made 6 monthes ago a script in AJAX that let the user know without refreshing how high would his shipping fee and taxes cost. We're in Europe in the border of France and Switzerland, so it's really a necessity to have this script. It worked really great, until this week when I wanted to implement another script, and found out that this script didn't work anymore (for how long, I don't know).

The JS :

function shippingFee()
{
var idCountry, weight;
weight= document.getElementById('weight').value;
idCountry = document.getElementById("country").value;
$.post('ajax/shippingFee',
{idCountry: idCountry, weight: weight},
function(data){
obj = JSON.parse(data);
$('#fee).html(obj.fee);
$('#total').html(obj.total);
$('#sub').html(obj.sub);
$('#promo').html(obj.promo);
});
};


Here is my route :

Route::post('ajax/shippingFee', 'AjaxController@shippingFee');


Here's my function (not everything, just the final result) on the AjaxController:

public function shippingFee(){

//Test values, only for this example
$fee = 12;
$total = 24;
$sub = 3;
$promo = 0;

$res = ['fee'=>$fee, 'total'=>$total, 'sub'=>$sub, 'promo'=>$promo];
echo json_encode($res);
}


When I click on the button that activate the function, I have this error :

SyntaxError : unexpected token in json at position 0


And if I click on the source, I have my JSON :

{"fee": 12, "total":24, "sub":3, "promo":0}


Again, the code worked perfectly six monthes ago, and still works on localhost. Do you have any idea on what's happening ?

Thanks a lot.

Answer

Okay, I succeeded. I don't know why, but my json_encode wasn't sending a satisfying json. I tried to change the structure of my function with this :

function shippingFee()
{
        var idCountry, weight;
        weight= document.getElementById('weight').value;
        idCountry = document.getElementById("country").value;

            $.ajax({
            url: "ajax/shippingFee",
            type: "Post",
            data: {'idCountry':idCountry, 'weight':weight},
            traditional: true,
            success: function (data) {

                data = JSON.stringify(eval('('+data+')'));
                var obj= JSON.parse(data);
                $('#fee).html(obj.fee); 
                $('#total').html(obj.total);  
                $('#sub').html(obj.sub);  
                $('#promo').html(obj.promo); 
                }
            });                     
};

Thus, with the data = JSON.stringify(eval('('+data+')')); I say that this is a JSON. And my code is working like a charm. I found this solution by watching this post : Convert object string to JSON

I tried to put the dataType:"JSON" before the success, but when I did it returned an error. With contentType:"application/json" I had an error 500.

Thanks to the people who answered me :)