Can't use modal on button click

I want to use modal for representing additional data on my table row contennt for this reason i use this code below , but when i press button modal doesn’t pops up and i don’t see any error in my browser console , what should i add to make my code work?:

<h2>My job List</h2>                                                                                            
    <div>
        <table style="width:100%;"  class="table table-hover" >
            <thead>
                <tr>
                    <th style="width:80px; height:px;">chose</th>
                    <th style="width:140px;">id</th>
                    <th style="width:305px;">organizationNameEN</th>
                    <th style="width:250px;">cardNumber</th>
                    <th style="width:250px;"></th>
                    <th style="width:250px;"></th>

                </tr>           
            </thead>
            <tbody ng-repeat="item in arr" >
                <tr>
                    <td><input style="width:25px; height:25px;" type="checkbox" ng-model="chekselct"                                                     
                                                                cam-variable-name="isItemSelected"                                                  
                                                                cam-variable-type="Boolean" /></td> 
                    <td><input style="width:140px;" type="text" id="id" ng-model="item.id" readonly /></td>
                    <td><input style="width:305px;" type="text" id="organizationNameEN"  ng-model="item.organizationNameEN" /></td>
<td><input style="width:305px;" type="text" id="organizationNameGE"   ng-model="item.organizationNameGE" /></td>                     
                    <td><button type="button" class="btn btn-primary" style="height:30px" data-toggle="modal" data-target="#myModal">details</button></td>
                     <td><button ng-click="myFunc()" role="button" class="btn btn-large btn-primary">Detail</button></td>
                     <div class="modal fade" id="myModal" role="dialog">
       <div class="modal-dialog">
      <!-- Modal content-->
      <div class="modal-content" ng-repeat="item in arr">
        <div class="modal-header">
          <button type="button" class="close" data-dismiss="modal">&times;</button>
          <h4 class="modal-title">Details</h4>
        </div>
        <div class="modal-body">
          <p ><label for="organizationNameEN"> organizationNameEN</label> :  <input style="width:305px;" type="text" id="organizationNameEN"  ng-model="item.organizationNameEN" /></p>
        </div>
        <div class="modal-footer">
          <button type="button" class="btn btn-default" data-dismiss="modal">Close</button>
        </div>
      </div>

    </div>
  </div>               
                </tr>
            </tbody>
        </table>
    </div>

In order to reproduce your issue, could you tell me where are you adding this table?

hi @siffogh i want to add this table in tasklist in All task option

@Sally All Task is a filter that displays all the tasks. I am still not sure where do you want to add this data. Do you mean in an embedded form of a task that belongs to this list of tasks ?