EPrints Technical Mailing List Archive

Message: #06739


< Previous (by date) | Next (by date) > | < Previous (in thread) | Next (in thread) > | Messages - Most Recent First | Threads - Most Recent First

Re: [EP-tech] Enabling/disabling fields in the workflow using JS


Hi Christopher,

 

Thanks for your suggestion. I’m a bit more familiar to jQuery than Prototype, although I think it would be overkill to load jQuery on top of Prototype just for doing this. I’m sure there is an easier way to fix this!

 

Could I pass another option to render_input_field_actual to add the onclick event to the radio button?

 

Robin

 

 

De : Christopher Gutteridge [mailto:cjg@ecs.soton.ac.uk]
Envoyé : 1 août 2017 17:
59
À : eprints-tech@ecs.soton.ac.uk; Robin Sylvestre <robin.sylvestre@polymtl.ca>
Objet : Re: [EP-tech] Enabling/disabling fields in the workflow using JS

 

If you need jQuery to make life easier;

 
  <script src="/_javascript_/jquery.min.js" type="text/_javascript_">// <!-- No script --></script>
  <script type="text/_javascript_">$.noConflict();</script>
 

The second bit is vital or it conflicts with prototype.js which also likes to use the $ variable and is required for EPrints features.

On 01/08/2017 21:51, Robin Sylvestre wrote:

Hello fellow Eprinters!

 

I’m trying to enable/disable a date field in the workflow based on the value of a radio button (value = True or False), using _javascript_. Is there an easy way to do it?

 

This page contains some clues and I’ve tried adding a render_input option to my field definition:

 

{

  'name' => 'diplome_articles',

  'type' => 'boolean',

  'multiple' => 0,

  'volatile' => 0,

  'input_style' => 'radio',

   'render_input' => sub {

                    my ( $field, $repository, $current_value, $dataset, $staff, $hidden_fields, $object, $basename ) = @_;

                    my $dom = $field->render_input_field_actual( $repository, $current_value, $dataset, $staff, $hidden_fields, $object, $basename );

 

my $script = $repository->make_javascript('

 

var buttonOpt = document.getElementById("'.$basename.'");

buttonOpt.addEventListener("click", function(){ alert() });

 

');

 

     my $superdom = $repository->xml->create_element("div");

              $superdom->appendChild($dom);

              $superdom->appendChild($script);

              return $superdom;

             }

}

 

…but since both radio buttons (true/false) get the same ID when rendered by EPrints, using “getElementById” returns only the first element, thus only works when the first option is clicked.

 

From the console of my browser, I know I can get the value of the selected option using

 

document.querySelector("[name$='_diplome_articles']:checked").value

 

…but I can’t figure out how to add an event listener for when this value is changing. Actually, the much, much easier way would be to just add _onclick_="function()" to the radio button itself and toggle the date field accordingly. But is it possible to do it without hacking EPrints too much?  

 

Thanks for your help!!

 

 

Robin Sylvestre

Technicien en gestion de l’information numérique

Services techniques et systèmes informatisés

Bibliothèque de l’École Polytechnique de Montréal

514-340-4711 poste 3743

 




*** Options: http://mailman.ecs.soton.ac.uk/mailman/listinfo/eprints-tech
*** Archive: http://www.eprints.org/tech.php/
*** EPrints community wiki: http://wiki.eprints.org/
*** EPrints developers Forum: http://forum.eprints.org/



-- 
Christopher Gutteridge -- http://users.ecs.soton.ac.uk/cjg
 
University of Southampton Open Data Service: http://data.southampton.ac.uk/
You should read our Web & Data Innovation blog: http://blogs.ecs.soton.ac.uk/webteam/