Databases
StackOverflow2013
Postsdbo
PO
Body
 

Note that there are some explanatory texts on larger screens.

plurals
  1. PO
    text
    copied!<p>First thing, get rid of those tables in the h3's. Use divs with css:</p> <pre><code>&lt;style&gt; .ui-accordion2-header .tools{ position: absolute; right: 10px; top: 10px; width: 345px; } .ui-accordion2-header .tools a { width: auto; display: inline; } &lt;/style&gt; &lt;div id="accordion" class="ui-accordion2-group"&gt; &lt;h3 class="ui-accordion2-header" data-sectionid="1"&gt; &lt;a href="#"&gt;Section Title&lt;/a&gt; &lt;div class="tools"&gt; &lt;a href="#" class="newactivity"&gt;New Activity&lt;/a&gt; &lt;a href="#" class="edit"&gt;Edit&lt;/a&gt; &lt;a href="#" class="delete"&gt;Delete&lt;/a&gt; &lt;/div&gt; &lt;/h3&gt; &lt;div&gt; &lt;p&gt;Mauris mauris ante, blandit et, ultrices a, suscipit eget, quam.&lt;/p&gt; &lt;/div&gt; &lt;/div&gt; </code></pre> <p>Second, No need to add events inline do it up at the top:</p> <pre><code>&lt;script type="text/javascript"&gt; $(function() { $("#accordion").accordion({ alwaysOpen: false, active: false, autoheight: false, clearStyle: true }).find('.tools a').click(function(ev){ ev.preventDefault(); ev.stopPropagation(); var $obj = $(this); var sectionid = $obj.closest('h3').attr('data-sectionid'); if ($obj.hasClass('newactivity')){ toggel_new_activity(sectionid); } else if ($obj.hasClass('edit')){ edit(sectionid); } else if ($obj.hasClass('delete')){ delete(sectionid); } }); }); &lt;/script&gt; </code></pre> <p>ev.preventDefault() prevents the normal things that happen when you click an "a" tag from happening. ev.stopPropaggation() prevents the click event from getting to the according and toggling the status of the section</p> <p>The rest just figures out the id for the current section and makes the correct function call based on what link was clicked.</p>
 

Querying!

 
Guidance
An individual column

Larger individual text columns get their own page to allow for proper reading.

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