karl, thanks for your help. you make it seem so easy...
On May 6, 10:33 pm, Karl Swedberg <[EMAIL PROTECTED]> wrote:
> Hi Bob,
>
> I'd probably just do this without the ajaxStart and ajaxStop methods.
> Try this:
>
> $("#contests ul li span a").toggle(
> function(){
> //store ref to toggling element for use in ajax callbacks...
> var lnk = $(this);
> var url_title = lnk.html();
> lnk.html("loading..."); // just before the stuff is loaded
> $(".contest-form-" + this.name).load(this.href, function() {
> lnk.html(url_title); // after the stuff is loaded
> }).show();
> return false;
> },
> function(){
> $(".contest-form-" + this.name).hide("fast");
> return false;
> }
> );
>
> --Karl
> _________________
> Karl Swedbergwww.englishrules.comwww.learningjquery.com
>
> On May 6, 2008, at 6:34 AM, bobh wrote:
>
>
>
> > I'm afraid the behaviour is still there using your code. I've updated
> > my example page with it.
>
> > On May 6, 12:25 am, Wizzud <[EMAIL PROTECTED]> wrote:
> >> The problem is the context of 'this' within the ajaxStart() and
> >> ajaxStop() functions.
>
> >> try this instead...
>
> >> $("#contests ul li span a").toggle(
> >> function(){
> >> //store ref to toggling element for use in ajax callbacks...
> >> var lnk = $(this);
> >> var url_title = lnk.html();
> >> lnk.ajaxStart(function(){
> >> lnk.html("loading...");
> >> }).ajaxStop(function(){
> >> lnk.html(url_title);
> >> });
> >> $(".contest-form-" + this.name).load(this.href).show();
> >> return false;
> >> },
> >> function(){
> >> $(".contest-form-" + this.name).hide("fast");
> >> return false;
> >> }
> >> );
>
> >> On May 5, 2:26 pm, bobh <[EMAIL PROTECTED]> wrote:
>
> >>> hi,
>
> >>> I'm trying to change the innerHtml of an anchor to "loading" for the
> >>> duration of an ajax load with this code:
>
> >>> $("#contests ul li span a").toggle(
> >>> function(){
> >>> var url_title = $(this).html();
> >>> $(this).ajaxStart(function(){$
> >>> (this).html("loading...");}).ajaxStop(function(){$
> >>> (this).html(url_title);});
> >>> $(".contest-form-" +
> >>> this.name).load(this.href).show();
> >>> return false;
> >>> },
> >>> function(){
> >>> $(".contest-form-" + this.name).hide("fast");
> >>> return false;
> >>> }
> >>> );
>
> >>> both the ajax load and the text replacing work fine. the problem
> >>> however is that all links that have been clicked are getting the
> >>> "loading" innerHtml. in stead of only the one that is clicked on.
> >>> for
> >>> clarification I've put an example page online
> >>> here:http://allnighters.net/jq/
> >>> .
> >>> try clicking a few different links.
>
> >>> thanks
