Can't use "accordion-toggle" inside emdeded form

I want to use “accordion-toggle” and “accordian-body collapse” ( bootstrap classes) to add detailed information ro my table as i know i can use bootstrap class and elements inside camunda forms but this one doesn’t work for me and i can’t see any errors in console too, what should i chage to add this show detail function to my table form?

<form role="form">   
<script  cam-script type="text/form-script">

   var  persons = $scope.persons = [
        {
           "id": 1,
           "name": "pda",
           "age":"454",
           "description":"this is  simple name"
          
       } ,
       {
           "id": 1,
           "name": "pda2",
            "age":"4543",
           "description":"this is  simple name"
          
       }
       ];
   camForm.on('form-loaded', function() {
	      camForm.variableManager.createVariable({
	        name: 'persons',
	        type: 'Array',
	        value: persons
	      });
 });

</script>

<div class="container">
<table class="table table-condensed" style="border-collapse:collapse;">

    <thead>
        <tr><th>&nbsp;</th>
            <th>id</th>
            <th>name</th>
            <th>age</th>
        </tr>
    </thead>

    <tbody ng-repeat="item in persons">
       <tr data-toggle="collapse" data-target="#demo3" class="accordion-toggle">
            <td><button class="btn btn-default btn-xs"><span class="glyphicon glyphicon-eye-open"></span></button></td>
            <td>{{item.id}}</td>
            <td>{{item.name}}</td>
            <td>{{item.age}}</td>
        </tr>
         <tr>
            <td colspan="6" class="hiddenRow"><div id="demo3" class="accordian-body collapse">{{item.description}}</div></td>
        </tr>
    </tbody>
</table>
</div>
</form>

Hi,

perhaps this thread may be of interest. Im not an expert on the latest Bootstrap etc, however is your syntax correct?

regards

Rob

1 Like

Hi @Webcyberrob , thank you for your answer it was very helpful