Note that there are some explanatory texts on larger screens.

plurals
  1. PO
    primarykey
    data
    text
    <p>I use this function to wrap jQuery's AJAX POST function.</p> <pre><code>function POST(_url,_data,_container,success,anim) { var _loader = null var doAJAX = function() { $.post(_url,_data,success); }; if(typeof anim===undefined) { doAJAX(); } else if(_container!=null) { switch(anim) { case 'loading': _loader = $("&lt;div class='LoadingAnim' style='display:none;'&gt;&lt;/div&gt;"); _container.empty(); _loader.appendTo(_container).fadeIn('fast',doAJAX); break; case 'fade': _container.fadeOut('fast',doAJAX); break; case 'slide': _container.slideUp('fast',doAJAX); break; } } } </code></pre> <p>I add the <code>_container</code> parameter, which is the jQuery object for the div thats going to hold the content. The optional <code>anim</code> parameter can change the animation for clearing the container. Also, the loading image is achieved by inserting a div into the container after it is cleared. That div has a class that styles it to have the animated loading icon and be properly centered in its parent container. The <code>doAJAX</code> function used to be longer but I had to cut some out as it wasn't usefull to the answer, thats why it seems un-necessarily empty. If using any <code>anim</code> option besides "loading", make sure to reset the container to visible in the <code>success</code> function.</p> <p>Use is like this</p> <pre><code>POST('some-script.php',{data: values},$('#containerToPrintTo'),function(data) { //Do some error checking or get the return from data and insert it. }, 'loading'); </code></pre>
    singulars
    1. This table or related slice is empty.
    1. This table or related slice is empty.
    plurals
    1. This table or related slice is empty.
    1. This table or related slice is empty.
    1. This table or related slice is empty.
    1. This table or related slice is empty.
    1. VO
      singulars
      1. This table or related slice is empty.
    1. This table or related slice is empty.
 

Querying!

 
Guidance

SQuiL has stopped working due to an internal error.

If you are curious you may find further information in the browser console, which is accessible through the devtools (F12).

Reload