AJAX with HTML data return

4

I have an AJAX function:

function userCheck() {
    var username = $("#username").html();
    var userid = $("#balmung-id").val();
    $.ajax({
        url: "systems/usercheck.php",
        type: 'POST',
        data: {
            username: username,
            userid: userid
        },
        beforeSend: function() {
            $("#loaderror").hide();
            $("#loader").show();
        },
        success: function(result) {
            $("#loader").hide();
            $("#user-painel-2").html(result);
        },
        error: function() {
            $("#loader").hide();
            $("#loaderror").show();
        },
        timeout: 5000
    });
}

It sends data and the return is done through a echo in PHP :

echo '<div id="userReturn">"'.$valor.'"</div>';

This div will be inserted into a menu, as specified in% AJAX%:

success: function(result) {
                $("#loader").hide();
                $("#user-painel-2").html(result);
            }

Should I always use return in JSON , or can I continue doing this in a smooth way? What is the difference between using the data return in JSON and not HTML ?

    
asked by anonymous 22.12.2016 / 12:27

3 answers

8

JSON is a standard format for structuring data, as is XML. Using it favors interoperability and also reusability.

Assuming you have this return in JSON, you can use it on multiple pages and on different markup structures, as long as you treat this JSON and do whatever you want with it. The direct return in HTML gets you that way, and you will not have much freedom to handle this data when they get to your pages.

In short, JSON allows for more flexibility, but comes at the cost of having to handle the data. HTML is less flexible, but it's more practical, it's ready for use.

I particularly prefer flexibility, so I have preference for returns in JSON (or XML).

    
22.12.2016 / 12:44
3

Basically, you are giving back in unnecessary data when you return directly with HTML ready, let's imagine a scenario where your return has approximately 1000 lines like this:

<div id="userReturn">"'.$valor.'"</div>

This echo would be repeated 1000x which would make the return heavy because it is carrying more data.

If you do return in JSON you would be returning only the values to be added in the div, so you would be transferring less data, and the response to your request would be faster and will not require much of the server, since you receives these values with JS you can process and create the divs within a loop. You will have the same content being served faster and will improve the performance of your application and consume less data. Using JSON you can manipulate this data any way you want it, if you want to store it to use in different functions as well and on different pages you can, if you return HTML you will be limited.

If it is only for a simple data return of a few lines, I do not see any big problems in using direct return as HTML text, but if it is for a large application with large numbers of lines I recommend using JSON

    
22.12.2016 / 12:53
0

Well, actually what you are returning is a text and then the browser will understand that it is html. I do not know the purpose of your return, whether it's just to show a value, or something like that. The most normal (right) is that you always go back into JSON, then turn that text into JSON into an object and do what you want. The difference is that JSON is something sure to do, why it was done for data return, and not html. If you want to return the value within that div, leave the div in hide within the user-panel-2, and when you give success, you put the result inside the div and have it appear.

    
22.12.2016 / 12:40