Note that there are some explanatory texts on larger screens.

plurals
  1. POmootools event listener disappears after element.innerHTML is changed
    text
    copied!<p>I putting together a page that will display a set of stored values. I am using mootools and AJAX calls to update the values without needing to refresh the page each time the user selects a new item from the drop down menus.</p> <p>the HTML each line looks something like:</p> <pre><code>&lt;div class="selections"&gt; &lt;input class="checkbox selector" type="checkbox" CHECKED /&gt; &lt;span class="b_name"&gt; &lt;select class="b_n selector"&gt; &lt;!-- options --&gt; &lt;/select&gt; &lt;/span&gt; &lt;span class="b_level"&gt; &lt;select class="b_l selector"&gt; &lt;!-- options --&gt; &lt;/select&gt; &lt;/span&gt; &lt;span class="values"&gt; &lt;!-- the values --&gt; &lt;/span&gt; </code></pre> <p></p> <p>In the head I have set up an event listener like:</p> <pre><code> $$('.selector').addEvent('change', function(event){changeValues(this);}); </code></pre> <p>My problem is that when the "b_name" select changes I have to update the list of options in the "b_level" select. I accomplish that by getting a list of the possible options from my database through a php script on another page and replacing "b_level"'s innerHTML. Once I do that, the event listener attached to "b_l selector" no longer works.</p> <p>I tried to resolve this issue by explicitly attaching an event listener to "b_l selector" each time "b_name" changes like so:</p> <pre><code> row.getElement('.b_l').addEvent('change', function(event){changeValues(row.getElement('.b_l'));}); </code></pre> <p>where 'row' is the html element 'div.selections'.</p> <p>It still isn't working and I have no idea what's going on. Can anyone offer a suggestion as to how I can get this resolved? or perhaps a better way to do what I'm doing.</p> <p>Thanks</p>
 

Querying!

 
Guidance

SQuiL has stopped working due to an internal error.

If you are curious you may find further information in the browser console, which is accessible through the devtools (F12).

Reload