Welcome to the Treehouse Community

Want to collaborate on code errors? Have bugs you need feedback on? Looking for an extra set of eyes on your latest project? Get support with fellow developers, designers, and programmers of all backgrounds and skill levels here with the Treehouse Community! While you're at it, check out some resources Treehouse students have shared here.

Looking to learn something new?

Treehouse offers a seven day free trial for new students. Get access to thousands of hours of content and join thousands of Treehouse students and alumni in the community today.

Start your free trial

JavaScript

Posted by James Moran
James Moran
7,271 Points

How to differentiate separate ajax calls?

Hi. I'm using making a call in ajax using plain text, but have decided to use separate ajax calls to update different information on the page.

How do I let the backend developer know what I want. Would I change the url? What should it be changed to? Should I add a data option? What value should I give it?

This is the current code:

$.ajax({
    url: '',
    dataType: 'text',
    type: 'GET',
    success: function (response) {
        $('#application-info #display-picture').css({
            "background": 'url("' + response + '")',
            "background-size": "contain"
        });
    },
    error: function (jqXHR, status, errorThrown) {
        alert();
    }
});

$.ajax({
    url: '',
    dataType: 'text',
    type: 'GET',
    success: function (response) {
        $('#application-info #title').html(response);
    },
    error: function (jqXHR, status, errorThrown) {
        alert();
    }
});

$.ajax({
    url: '',
    dataType: 'text',
    type: 'GET',
    success: function (response) {
        $('#application-info #sub-title').append('<p>' + response + '<p>');
    },
    error: function (jqXHR, status, errorThrown) {
        alert();
    }
});

$.ajax({
    url: '',
    dataType: 'text',
    type: 'GET',
    success: function (response) {
        $('#application-info #application-info-text .header:eq(0)').append('<p>' + response + '<p>');

    },
    error: function (jqXHR, status, errorThrown) {
        alert();
    }
});

$.ajax({
    url: '',
    dataType: 'text',
    type: 'GET',
    success: function (response) {
        $('#application-info #application-info-text .header:eq(1)').append('<p>' + response + '<p>');

    },
    error: function (jqXHR, status, errorThrown) {
        alert();
    }
});

$.ajax({
    url: '',
    dataType: 'text',
    type: 'GET',
    success: function (response) {
        $('#application-info #application-info-text .header:eq(2)').append('<p>' + response + '<p>');

    },
    error: function (jqXHR, status, errorThrown) {
        alert();
    }
});

$.ajax({
    url: '',
    dataType: 'text',
    type: 'GET',
    success: function (response) {
        $('#application-info #application-info-text .header:eq(3)').append('<p>' + response + '<p>');

    },
    error: function (jqXHR, status, errorThrown) {
        alert();
    }
});

$.ajax({
    url: '',
    dataType: 'text',
    type: 'GET',
    success: function (response) {
        $('#application-info #application-extra-info').append('<p>' + response + ' per anum<p>');
    },
    error: function (jqXHR, status, errorThrown) {
        alert();
    }
});

$.ajax({
    url: '',
    dataType: 'text',
    type: 'GET',
    success: function (response) {
        $('#application-info #application-extra-info').append('<p>' + response + '<p>');
    },
    error: function (jqXHR, status, errorThrown) {
        alert();
    }
});

Thank you for any help.

1 Answer

rydavim
rydavim
18,814 Points

Unless you're loading something from the current page, you're going to need a url. If you don't know the url you would like to request information from, you'll need to talk to the developer you're working with.

You don't need to add a data option unless you are sending data to the server.

As for the data type, this is what you're expecting from the server. A plain string of text is going to be a bit difficult to work with. Unless you know that you can't fetch a more manageable format, I would recommend finding out what data types are available to you.

I would think having that many separate calls is kind of unusual, but if you're going to I would highly recommend naming them so you can keep track of which is which. I would find it confusing to work with it as is.

Unfortunately, without more information about what you're trying to accomplish, it's difficult to give you specific answers. If you're working with another developer, I would recommend talking to them. If you're working alone, I would suggest reading through the jQuery.ajax() documentation to review all the options you have.

Please let me know if you have any other questions, and I'll do my best to help! Happy coding!

James Moran
James Moran
7,271 Points

Thanks for the great answer!

I wanted to use JSON but the backend dev I'm working with didn't understand why I'd want to do things that way. I'll try and get into contact with them and ask them what data type they want to work with.

Thanks again