SitePoint Sponsor

User Tag List

Results 1 to 3 of 3

Hybrid View

  1. #1
    SitePoint Zealot
    Join Date
    May 2007
    Posts
    163
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)

    Displaying Animation After Form Submission

    Hi, I'll like to display some animation in a modal window after clicking
    the submit button and waiting for the form to process, and I'll like
    to return to the original page with a "Success" message after the
    script has ended.

    How do I do this?

    Thanks

  2. #2
    Unobtrusively zen silver trophybronze trophy
    paul_wilkins's Avatar
    Join Date
    Jan 2007
    Location
    Christchurch, New Zealand
    Posts
    14,716
    Mentioned
    103 Post(s)
    Tagged
    4 Thread(s)
    Quote Originally Posted by tentim View Post
    Hi, I'll like to display some animation in a modal window after clicking
    the submit button and waiting for the form to process, and I'll like
    to return to the original page with a "Success" message after the
    script has ended.

    How do I do this?
    Are you using a scripting library such as jQuery or ExtJs or YUI or MooTools or something else similar?
    Programming Group Advisor
    Reference: JavaScript, Quirksmode Validate: HTML Validation, JSLint
    Car is to Carpet as Java is to JavaScript

  3. #3
    SitePoint Enthusiast
    Join Date
    Mar 2010
    Posts
    82
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    If you're using jQuery, it can be done this way.

    using ajax

    Code JavaScript:
    $.ajax({                                      
    		   url: 'process.php',                         
    		   data : "",                       
    		   dataType: 'json',                   
    		   success: function(data) {
     
                                // use json_encode to print data from php file      
                              // process data		    
     
    		   } // @success end
    		 }); // @ajax end


    using load

    Code JavaScript:
    function example_ajax_request() {
    		$('#example-placeholder').html('<p><img src="ajax-loader.gif"  /></p>').each(function() {
      			setTimeout(function(){ $('#example-placeholder').load("ajax-loaded.html")}, 1000);
    		});
    	}


Bookmarks

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •