2

In node.html.twig, I want to show a field when I click on it, as what the Field Value Loader (Show field on click) module does, but this module doesn't have releases for Drupal 8.

How can I do this?

  • after you click show, do you need to be able to hide? – No Sssweat May 31 '16 at 0:00
  • For example my number is 1xxxxxx and I want that when I click on it show 1234567 . – RobinSon May 31 '16 at 0:04
  • yes, but after that do you want the ability to hide? or you don't need that? – No Sssweat May 31 '16 at 0:04
  • No I don't need that . – RobinSon May 31 '16 at 0:05
2

node.html.twig

<div class = "field-something">
{{ content.field_something.value }}
</div>

<div class = "show">
Show
</div>

custom.js

(function ($) {

$('.field-something').hide();
$('.show').show();

$('.show').click(function(){
    $('.field-something').fadeIn(2000);
    $('.show').hide();
});

}(jQuery));

Your Theme's style.css

.field-something { float: left; padding-right: 5px; }
.show { color: blue; cursor: pointer; display: none; }

Example DEMO

  • In my source page number was show . How can I hide number in my page source until "show" not click ? – RobinSon May 31 '16 at 0:48
  • by default jQuery is disabled in D8, did you enable it? – No Sssweat May 31 '16 at 0:59
  • In page my number is hide and when I click on "show" my number show . But when I watch my source page my nubmer is show . For more security I want hide on source page too . – RobinSon May 31 '16 at 1:02
  • Then you would have to load it using AJAX – No Sssweat May 31 '16 at 1:09
  • How ? Can you help me ? – RobinSon May 31 '16 at 1:11
0
var notificationList = false;
$('.show').click(function(){
    if(notificationList) {
       notificationList = false;
       $('.field-something').hide();
    } else {
       notificationList = true;
       $('.field-something').show();
    }
});
  • Can you explain a little your code? – Adrian Cid Almaguer Jan 22 at 14:48
  • Yes, By default, my window is not opened, so when I click on dropdown my variable notificationList is still false, accordingly the condition does not work and goes to else, after that my variable notificationList becomes true, and already the next click the condition is fulfilled and notificationList is set false , and the dropdown is hidden. Accordingly when I click my dropdown is hiding and showing. – Yura Yusyk Jan 24 at 17:30

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service, privacy policy and cookie policy

Not the answer you're looking for? Browse other questions tagged or ask your own question.