I'm building an collapsible table using bootstrap or jquery ui. Basically, when a user clicks on a row in a simpleresultstable it will use an accordion to then show additional details of an event. I tried implementing this with bootstrap, but there seems to be a conflict with the jquery libraries.
I then switched to using jquery directly, but it only partly works. Basically, it tries to show the accordion. Again it looks like some conflict with simpleresultstable. Has anyone ran into this before or has a work example.
My example, is based on http://jsfiddle.net/Xqk3m/ and http://stackoverflow.com/questions/9026867/jquery-accordion-effect-on-a-table
When I copy the code that is rendered in Splunk and past that in jfiddle it works.
Here is what I put in the application.js
$('tbody tr').each(function() {
posReference = $(this).find("td.pos").text();
$(this).addClass("accordion");
detail = $(this).find('td[field="detail"]').html();
$(this).append('<tr><td colspan="6" class="hiddenRow"><div class="accordian-body collapse" id="hidden' + posReference + '"><p>' + detail + '</p></div></td></tr>');
$(this).show();
$(this).nextAll("tr").hide();
$(this).click(function(){
$(this).nextAll("tr").fadeToggle(1000);
}).eq(0).trigger('click');
});
... View more