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

[cjg at ecs.soton.ac.uk (Christopher Gutteridge)]

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 
> <https://wiki.eprints.org/w/Include_Javascript_in_the_workflow> 
> 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/

-------------- next part --------------
An HTML attachment was scrubbed...
URL: http://mailman.ecs.soton.ac.uk/pipermail/eprints-tech/attachments/20170801/84689847/attachment-0001.html