CODEWITHSUNDEEP
javascriptjqueryajax
minisaurus
minisaurus

Reputation: 1196

Javascript & Ajax - better way to populate objects?

I'm an old 'C' programmer and with Javascript always struggle populating my data following ajax calls; i.e. I always resort to using global references. I'd rather be able to pass in the objects I need to update. Here's one example of what I do now - 'app' is the global (I'd have used a pointer in C :))

treeMapp.login = function ( dialog_div, form_div, server_call ) {

// validate the fields
if ( 0 ) {

}
else {
    // send to server & parse JSON response (single line)
    var jqxhr = 
        $.getJSON( server_call, 
            $( "#" + form_div ).serialize() )
            .done( function( data, status ) {

                 if( status == 'success' ) {
                     // hack!?
                     app.user.username = data.username;
                     app.user.organisation = data.organisation;
                     app.user.loggedIn = true;
                     //close the dialog
                     $( '#' + dialog_div ).dialog('close');
                 }
                 else {
                     // login failed
                     alert( "login failed!" );
                 }
            })
            .fail( function() {
                alert( "login: server error" );
        }); // end var jqxhr =

} // end else (field validation ok)   

}; // end treeMapp.login()

What's the best way of updating passed in parameters?

thanks

mini

Upvotes: 2

Views: 117

Answers (2)

vogomatix
vogomatix

Reputation: 5051

You could assign the data object returned by your jQuery result to app.user, thus avoiding the need for element by element assignment.

i.e. app.user = data

However, normally you ensure the global object can self initialise through a method, or you pass a reference to the global object to the method so it can initialise. Directly using assignment to global variables is (with a few exceptions) poor programming in Javascript as in any other language

UPDATE: the following shows an amalgamation of the answers...

treeMapp.login = function ( dialog_div, form_div, server_call, theapp ) {
    var app = theapp; // may be needed for scope issue..

// validate the fields
if ( 0 ) {

}
else {
    // send to server & parse JSON response (single line)
    var jqxhr = 
        $.getJSON( server_call, 
            $( "#" + form_div ).serialize() )
            .done( function( data, status ) {

                 if( status == 'success' ) {
                     // not a hack
                     $.extend(this.app.user, data, { loggedIn: true })
                     //close the dialog
                     $( '#' + dialog_div ).dialog('close');
                 }
                 else {
                     // login failed
                     alert( "login failed!" );
                 }
            })
            .fail( function() {
                alert( "login: server error" );
        }); // end var jqxhr =

} // end else (field validation ok)   

}; // end treeMapp.login()

Upvotes: 0

Samuel
Samuel

Reputation: 2156

You can pass app as an argument to your treeMapp.login function, then within the scope of it it would be local.

treeMapp.login = function ( dialog_div, form_div, server_call, app )

Upvotes: 2

Related Questions