json ajax not working with no errors

Question

im trying to use json to retrieve some info from a php file but its not working, i dont know why and its not showing any errors. Im not getting any errors when running this, but i cant figure out what is causing this to not work. Plus nothing is showing in the console log

here is my js

$(document).on('change', 'input[name="design"]', function(){
        var val = $(this).val();

        $.ajax({
            type: 'POST',
            url: 'ajax/getdesign.php',
            data: {val:val},
            dataType: 'json',
            success: function(result){
                console.log(result.design);
                console.log(result.option);
                $('.pagepreview').html(result.design);
                $('.design-options').html(result.option);
            }
        });
    });

And here is the php

<?php

if(isset($_REQUEST)){
    $design = $_REQUEST['val'];

    if($design == '1'){

        $thedesign = '
            <div class="d1-header"></div>
            <div class="d1-sidebar"></div>
            <div class="d1-content"></div>';

        $theoptions = '
            <label>Header Color</label> <input type="color" id="header-color" />
            <label>Header Image</label> <input type="file" id="header-image" />';

    } else if($design == '2'){
        $thedesign = '
            design 2';

        $theoptions = '
            options 2';

    } else if($design == '3'){
        $thedesign = '
            design 3';

        $theoptions = '
            options 3';
    } else {
        echo "failed";
    }

    echo json_encode(array('design'=> $thedesign));
    echo json_encode(array('option'=> $theoptions));

}

header('Content-Type: application/json');
?>

Pretty sure you can only echo json_encode(...) once if you're returning json. Also, don't you need to set the headers before content? — Jason P
– Jason P, Commented Mar 18, 2014 at 18:12
really oh right, i thought you could use it all the time. So how would you display 2 lots of info from ajax then? — Daniel Lematy
– Daniel Lematy, Commented Mar 18, 2014 at 18:14
Please learn the Network Tab and then update your question with a specific issue. — MonkeyZeus
– MonkeyZeus, Commented Mar 18, 2014 at 18:44
Echo-ing two json_encode()'s is most likely your issue by the way. — MonkeyZeus
– MonkeyZeus, Commented Mar 18, 2014 at 18:46

MonkeyZeus · Accepted Answer · 2014-03-19 03:06:45Z

1

The issue is likely due to the fact you are trying two json_encode()'s in a single output:

Try merging the arrays into one output like this:

echo json_encode(array('design'=> $thedesign , 'option'=> $theoptions));

answered Mar 19, 2014 at 3:06

MonkeyZeus

20.8k4 gold badges41 silver badges83 bronze badges

Sign up to request clarification or add additional context in comments.

Comments

fuzzybear · Accepted Answer · 2014-03-18 18:41:41Z

0

try adding a error function in your ajax call, just after your success function

 error: function (msg) {
 alert(msg.responsetext);
  };

and use fiddler to capture a trace

answered Mar 18, 2014 at 18:41

fuzzybear

2,4253 gold badges27 silver badges48 bronze badges

Comments

JF it · Accepted Answer · 2014-03-19 10:07:43Z

Solved this, the first thing I was missing '' on the data variable, plus I was doing the JSON wrong, but I this works now. Is there a better way for doing this?

here is the js

 $(document).on('change', 'input[name="design"]', function(){

    var val = $(this).val();

    $.ajax({
        type: 'POST',
        url: 'ajax/getdesign.php',
        data: {'val':val},
        dataType: 'json',
        success: function(result){
            $('.pagepreview').html(result['thedesign']);
            $('.design-options').html(result['theoptions']);
        }
    });
});

here is the php

<?php
header('Content-Type: application/json');

if($_REQUEST){
    $design = $_REQUEST['val'];

    if($design == '1'){

        $response['thedesign'] = '
            <div class="d1-header"></div>
            <div class="d1-sidebar"></div>
            <div class="d1-content"></div>';

        $response['theoptions'] = '
            <label>Header Color</label> <input type="color" id="header-color" />
            <label>Header Image</label> <input type="file" id="header-image" />';

    } else if($design == '2'){
        $response['thedesign'] = '
            design 2';

        $response['theoptions'] = '
            options 2';

    } else if($design == '3'){
        $response['thedesign'] = '
            design 3';

        $response['theoptions'] = '
            options 3';
    } else {
        echo "failed";
    }

    echo json_encode($response);

}
?>

Collectives™ on Stack Overflow

json ajax not working with no errors

3 Answers 3

Comments

Comments

Comments

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

3 Answers 3

Comments

Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Linked

Related