Web Images Videos Maps News Shopping Gmail more »
Recently Visited Groups | Help | Sign in
Google Groups Home
(Newbie Question) on loading jquery functions after AJAX load
There are currently too many topics in this group that display first. To make this topic appear first, remove this option from another topic.
There was an error processing your request. Please try again.
flag
  3 messages - Collapse all  -  Translate all to Translated (View all originals)
The group you are posting to is a Usenet group. Messages posted to this group will make your email address visible to anyone on the Internet.
Your reply message has not been sent.
Your post was successful
 
From:
To:
Cc:
Followup To:
Add Cc | Add Followup-to | Edit Subject
Subject:
Validation:
For verification purposes please type the characters you see in the picture below or the numbers you hear by clicking the accessibility icon. Listen and type the numbers you hear
 
Alex  
View profile  
 More options Aug 5 2008, 12:39 pm
From: Alex <songoku...@hotmail.com>
Date: Tue, 5 Aug 2008 09:39:38 -0700 (PDT)
Local: Tues, Aug 5 2008 12:39 pm
Subject: (Newbie Question) on loading jquery functions after AJAX load
First of all sorry I might sound a like a jquery newbie, but I'm
loading a webpage with the "load" and that page contains a
"datepicker" function, this is my code:

<script type="text/javascript">
$(document).ready(function(){
    $("#loadformdiv").load("forms.asp?form=2");
    $("#loadformdiv").ajaxStop(function(){
      $(this).append(
        $('.date-picker').datePicker()
      );
    });

});

but it's taking the newly loaded page and putting the input datepicker
field at the bottom, the same goes for any jquery function I try to
load after an jquery ajax call.

Any help? Thanks


    Reply to author    Forward  
You must Sign in before you can post messages.
To post a message you must first join this group.
Please update your nickname on the subscription settings page before posting.
You do not have the permission required to post.
Mike Alsup  
View profile  
 More options Aug 5 2008, 2:14 pm
From: Mike Alsup <mal...@gmail.com>
Date: Tue, 5 Aug 2008 11:14:25 -0700 (PDT)
Local: Tues, Aug 5 2008 2:14 pm
Subject: Re: (Newbie Question) on loading jquery functions after AJAX load

Try rearranging it like this:

$(document).ready(function(){
    $("#loadformdiv").load("forms.asp?form=2", function() {
      $(this).append(
        $('.date-picker').datePicker()
      );
    });

});

You want to use the load callback to trigger your logic.  You *could*
use ajaxStop but that is less elegant and you would need to reselect
the target div because "this" is that function is the window object.

Mike


    Reply to author    Forward  
You must Sign in before you can post messages.
To post a message you must first join this group.
Please update your nickname on the subscription settings page before posting.
You do not have the permission required to post.
Alex  
View profile  
 More options Aug 5 2008, 3:53 pm
From: Alex <songoku...@hotmail.com>
Date: Tue, 5 Aug 2008 12:53:51 -0700 (PDT)
Local: Tues, Aug 5 2008 3:53 pm
Subject: Re: (Newbie Question) on loading jquery functions after AJAX load
That's excellent, although I had to use bind instead of append... and
I have no idea why :)
I have another question, if I wanted to initialize another plug in
after the datePicker, how would that be?

this is my current code:

    $("#loadformdiv").load("forms.asp?form=2", function(){
      $(this).bind(
        $('.date-picker').datePicker()
      )
    });

and I want to also start:

        $('#contactform').ajaxForm({
          beforeSubmit: function(a,f,o) {
            o.dataType = $('#uploadResponseType')[0].value;
            $('#uploadOutput').html('Submitting...');
          },
          success: function(data) {
            var $out = $('#contactdiv');
            $out.html('Form success handler received: <strong>' +
typeof data + '</strong>');
            if (typeof data == 'object' && data.nodeType)
                data = elementToString(data.documentElement, true);
            else if (typeof data == 'object')
                data = objToString(data);
            $out.append('<div><pre>'+ data +'</pre></div>');
          }
        })

Thank you in advance!


    Reply to author    Forward  
You must Sign in before you can post messages.
To post a message you must first join this group.
Please update your nickname on the subscription settings page before posting.
You do not have the permission required to post.
End of messages
« Back to Discussions « Newer topic     Older topic »

Create a group - Google Groups - Google Home - Terms of Service - Privacy Policy
©2009 Google