3
\$\begingroup\$

JavaScript is the language everyone uses without bothering to learn it first, and I'm no exception. I'm trying to set up autorefresh with longpolling. What I have on the client side is the following:

var getAjaxer = function(element) {

    return function() {
        $.ajax({
            url: "/path/to/resource",
            success: function(response) {
                element.html(response);
            },
            dataType: "html",
            timeout: 10000,
            type: "POST",
            complete: arguments.callee
        });
    };
}

var startAjaxing = function() {
    myajaxer = getAjaxer($("#myid"));
    myajaxer();
}

$(startAjaxing);​

This works, but I'm worried I might be doing it all wrong. Could I get some pointers on how I could use the language more effectively?

\$\endgroup\$
1
\$\begingroup\$

I can't say whether yours is right or wrong but there were a couple of things that seemed odd to me.

I wouldn't add functions to variables unless you intend to use them more than once. (or it adds to the readability)

var startAjaxing = function() {
    myajaxer = getAjaxer($("#myid"));
    myajaxer();
}

$(startAjaxing);

then becomes:

$(function() {
    getAjaxer($("#myid"))();
}); // Start ajaxing

Also I would get rid of arguments.callee and get the element every time:

var getAjaxer = null;
getAjaxer = function(elementid) {
    return function() {
        $.ajax({
            url: "/path/to/resource",
            success: function(response) {
                $("#" + elementid).html(response);
            },
            dataType: "html",
            timeout: 10000,
            type: "POST",
            complete: getAjaxer(elementid);
        });
    };
}

To ME this seems easier to read butt it may be only a matter of taste. (PS. I didn't check this for syntax errors etc.)

If you don't want to create functions every time?

getAjaxer = function(elementid) {
    var elementAjaxer = $("#" + elementid).data("ajaxer");
    if(elementAjaxer == null){
        elementAjaxer = function() {
            $.ajax({
            // etc etc
            });
        };
        $("#" + elementid).data("ajaxer", elementAjaxer);
    }
    return elementAjaxer;
}
\$\endgroup\$

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service, privacy policy and cookie policy

Not the answer you're looking for? Browse other questions tagged or ask your own question.