mason/transformation/add_transformant_names_dialog.mas

   1 <%args>
   2 $transformation_id
   3 $transformation_name
   4 $next_new_transformant
   5 $last_number
   6 </%args>
   7
   8 <& /util/import_javascript.mas, classes => [ 'jquery', 'jquery.dataTables' ] &>
   9 <& /util/import_css.mas, paths => ['/documents/inc/datatables/jquery.dataTables.css'] &>
  10
  11 <div class="modal fade" id="add_new_transformant_names_dialog" name="add_new_transformant_names_dialog" tabindex="-1" role="dialog" aria-labelledby="addNewTransformantNamesDialog">
  12     <div class="modal-dialog modal-lg" role="document">
  13         <div class="modal-content">
  14             <div class="modal-header" style="text-align: center">
  15                 <button type="reset" class="close" id="add_new_transformants_dismiss_button_1" name="add_new_transformants_dismiss_button" aria-label="Close"><span aria-hidden="true">&times;</span></button>
  16                 <h4 class="modal-title" id="addNewTransformantNamesDialog">Add New Transformant (Accession) Names</h4>
  17             </div>
  18             <div class="modal-body">
  19                 <div class="container-fluid">
  20                     <form class="form-horizontal" id="create_new_transformants_form" name="create_new_transformants_form">
  21                         <div class="form-group">
  22                             <label class="col-sm-3 control-label">Basename: </label>
  23                             <div class="col-sm-9">
  24                                 <input class="form-control" id="transformation_name" name="transformation_name" type="text" disabled value="<%$transformation_name%>"/>
  25                             </div>
  26                         </div>
  27                         <div class="form-group">
  28                             <label class="col-sm-3 control-label">Next Name: </label>
  29                             <div class="col-sm-9">
  30                                 <input class="form-control" id="next_transformant_name" name="next_transformant_name" type="text" disabled value="<%$next_new_transformant%>"/>
  31                             </div>
  32                         </div>
  33                         <div class="form-group">
  34                             <label class="col-sm-3 control-label">How many?</label>
  35                             <div class="col-sm-9">
  36                                 <input class="form-control" id="number_of_new_transformants" name="number_of_new_transformants" type="number" />
  37                             </div>
  38                         </div>
  39                     </form>
  40                 </div>
  41             </div>
  42             <div class="modal-footer">
  43                 <button id="add_new_transformants_dismiss_button_2" name="add_new_transformants_dismiss_button" type="button" class="btn btn-default" data-dismiss="modal">Close</button>
  44                 <button type="button" class="btn btn-primary" id="new_transformants_submit">Submit</button>
  45             </div>
  46         </div>
  47     </div>
  48 </div>
  49
  50 <div class="modal fade" id="new_transformants_saved_dialog_message" name="new_transformants_saved_dialog_message" tabindex="-1" role="dialog" aria-labelledby="newTransformantsSavedDialog">
  51     <div class="modal-dialog" role="document">
  52         <div class="modal-content">
  53             <div class="modal-header">
  54                 <button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">&times;</span></button>
  55                 <h4 class="modal-title" id="newTransformantsSavedDialog">Success</h4>
  56             </div>
  57             <div class="modal-body">
  58                 <div class="container-fluid">
  59                     <p>
  60                         <span class="ui-icon ui-icon-circle-check" style="float: left; margin: 0 7px 50px 0;"></span>
  61                         The new transformants (accessions) were saved successfully.
  62                     </p>
  63                 </div>
  64             </div>
  65             <div class="modal-footer">
  66                 <button id="dismiss_new_transformants_saved_dialog" type="button" class="btn btn-default" data-dismiss="modal">Close & Reload</button>
  67             </div>
  68         </div>
  69     </div>
  70 </div>
  71
  72
  73 <script>
  74
  75 jQuery(document).ready(function(){
  76
  77     var last_number = "<% $last_number %>";
  78
  79     jQuery('#add_new_transformants_link').click(function(){
  80         jQuery('#add_new_transformant_names_dialog').modal('show');
  81     });
  82
  83     jQuery('#new_transformants_submit').click(function(){
  84         var transformation_name = jQuery('#transformation_name').val();
  85         var new_name_count = jQuery('#number_of_new_transformants').val();
  86         jQuery.ajax({
  87             url : '/ajax/transformation/add_transformants',
  88             dataType: "json",
  89             type: 'POST',
  90             data : {
  91                 'transformation_name': transformation_name,
  92                 'transformation_stock_id': "<%$transformation_id%>",
  93                 'new_name_count': new_name_count,
  94                 'last_number': last_number,
  95             },
  96             beforeSend: function(response){
  97                 jQuery('#working_modal').modal('show');
  98             },
  99             success: function(response) {
 100                 jQuery('#working_modal').modal('hide');
 101                 if (response.success == 1) {
 102                     jQuery('#add_new_transformant_names_dialog').modal('hide');
 103                     jQuery('#new_transformants_saved_dialog_message').modal("show");
 104
 105                 }
 106                 if (response.error) {
 107                     alert(response.error);
 108                 }
 109             },
 110             error: function(response){
 111                 jQuery('#working_modal').modal('hide');
 112                 alert('An error occurred creating new transformants');
 113             }
 114         });
 115     });
 116
 117     jQuery("[name='add_new_transformants_dismiss_button']").click(function() {
 118         jQuery('#add_new_transformant_names_dialog').modal('hide');
 119         jQuery('#number_of_new_transformants').val('');
 120     });
 121
 122     jQuery("#dismiss_new_transformants_saved_dialog").click(function(){
 123         jQuery('#number_of_new_transformants').val('');
 124         location.reload();
 125     });
 126
 127 });
 128
 129
 130 </script>