mason/stock/population_members.mas

   1 <%args>
   2 $stock_id
   3 </%args>
   4
   5 <& /util/import_javascript.mas, classes => [ 'jquery', 'jquery.dataTables', 'CXGN.BreedersToolbox.Accessions' ] &>
   6 <& /util/import_css.mas, paths => ['/documents/inc/datatables/jquery.dataTables.css'] &>
   7
   8 <div style="overflow:scroll">
   9     <table class="table table-hover table-bordered" id="population_members_table">
  10     </table>
  11 </div>
  12
  13
  14 <script>
  15
  16 jQuery(document).ready(function(){
  17
  18     var population_id = "<%$stock_id%>";
  19     var table = jQuery(population_members_table).DataTable({
  20         ajax: '/ajax/manage_accessions/population_members/'+population_id,
  21         'autoWidth': false,
  22         destroy: true,
  23         columns: [
  24             { title: "Member Name", "data": null, "render": function ( data, type, row ) { return "<a href='/stock/"+row.stock_id+"/view'>"+row.name+"</a>"; } },
  25             { title: "Member Type", "data": "stock_type" },
  26             { title: "Description", "data": "description" },
  27             { title: "Synonyms", "data": "synonyms[, ]" },
  28             { title: "Remove From Population", "data": null, "render": function ( data, type, row ) { return "<a name='populations_member_remove' data-stock_relationship_id='"+row.stock_relationship_id+"'>X</a>"; } },
  29         ],
  30         "fnInitComplete": function(oSettings, json) {
  31             //console.log(json);
  32             var html = "";
  33             for(var i=0; i<json.data.length; i++){
  34                 html += json.data[i].name+"\n";
  35             }
  36             jQuery("#populations_members_add_to_list_data_"+population_id).html(html);
  37             addToListMenu("populations_members_add_to_list_menu_"+population_id, "populations_members_add_to_list_data_"+population_id, {
  38                 selectText: true,
  39                 listType: 'accessions',
  40                 listName: population_name
  41             });
  42         }
  43     });
  44
  45 });
  46
  47 </script>