mason/stock/stock_search_form.mas

   1 <%args>
   2   $opts                       => undef
   3   $form
   4   $request                    => undef
   5   $sp_person_autocomplete_uri
   6   $trait_autocomplete_uri
   7   $onto_autocomplete_uri
   8   $trait_db_name => 'SP'
   9 </%args>
  10
  11 <& /util/import_javascript.mas,
  12  classes=>[qw[CXGN.Effects jquery jqueryui popup] ]
  13 &>
  14 <style>
  15
  16 div[class*="advanced"] {
  17     display: none;
  18 }
  19
  20 #stock_search_form .select span span {
  21   white-space: nowrap;
  22   float: left;
  23   width: 10em;
  24 }
  25 #stock_search_form div label, #stock_search_form legend {
  26   font-weight: bold;
  27 }
  28 #stock_search_form label {
  29   float: left;
  30   width: 9em;
  31   white-space: nowrap;
  32 }
  33
  34 div.paginate_nav {
  35   margin: 0 auto;
  36   width: 80%;
  37   white-space: nowrap;
  38   text-align: center;
  39 }
  40
  41 .ui-autocomplete {
  42   max-height: 100px;
  43   overflow-y: auto;
  44   /* prevent horizontal scrollbar */
  45   overflow-x: hidden;
  46 }
  47
  48 /* IE 6 doesn't support max-height
  49 * we use height instead, but this forces the menu to always be this tall
  50 */
  51 * html .ui-autocomplete {
  52   height: 100px;
  53 }
  54
  55 </style>
  56
  57
  58 <script language="javascript">
  59   jQuery(function() {
  60      jQuery("#person").autocomplete({
  61         source: '<% $sp_person_autocomplete_uri %>'
  62      });
  63      jQuery("#trait").autocomplete({
  64         source: '<% $trait_autocomplete_uri %>'
  65      });
  66      jQuery("#onto").autocomplete({
  67         source: '<% $onto_autocomplete_uri %>' + "?db_name=" + '<% $trait_db_name %>'
  68      });
  69      jQuery("#stock_name").autocomplete({
  70         source: '/ajax/stock/stock_autocomplete',
  71      });
  72      jQuery("#project").autocomplete({
  73         source: '/ajax/stock/project_autocomplete',
  74      });
  75      jQuery("#location").autocomplete({
  76         source: '/ajax/stock/geolocation_autocomplete',
  77      });
  78      jQuery("#year").autocomplete({
  79         source: '/ajax/stock/project_year_autocomplete',
  80      });
  81
  82
  83   });
  84 </script>
  85
  86 <%perl>
  87
  88
  89     # set the stock type multi-select choices from the db
  90     $form->get_element({ name => 'stock_type'})->options( $opts->{stock_types} );
  91     $form->get_element({ name => 'organism'})->options( $opts->{organisms} );
  92
  93 $form->process( $request );
  94
  95 </%perl>
  96
  97 <% $form->render %>