Note that there are some explanatory texts on larger screens.

plurals
  1. POHow can I write a function that relies on dynamic selectors?
    text
    copied!<p>I am writing a function to dynamically load jQuery UI accordian leaves with content. I know (think) the AJAX part works as I lifted it from another working AJAX loader I have, but the function as a whole does not work.</p> <p>The code: </p> <pre><code> function load_leaf(link){ var link = link; $.ajax({ cache : false, type : 'POST', async: false, url : 'includes/'+ link +'.php?'+ new Date().getTime(), dataType : 'text', data: { owner : '$user_id' }, success: function(msg){ $("#" + link).html(msg); console.log('Can\'t see me in Chrome, but ok in firefox !') }, error: function() { console.log($.makeArray(arguments)); }, complete: function() { console.log($.makeArray(arguments)); } }); }; $(function(){ $('.accordian').click(function(){ var link = this.getAttribute("link"); load_leaf(link); }); }); </code></pre> <p>For whatever reason this does not work. The break point seems to be this line<br> <code>$("#" + link).html(msg);</code><br> Specifically the selector, as a hard coded selector works perfectly. The link variable is correctly filled i know this as i can alert the value correctly. The link is not the problem as i replaced the whole ajax function with a simple add class and it a still did not work, it also broke at the selector. </p> <p>EDIT:<br> This is the div as printed by php:</p> <pre><code>&lt;h3 class="accordian" id="'.$tab_id.'" link="'.$tab_link.'" &gt; &lt;a href="#"&gt;'.$tab_name.'&lt;/a&gt; &lt;/h3&gt; &lt;div id="'.$tab_link.'"&gt;&lt;p&gt;Hi&lt;/p&gt;&lt;/div&gt; </code></pre> <p>The html for the first one is:</p> <pre><code> &lt;h3 class="accordian" id="accordian_manage.php" link="accordian_manage.php" &gt;&lt;a href="#"&gt;Manage Images&lt;/a&gt;&lt;/h3&gt;&lt;div id="accordian_manage.php"&gt;&lt;p&gt;Hi&lt;/p&gt;&lt;/div&gt; </code></pre>
 

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