SitePoint Sponsor

User Tag List

Results 1 to 2 of 2
  1. #1
    SitePoint Addict
    Join Date
    Sep 2008
    Posts
    341
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)

    Swop button for loading image (Ajax)

    When performing an Ajax request I want to change the submit button into a loading image and then swop it back again when the Ajax request is complete.

    I don't want a loading image anywhere else as on mobile phones it can't always be seen due to small screen size.

    I have grabbed the event (which references the form, is that right?) and I have something like this:

    Code:
    <button type="submit" name="name_can_vary">Search</button>
    event.name_can_vary.style.visibility = 'hidden';
    //(obviously this isn't complete code but no doubt explains what I am talking about)
    ..which would hide the button and works exactly as I want to this point, but of course it does;t return when Ajax has completed or show the loading image.

    Ideally, instead of just hiding the button I want JavaScript to swop the button for the loading image. I suppose I could have extra HTML on every page that is made visible with the loading image but I would rather have JS do everything from here (saves editing all pages with submit buttons on).

    Thanks for any help.

  2. #2
    billycundiff{float:left;} silver trophybronze trophy RyanReese's Avatar
    Join Date
    Oct 2008
    Location
    Whiteford, Maryland, United States
    Posts
    13,623
    Mentioned
    6 Post(s)
    Tagged
    0 Thread(s)
    I'm not familiar with AJAX, but can't you use the readyStates to determine when to hide/show? Aka when it reaches "4" (I believe that is the end), do the JS to appear the submit button and hide the image.
    Always looking for web design/development work.
    http://www.CodeFundamentals.com


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
  •