jQuery - Simple Global Variable

Question

I am learning jQuery by myself, and need a little help here, please.

I do not know why, but the "msg" variable in this code bellow is coming up empty in the end.

jQuery(function($) {
  $('#mailing').submit(function(e) {
    e.preventDefault();

    var msg = '';

    $.ajax({
      type: "POST",
      url: "ajx_mailing.asp",
      data: 'email=test@test.com',
      cache: false,
      dataType: "text",
      complete: function(data){
        if (data.responseText = 'ok') {
          msg = 'The e-mail was included with success!';
        } else {
          msg = 'There is a problem, please check the e-mail!';
        }
      },
      error: function(data) {
        msg = 'Error! Please, try again latter!';
      },
    });

    /* http://www.ericmmartin.com/projects/simplemodal/ */

    $('#simplemodal').modal({
      minWidth: 410,
      minHeight: 120,
      position: ['30%',],
      overlayId: 'msgbox-overlay',
      containerId: 'msgbox-container',
      onShow: function(dialog) {
        var modal = this;
        $('.header', dialog.data[0]).append('Mailing List');
        $('.message', dialog.data[0]).append(msg);
        $('.ok', dialog.data[0]).click(function() {
          modal.close();
        });
      }
    });

  });
});

The modal message is blank? Do you know why?

Thanks!

possible duplicate of [How to return the response from an AJAX call?](http://stackoverflow.com/questions/14220321/how-to-return-the-response-from-an-ajax-call) — Deepak Ingole, Mar 01 '14 at 02:13

Pranav C Balan · Accepted Answer · 2014-03-01T02:06:04.107

$.ajax is an asynchronous function that it may complete at any time. So value of the variable msg will change after some time, before that ()$('#simplemodal').modal({ code will be executed that's why the value is missing. So just initialize the ()$('#simplemodal').modal({ after ajax success or error

jQuery(function($) {
    $('#mailing').submit(function(e) {
        e.preventDefault();
        var msg = '';
        $.ajax({
            type: "POST",
            url: "ajx_mailing.asp",
            data: 'email=test@test.com',
            cache: false,
            dataType: "text",
            complete: function(data) {
                if (data.responseText = 'ok') {
                    msg = 'The e-mail was included with success!';
                } else {
                    msg = 'There is a problem, please check the e-mail!';
                }
                modal();
            },
            error: function(data) {
                msg = 'Error! Please, try again latter!';
                modal();
            },
        });
        /* http://www.ericmmartin.com/projects/simplemodal/ */

        function modal() {
            $('#simplemodal').modal({
                minWidth: 410,
                minHeight: 120,
                position: ['30%', ],
                overlayId: 'msgbox-overlay',
                containerId: 'msgbox-container',
                onShow: function(dialog) {
                    var modal = this;
                    $('.header', dialog.data[0]).append('Mailing List');
                    $('.message', dialog.data[0]).append(msg);
                    $('.ok', dialog.data[0]).click(function() {
                        modal.close();
                    });
                }
            });
        }
    });
});

jQuery - Simple Global Variable

1 Answers1