Javascript - Json使用codeigniter从表中获取值

Question

I am new in ajax and json. and in my select option i have list of products there. and if i press any of the product it will show its price and the supplier. but what happened to my code is it shows both product and supplier but not in there specific fields. Here is the Example
The 550.00 is the price and asdadsadsadsadsadsad there is the name of the supplier. so the output must be in their specific fields.

JAVASCRIPT

    $("#prod-names").change(function(){
    var prodid = $("#prod-names option:selected").attr("value");
    $.ajax({
        url: "http://localhost:800/client_ayos/administrator/createpromoajax/"+prodid,
        type: "POST",


        success: function(data){
            console.log(data);
            var json = JSON.parse(data);

            $("#orig-price").val(json); //val =  value of #orig-price
            $("#supplier").val(json); //val =  value of #orig-price

        },
        error: function (jqXHR, textStatus, errorThrown){
                    alert('Error !');
                }
    })
});

CONTROLLER

    public function createpromoajax($id){
    //echo json_encode($this->uri->segment(3));
    $data['productid'] = $this->AdminModel->get_prodid($id);

    $price = $data['productid']->price;
    $supplier = $data['productid']->supplier;

    $ajaxproduct = array(
        $data['productid']->price,
        $data['productid']->supplier,
        );


    echo json_encode($ajaxproduct);

}

PS: I've also encountering this kind of error but still it shows the correct output but not in the specific fields

VM13100:1 Uncaught SyntaxError: Unexpected token < in JSON at position 0

Thanks in advance.

Answer 1

i think there is a lot to simplify your controller and js structure try something like that

here is the php part

public function createpromoajax($id)
{
    $objProduct = $this->AdminModel->get_prodid($id);
    header('Content-Type: application/json');
    echo json_encode($objProduct);
}

and your javascript part

$("#prod-names").change(function(){

    var prodid = $("#prod-names option:selected").attr("value");
    var url = "http://localhost:800/client_ayos/administrator/createpromoajax/"+prodid;

    $.getJSON( url, function(data) {
        $("#orig-price").val(data.price);
        $("#supplier").val(data.supplier); //val =  value of #orig-price
    });
});

i'm not sure what it means "unexptected token..." but i think you already output some html before the createpromoajax function - in order to verify this you could try to call your function directly and see what your browser gets as output.