0

I got 2 Javascript functions

function populate_edit_form_template(template_container_id, tabpane_id, template_selector) {
        if (!$(tabpane_id).hasClass("has_edit_template")) {
            $(tabpane_id).addClass("has_edit_template");
            var template_content = $(template_container_id).html();
            $(tabpane_id).html(template_content);
            $(tabpane_id).find(template_selector).attr("style", "");
        }
    }

and

function get_current_form_info(tabpane_id,form_id,process_url) {
        var form_verification_data = {
            "process_type":3,
            "form_id": form_id,
        };
        $.post(process_url, form_verification_data, function (data) {
            $(tabpane_id).append(data);
        });
    }

I'm running get_current_form_info first and populate_edit_form_template next, but somehow the latter gets executed first.

I was wondering: 1. How do I always force the $.post to run first 2. Why the delay with $.post?

Thanks for everyone's time

  • `$.post` is asynchronous. It needs to wait for a response from the server at `process_url`, before it can execute it's callback (`function (data) {...`). For more info, see the dupe link. – Cerbrus Apr 10 '17 at 12:39
  • search out here https://api.jquery.com/jquery.when/ – Mudassar Zahid Apr 10 '17 at 12:41
  • I think you may want to look into asynchronous programming here. The post is probably being executed first, but the `$(tabpane_id).append(data);` line won't be executed until after the post has returned with the data. You can either pass the post the parameter "async: false", that will force the post to run synchronously, or probably a better option is to use promises, see: https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Promise – Rafael Kennedy Apr 10 '17 at 12:41
  • Awesome. Thanks everyone. – Shawn Invento Apr 10 '17 at 12:44

0 Answers0