<?xml version="1.0" encoding="UTF-8" ?>
<entry
	xmlns="http://www.w3.org/2005/Atom"
	xmlns:trackback="http://madskills.com/public/xml/rss/module/trackback/"
	xml:lang="ja-JP"
>
	<title>PagingNavigatorが出すHTMLがアレなので直した</title>
	<id>tag:txqz.net,2008-07-19:blog/2008/07/19/2005</id>
	<link rel="self" href="http://txqz.net/blog/2008/07/19/2005.atom"/>
	<link rel="alternate" type="application/rss+xml" href="http://txqz.net/blog/2008/07/19/2005.rdf"/>
	<link rel="alternate" type="application/xhtml+xml" href="http://txqz.net/blog/2008/07/19/2005.xhtml"/>
	<link rel="alternate" type="text/html" href="http://txqz.net/blog/2008/07/19/2005.html"/>
	<link rel="contents" href="http://txqz.net/blog/2008/07/19/.atom" title="2008年7月19日"/>
	<link rel="first" href="http://txqz.net/blog/2001/08/04/0001.atom" title="地球空冷化"/>
	<link rel="prev" href="http://txqz.net/blog/2008/07/08/2258.atom" title="Googleの乗り換え検索は新しい駅名に対応していない"/>
	<link rel="next" href="http://txqz.net/blog/2008/07/21/2357.atom" title="PHPカンファレンス2008のメモ"/>
	<link rel="last" href="http://txqz.net/blog/2008/12/19/2152.atom" title="浜松市街地を通り抜けて、ムーンライトながら～の思い出"/>
	<author>
		<name>陽坂智佐</name>
		<email>spambasket@txqz.net</email>
	</author>
	<content type="xhtml">
		<div xmlns="http://www.w3.org/1999/xhtml">
<p>たとえば「全部で100件ある記事を15件ずつ表示したい」というのをWicketでやるには<a href="http://wicket.sourceforge.net/apidocs/wicket/markup/html/list/PageableListView.html" title="PageableListView (Wicket 1.2-SNAPSHOT API)">PageableListView</a>と<a href="http://wicket.sourceforge.net/apidocs/wicket/markup/html/navigation/paging/PagingNavigator.html" title="PagingNavigator (Wicket 1.2-SNAPSHOT API)">PagingNavigator</a>を使う。PagingNavigatorはページャを自動に生成してくれる便利なクラスだが、生成されるHTMLが大変微妙で、たとえば「最初」へのリンクのテキストが"&lt;&lt;"、「次」へのリンクは"&gt;"となっている。もちろん「次」へのリンクにrel="next"などついているわけもなく、明らかにユーザビリティが低い。実際にWicketのソースからPagingNavigator.htmlを見ると以下のようになっていた:</p>
<pre><code class="java">&lt;wicket:panel&gt;
    &lt;a wicket:id="first"&gt;&amp;lt;&amp;lt;&lt;/a&gt;&amp;nbsp;&lt;a wicket:id="prev"&gt;&amp;lt;&lt;/a&gt;
    &lt;span wicket:id="navigation"&gt;
        &lt;a wicket:id="pageLink" href="#"&gt;&lt;span wicket:id="pageNumber"&gt;5&lt;/span&gt;&lt;/a&gt;
    &lt;/span&gt;
    &lt;a wicket:id="next"&gt;&amp;gt;&lt;/a&gt;&amp;nbsp;&lt;a wicket:id="last"&gt;&amp;gt;&amp;gt;&lt;/a&gt;
&lt;/wicket:panel&gt;</code></pre>
<p>そこで、PagingNavigatorを継承したクラスであるMyPagingNavigatorを作成する。</p>
<p>javaファイルのほうはPagingNavigatorをextendsした上で、PagingNavigator.javaを丸コピしておく。htmlファイルは:</p>
<pre><code class="html">&lt;wicket:panel&gt;
&lt;ol class="pager"&gt;
    &lt;li&gt;&lt;a rel="first" href="" wicket:id="first"&gt;最初&lt;/a&gt;&lt;/li&gt;
    &lt;li&gt;&lt;a rel="prev" href="" wicket:id="prev"&gt;前&lt;/a&gt;&lt;/li&gt;
    &lt;li wicket:id="navigation"&gt;&lt;a wicket:id="pageLink" href="#"&gt;&lt;span wicket:id="pageNumber"&gt;5&lt;/span&gt;&lt;/a&gt;&lt;/li&gt;
    &lt;li&gt;&lt;a rel="next" href="" wicket:id="next"&gt;次&lt;/a&gt;&lt;/li&gt;
    &lt;li&gt;&lt;a rel="last" href="" wicket:id="last"&gt;最後&lt;/a&gt;&lt;/li&gt;
&lt;/ol&gt;
&lt;/wicket:panel&gt;</code></pre>
<p>こんな感じ。ただ、実際に表示させてみたところちょっと気になるところがあった。</p>
<pre><code class="html">&lt;ol class="pager"&gt;
    &lt;li&gt;&lt;span rel="first"&gt;&lt;em&gt;最初&lt;/em&gt;&lt;/span&gt;&lt;/li&gt;
    &lt;li&gt;&lt;span rel="prev"&gt;&lt;em&gt;前&lt;/em&gt;&lt;/span&gt;&lt;/li&gt;
    &lt;li&gt;&lt;span&gt;&lt;em&gt;&lt;span&gt;1&lt;/span&gt;&lt;/em&gt;&lt;/span&gt;&lt;/li&gt;&lt;li&gt;&lt;a href="hogehoge"&gt;&lt;span&gt;2&lt;/span&gt;&lt;/a&gt;&lt;/li&gt;
    &lt;li&gt;&lt;a href="hogehoge" rel="next"&gt;次&lt;/a&gt;&lt;/li&gt;
    &lt;li&gt;&lt;a href="hogehoge" rel="last"&gt;最後&lt;/a&gt;&lt;/li&gt;
&lt;/ol&gt;</code></pre>
<p>リンクがないときにa要素がspan要素とem要素に置き換わり、さらにspan要素にrel属性が残ってしまう。これでは気持ち悪いので、この変換がどこで行われるのか追いかけてみたけど分からなかった。時間があったらもっと詳しく見ていきたい。</p>
		</div>
	</content>
	<category term="Wicket"/>
	<category term="Java"/>
	<category term="HTML"/>
	<trackback:ping>http://txqz.net/blog/2008/07/19/2005/tb</trackback:ping>
	<published>2008-07-23T19:52:26+09:00</published>
	<updated>2008-07-23T20:02:21+09:00</updated>
	<rights>Attribution-Noncommercial-Share Alike 3.0 Unported</rights>
</entry>