Rails spinoffs - Jul 2007 - Draggable stops working after Ajax.Updater

I have a div that contains an input text field that is filled with
the Ajax.autocompleter function.  Below this field I have a div called
"foo".  I use Ajax.Updater to load a page into that div.  The page
that gets loaded into the foo div loads five divs that I make
draggable.  These work great.
  The problem comes when I pull up something with the
Ajax.autocompleter.  This function uses the afterUpdateElement
parameter that calls a function.  This function calls a Ajax.Updater
function that calls the page into the foo div but passes in a
variable.  The page loads fine and the variable passed causes it to
grab a single div which is made draggable.  The only thing is that it
won''t drag.  All the code is ran (I know this from firebug and
variously placed alerts that I put in) but I can''t drag.  The page
that is being loaded the second time is the exact same one as the
first time but has a variable passed to it.
  What am I missing?  Thanks for any help.


--~--~---------~--~----~------------~-------~--~----~
You received this message because you are subscribed to the Google Groups
"Ruby on Rails: Spinoffs" group.
To post to this group, send email to
rubyonrails-spinoffs-/JYPxA39Uh5TLH3MbocFFw@public.gmane.org
To unsubscribe from this group, send email to
rubyonrails-spinoffs-unsubscribe-/JYPxA39Uh5TLH3MbocFFw@public.gmane.org
For more options, visit this group at
http://groups.google.com/group/rubyonrails-spinoffs?hl=en
-~----------~----~----~----~------~----~------~--~---

I am a bit confused at the terminology of "page",  I take it that you
mean you''re inserting HTML into the foo div?

It could be a lot of things some example code would be extra helpful
in this complex situation.

You could be recreating the div that you attached the draggable
functionality to by using the innerHTML property, thus it looks the
same but in Javascript world it is a completely new object, even if it
does have the same Id.  You''ll have to re-instatiate that div as a
Draggable object upon refreshing the foo div.

Cheers,
        Matt

On Jul 27, 12:15 pm,
"nlehma...-Re5JQEeQqe8AvxtiuMwx3w@public.gmane.org"
<nlehma...-Re5JQEeQqe8AvxtiuMwx3w@public.gmane.org>
wrote:
>   I have a div that contains an input text field that is filled with
> the Ajax.autocompleter function.  Below this field I have a div called
> "foo".  I use Ajax.Updater to load a page into that div.  The
page
> that gets loaded into the foo div loads five divs that I make
> draggable.  These work great.
>   The problem comes when I pull up something with the
> Ajax.autocompleter.  This function uses the afterUpdateElement
> parameter that calls a function.  This function calls a Ajax.Updater
> function that calls the page into the foo div but passes in a
> variable.  The page loads fine and the variable passed causes it to
> grab a single div which is made draggable.  The only thing is that it
> won''t drag.  All the code is ran (I know this from firebug and
> variously placed alerts that I put in) but I can''t drag.  The page
> that is being loaded the second time is the exact same one as the
> first time but has a variable passed to it.
>   What am I missing?  Thanks for any help.

--~--~---------~--~----~------------~-------~--~----~
You received this message because you are subscribed to the Google Groups
"Ruby on Rails: Spinoffs" group.
To post to this group, send email to
rubyonrails-spinoffs-/JYPxA39Uh5TLH3MbocFFw@public.gmane.org
To unsubscribe from this group, send email to
rubyonrails-spinoffs-unsubscribe-/JYPxA39Uh5TLH3MbocFFw@public.gmane.org
For more options, visit this group at
http://groups.google.com/group/rubyonrails-spinoffs?hl=en
-~----------~----~----~----~------~----~------~--~---

> I am a bit confused at the terminology of "page",  I take it that
you
> mean you''re inserting HTML into the foo div?
Yep, That is what I meant.  I''m using Ajax.Updater() to do that.

As for example code, I''ll do my best, but the code is already a little
complicated.  I''ll try to water it down a little.

Here is what is in the main page:

<body>

<table width=100%>
	<tr>
		<td align=center>Trucking Companies</td>
	</tr>
	<tr>
		<td><input type="text" id="autocomplete"
name="autocomplete_parameter"/ style="width:100%"><div
id="autocomplete_choices"
class="autocomplete"></div></td>
	</tr>
	<tr>
		<td><div id="trucksLoaded"
style="overflow:auto"></div></td>
	</tr>
</table>

<script>
function loadDefaultTrucks() {
	//ajax_loadContent(''trucksLoaded'',''traffic_trucksLoaded.php'');
	new Ajax.Updater(
		''trucksLoaded'',
		''traffic_trucksLoaded.php'',
		{
			method:''get'',
			evalScripts:true
		});
}

loadDefaultTrucks();
new Ajax.Autocompleter("autocomplete",
"autocomplete_choices",
"traffic_truckingList.php", {afterUpdateElement : getSelectionId});

function getSelectionId(text, li) {
    //alert (li.id);
	//ajax_loadContent(''trucksLoaded'',''traffic_trucksLoaded.php?
truckId=''+li.id);
	new Ajax.Updater (
		''trucksLoaded'',
		''traffic_trucksLoaded.php?truckId=''+li.id,
		{
			method:''get'',
			evalScripts:true
		});
}
</script>

</body>

This is what is on the traffic_trucksLoaded.php page:

<body>

<table width=100%>
<?
while($data = mysql_fetch_array($rs)) {
	echo"
	<tr>
		<td><div class=draggable id=".
$data[1].">".ucwords(strtolower($data[0]))."</div></td>";
				?>
				<script>
					new Draggable(''<? echo $data[1]; ?>'',
{revert:true});
				</script> <? echo "
	</tr>";
}
?>
</table>

</body>

On Jul 27, 3:28 pm, Matt Foster
<mattfoste...-Re5JQEeQqe8AvxtiuMwx3w@public.gmane.org>
wrote:
> I am a bit confused at the terminology of "page",  I take it that
you
> mean you''re inserting HTML into the foo div?
>
> It could be a lot of things some example code would be extra helpful
> in this complex situation.
>
> You could be recreating the div that you attached the draggable
> functionality to by using the innerHTML property, thus it looks the
> same but in Javascript world it is a completely new object, even if it
> does have the same Id.  You''ll have to re-instatiate that div as a
> Draggable object upon refreshing the foo div.
>
> Cheers,
>         Matt
>
> On Jul 27, 12:15 pm,
"nlehma...-Re5JQEeQqe8AvxtiuMwx3w@public.gmane.org"
<nlehma...-Re5JQEeQqe8AvxtiuMwx3w@public.gmane.org>
> wrote:
>
> >   I have a div that contains an input text field that is filled with
> > the Ajax.autocompleter function.  Below this field I have a div called
> > "foo".  I use Ajax.Updater to load a page into that div. 
The page
> > that gets loaded into the foo div loads five divs that I make
> > draggable.  These work great.
> >   The problem comes when I pull up something with the
> > Ajax.autocompleter.  This function uses the afterUpdateElement
> > parameter that calls a function.  This function calls a Ajax.Updater
> > function that calls the page into the foo div but passes in a
> > variable.  The page loads fine and the variable passed causes it to
> > grab a single div which is made draggable.  The only thing is that it
> > won''t drag.  All the code is ran (I know this from firebug
and
> > variously placed alerts that I put in) but I can''t drag.  The
page
> > that is being loaded the second time is the exact same one as the
> > first time but has a variable passed to it.
> >   What am I missing?  Thanks for any help.

--~--~---------~--~----~------------~-------~--~----~
You received this message because you are subscribed to the Google Groups
"Ruby on Rails: Spinoffs" group.
To post to this group, send email to
rubyonrails-spinoffs-/JYPxA39Uh5TLH3MbocFFw@public.gmane.org
To unsubscribe from this group, send email to
rubyonrails-spinoffs-unsubscribe-/JYPxA39Uh5TLH3MbocFFw@public.gmane.org
For more options, visit this group at
http://groups.google.com/group/rubyonrails-spinoffs?hl=en
-~----------~----~----~----~------~----~------~--~---