mason/breeders_toolbox/program/add_product_profile_dialog.mas

   1 <%args>
   2 $program_id
   3 $program_name
   4 </%args>
   5
   6 <div class="modal fade" id="add_product_profile_dialog" name="add_product_profile_dialog" tabindex="-1" role="dialog" aria-labelledby="addProductProfileDialog">
   7     <div class="modal-dialog modal-lg" role="document">
   8         <div class="modal-content">
   9             <div class="modal-header" style="text-align: center">
  10                 <button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">&times;</span></button>
  11                 <h4 class="modal-title" id="addProductProfileDialog">Add Product Profile</h4>
  12             </div>
  13             <div class="modal-body">
  14                 <div class="container-fluid">
  15                     <form class="form-horizontal" role="form">
  16                         <div class="form-group">
  17                             <label class="col-sm-3 control-label">Breeding Program: </label>
  18                             <div class="col-sm-9">
  19                                 <input class="form-control" name="profile_program_name" id="profile_program_name" disabled value="<% $program_name %>">
  20                                 <input name="profile_program_id" id="profile_program_id" type="hidden" value="<% $program_id %>">
  21                             </div>
  22                         </div><br/><br/>
  23                         <div class="form-group">
  24                             <label class="col-sm-3 control-label">Product Profile Name: </label>
  25                             <div class="col-sm-9">
  26                                 <input class="form-control" id="new_product_profile_name" name="new_product_profile_name" type="text"/>
  27                             </div>
  28                         </div><br/><br/>
  29                         <div class="form-group">
  30                             <label class="col-sm-3 control-label">Scope: </label>
  31                             <div class="col-sm-9">
  32                                 <input class="form-control" id="new_product_profile_scope" name="new_product_profile_scope" type="text"/>
  33                             </div>
  34                         </div><br/><br/>
  35                         <div class="form-group">
  36                             <label class="col-sm-3 control-label" for="select_list_list_selectxx">Select a List of Traits: </label>
  37                             <div class="col-sm-9">
  38                                 <span id="select_list_div"></span>
  39                             </div>
  40                         </div>
  41                         <div class="form-group form-group-sm" id="target_value_section" style="display: none" >
  42                             <hr>
  43                             <center><h4>Add Target Value:</h4></center>
  44                             <div id="target_value_for_trait" >
  45                             </div>
  46                         </div
  47                     </form>
  48                 </div>
  49             </div>
  50             <div class="modal-footer">
  51                 <button type="button" class="btn btn-info" id="submit_new_profile" >Submit</button>
  52                 <button type="button" class="btn btn-default" data-dismiss="modal">Close</button>
  53             </div>
  54         </div>
  55     </div>
  56 </div>
  57
  58 <script>
  59
  60 jQuery(document).ready(function () {
  61
  62
  63     jQuery(document).on('change', '#select_list_list_select', function() {
  64         var list = new CXGN.List();
  65         var trait_list_id = jQuery('#select_list_list_select').val();
  66         var trait_list = list.getList(trait_list_id);
  67         var html = '<form class="form-horizontal">';
  68         for (var i=0; i<trait_list.length; i++){
  69             html = html + '<div class="form-group"><label class="col-sm-9 control-label">' + trait_list[i] + ': </label><div class="col-sm-3"><input class="form-control" id="target_value_input_' + i + '" type="text" value="" /></div></div>';
  70         }
  71         html = html + '</form>';
  72         jQuery("#target_value_for_trait").empty().html(html);
  73
  74
  75         jQuery("#target_value_section").show();
  76
  77     });
  78
  79     jQuery('#submit_new_profile').click(function(){
  80
  81         var list = new CXGN.List();
  82         var profile_program_id = jQuery('#profile_program_id').val();
  83         var product_profile_name = jQuery('#new_product_profile_name').val();
  84         var product_profile_scope = jQuery('#new_product_profile_scope').val();
  85         var trait_list_id = jQuery('#select_list_list_select').val();
  86         var trait_list = list.getList(trait_list_id);
  87         trait_list_json = JSON.stringify(trait_list);
  88
  89         if (product_profile_name === '') {
  90             alert("Please supply a product profile name");
  91             return;
  92         }
  93
  94         if (product_profile_scope === '') {
  95             alert("Please supply a product profile scope");
  96             return;
  97         }
  98
  99         if (trait_list_id === '') {
 100             alert("Please select a trait list");
 101             return;
 102         }
 103
 104         var target_values = [];
 105         for (var i=0; i<trait_list.length; i++) {
 106             var target_value = jQuery("input#target_value_input_" + i).val();
 107             target_values.push(target_value);
 108         }
 109
 110         target_values_json = JSON.stringify(target_values);
 111
 112         jQuery.ajax({
 113             url: '/ajax/breeders/program/add_product_profile',
 114             timeout: 3000000,
 115             dataType: "json",
 116             type: 'POST',
 117             data:{
 118                 'profile_program_id': profile_program_id,
 119                 'product_profile_name': product_profile_name,
 120                 'product_profile_scope': product_profile_scope,
 121                 'trait_list_json': trait_list_json,
 122                 'target_values_json': target_values_json,
 123             },
 124             beforeSend: function() {
 125                 jQuery("#working_modal").modal("show");
 126             },
 127             error: function(response) {
 128                 alert("An error occurred. Please try again later!" + JSON.stringify(response));
 129             },
 130             parseerror: function(response) {
 131                 alert("A parse error occurred. Please try again." + response);
 132             },
 133             success: function(response) {
 134                 jQuery("#working_modal").modal("hide");
 135                 if (response.error) {
 136                     alert(response.error);
 137                 } else {
 138                     alert('The product profile was saved successfully.');
 139                 }
 140             },
 141
 142         });
 143
 144     });
 145
 146 });
 147
 148
 149 </script>