I switched the .click event with .live(click), and it sort of works
now.  The problem with the parentMenu not updating is now ok.  When I
click the navigation links, the parentMenu now updates with new items
and is clickable.  The problem now is still with the childMenu.  I can
see in the .js file from the browser, that the HTML being written
during the click event is this:

var modelHTML = "<option id='"+model+"' value='"+model+"'
class='childMenu'>" +model+ "</option>";

However, when I inspect the item with firebug, it's not showing the
class attribute for each of the items.  This is probably why it's not
triggering the function.  What would cause this from writing the class
attribute?

On Dec 8, 6:21 pm, "T.J. Simmons" <theimmortal...@gmail.com> wrote:
> This is somewhere in the jQuery documentation, but use .live("click",  
> function(){
>
> instead of .click(function(){
>
> to delegate the function to all matched elements on the page and  
> loaded in via AJAX or otherwise.
>
> Hope that helps.
>
> T.J. Simmons
> Sent from my iPhone
>
> On Dec 8, 2009, at 5:28 PM, rob <rob.sche...@gmail.com> wrote:
>
> > I built a little utility modeling a linked menus concept... Click an
> > item in the parent menu, and the child menu will update.
>
> > When a parent option is selected the childMenu is reloaded with new
> > <options>.  Selecting these no longer triggers $("#childMenu >
> > option").click(function(){});  Does anyone have any idea why this may
> > be happening?
>
> > Here's an example:
>
> > $(".parentMenu").click(function(){
> >    var s = $("#parentMenu :selected").text();
>
> >    $.ajax({
> >        type: 'GET',
> >        url: 'xml/file.xml',
> >        datatype: 'xml',
> >        success: function(xml){
>
> >            alert(s);  //this is displaying correctly
>
> >            $('#childMenu').empty();
>
> >            $(xml).find("series[name='"+s+"']).each(function(){
> >                $(this).find("model").each(function(){
> >                    var model = $(this).text();
> >                    var modelHTML = "<option id='" +model+ "'
> > value='"+model+"'>" +model+ "</option>";
> >                    $("#childMenu").append(modelHTML);
> >                });
> >            });
>
> > });
>
> > alert(s) will show when the menu is the original content (whether it
> > is parentMenu or childMenu), but once that content is changed with
> > something else, it no longer works.
>
> > Any help would be greatly appreciated.

Reply via email to