Template inheritance of wicket (i)

Source: Internet
Author: User

Wicket components and HTML files always appear in pairs, such as A.java and a.html.

If there are no paired occurrences, it could be an inline template, or from an inheritance.

Take the wicket built-in pagingnavigator component as an example to view the source package, with the corresponding pagingnavigator.html file present.

Now create a new Mypagingnavigator class that inherits from Pagingnavigator.

This is the content of pagingvavigator.html:

<wicket:panel><a wicket:id= "First" class= "first" >&lt;&lt;</a><a wicket:id= "prev" class= "prev" >&lt;</a><span wicket:id= "navigation" class= "goto" ><a wicket:id= "Pagelink" href= "#" ><span wicket:id= "pagenumber" >5</span></a></span><a wicket:id= "Next" class= "next ">&gt;</a><a wicket:id=" Last "class=" The Last ">&gt;&gt;</a></wicket:panel>

If mypagingnavigator.html is not provided , then Mypagingnavigator will integrate the template from the pagingnavigator.html.

Now provide your own HTML template to make it into the PURECSS format:

<wicket:panel><a wicket:id= "First" class= "first" style= "Display:none;" >&lt;&lt;</a><ul class= "Pure-paginator" > <li><a wicket:id= "prev" class= " Pure-button prev "href=" # ">& #171;</a></li> <span wicket:id=" navigation "class=" goto "> <l I><a wicket:id= "Pagelink" class= "Pure-button" href= "#" ><span wicket:id= "PageNumber" >5</span> </a></li> </span> <li><a wicket:id= "Next" class= "Pure-button Next" href= "#" >& #187; </a></li></ul><a wicket:id= "Last" class= "last" style= "Display:none;" >&gt;&gt;</a></wicket:panel>

It can be seen that such a way to achieve a certain effect, but the control means very limited, and eventually you have to read Pagingnavigator source code, to achieve their own purecss-based paginator.

Compared to the familiar JS control dom,wicket looks clumsy many. But component-based reuse makes all the hard work return to value.

Template inheritance of wicket (i)

Contact Us

The content source of this page is from Internet, which doesn't represent Alibaba Cloud's opinion; products and services mentioned on that page don't have any relationship with Alibaba Cloud. If the content of the page makes you feel confusing, please write us an email, we will handle the problem within 5 days after receiving your email.

If you find any instances of plagiarism from the community, please send an email to: info-contact@alibabacloud.com and provide relevant evidence. A staff member will contact you within 5 working days.

A Free Trial That Lets You Build Big!

Start building with 50+ products and up to 12 months usage for Elastic Compute Service

  • Sales Support

    1 on 1 presale consultation

  • After-Sales Support

    24/7 Technical Support 6 Free Tickets per Quarter Faster Response

  • Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.