Monday, September 29, 2008

[jQuery] Re: Content Loading Question

I know what your saying, but my javascript skills are not that great.

I've changed my code a bit more to look something like this:

\$('html').click(function(e) {
if ( \$(e.target).is('#query_button') ){
\$("#loading").toggle();
var store = \$("select#store").val();
var dept = \$("select#dept").val();
\$("#query").load('content.cgi', {storeselect: store, deptselect:
dept});
\$("#loading").toggle();
}
if ( \$(e.target).is('.view-button') ){
\$("#loading").toggle();
var invoice = \$(e.target).attr('id');
var store = \$("select#store").val();
var dept = \$("select#dept").val();
\$("#query").load('content.cgi', {storeselect: store, deptselect:
dept, invoiceselect: invoice});
\$("#loading").toggle();
}
if ( \$(e.target).is('.btn-slide') ){
\$("#panel").slideToggle("slow");
\$(this).toggleClass("active"); return false;
}

});

I'm still getting the same results, but I think I'm almost there. (The
last statement doesnt need to have the loading effect.)

On Sep 29, 3:42 pm, Paul Mills <paul.f.mi...@gmail.com> wrote:
> If I understand this - you are trying add the class 'grid-loading'
> when the button is clicked and remove it when the query completes.
> If so, then the removeClass command needs to be in the callback
> function of the .load command.
>
> Paul
>
> On Sep 29, 4:11 pm, "thertze...@gmail.com" <thertze...@gmail.com>
> wrote:
>
> > Hello,
>
> > I'm trying to make a div give me a nice loading graphic on top of my
> > data so the user knows the page is working on their request.
>
> > I have the following code, however it seems it either happens to
> > quickly or the event isn't working as expected.
>
> >         \$("#query_button").click(function(){
> >                 \$('#query').addClass('grid-loading');
> >                 var store = \$("select#store").val();
> >                 var dept = \$("select#dept").val();
> >                 \$("#query").load('content.cgi', {storeselect: store, deptselect:
> > dept});
> >                 \$('#query').removeClass('grid-loading');
>
> >         });
>
> > Anyone see what I'm doing wrong here?
>
>

No comments: