How to implement "update list after clicking label" in a web page?

Question

In my webpage, I have a full list of publications. However, I want to set up a few labels according to different research topics. Then when I click one label, the list of papers is expected to be updated (only the papers related to this topic will be shown, others hidden). How can I implement this? Is there any template on this?

Thanks in advance.

I've found a similar question and great answers. https://stackoverflow.com/questions/17731457/hide-show-content-list-with-only-css-no-javascript-used — Y Tao, Mar 03 '22 at 23:22

score 0 · Answer 1 · answered Mar 03 '22 at 17:37

0

When you click on the link, a class could be changed on the list element, and then your CSS could hide/show the papers appropriately.

answered Mar 03 '22 at 17:37

Martin Holmes

1
2

could you please explain in more details? I'm new to web design and only know the basics of html. Thanks a lot! – Y Tao Mar 03 '22 at 21:50
I don't think you can do this with plain HTML. You'll need to learn some basic JavaScript and CSS. – Martin Holmes Mar 04 '22 at 22:03
Thanks, I will start to learn CSS – Y Tao Mar 04 '22 at 22:31

How to implement "update list after clicking label" in a web page?

1 Answers1