Showing an 'In Progress' Animation

Our next step is to show an image to the user to indicate that the search is in progress. Of course you can put any mark-up you like in the "Busy" case, but we're going to show an animated image to give the user a sense of something happening. An image is attached to this page, and you will need to copy it to the same directory as your form. Then replace the text in the case with an img tag:

        <xf:case id="case-busy">
          <img src="spinner.gif" alt="Busy" />
        </xf:case>

Since we've already configured this case to be toggled when a submission begins, the user will see the animated image the moment they press the "Find" button.