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?
4
-
after you click show, do you need to be able to hide?– No SssweatCommented May 31, 2016 at 0:00
-
For example my number is 1xxxxxx and I want that when I click on it show 1234567 .– user60258Commented May 31, 2016 at 0:04
-
yes, but after that do you want the ability to hide? or you don't need that?– No SssweatCommented May 31, 2016 at 0:04
-
No I don't need that .– user60258Commented May 31, 2016 at 0:05
Add a comment
|
2 Answers
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; }
answered May 31, 2016 at 0:18
-
In my source page number was show . How can I hide number in my page source until "show" not click ?– user60258Commented May 31, 2016 at 0:48
-
-
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 .– user60258Commented May 31, 2016 at 1:02
-
-
How ? Can you help me ?– user60258Commented May 31, 2016 at 1:11
var notificationList = false;
$('.show').click(function(){
if(notificationList) {
notificationList = false;
$('.field-something').hide();
} else {
notificationList = true;
$('.field-something').show();
}
});
-
-
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. Commented Jan 24, 2020 at 17:30