CakePHP prettyPopin.jsのポップアップウィンドウ内でページングする

CakePHPのページングのリンク部分を以下のようにarray(‘rel’ => ‘internal’)を渡すようにすると、ポップアップウィンドウ内でページングさせることができます。

 <div class="paging">
 		<?php echo $this->Paginator->prev('<< ' . __('previous', true), array('rel' => 'internal'), null, array('class'=>'disabled'));?>
 	 | 	<?php echo $this->Paginator->numbers(array('rel' => 'internal'));?>
 |
 		<?php echo $this->Paginator->next(__('next', true) . ' >>', array('rel' => 'internal'), null, array('class' => 'disabled'));?>
 	</div>

またrel=”close”を付けるとポップアップウィンドウを閉じることができます。
一覧から項目を選択すると閉じるようにするには、以下のようにします。

 <td class="actions">
 			<a rel="close" href="#" onclick="user_id=<?php echo $user['User']['id']; ?>;">選択</a>			
 </td>

ここではonclickでjavascript変数に選択された項目のIDを代入して、コールバック関数で処理できるようにしています。

呼び出し側のコードは例えば、以下の様になります。

 <form>
 <input type="text" id="UserId" >
 </form>
 <?php
 echo $this->Html->link('検索', '/users/popup', array('rel' => 'browse_user'));
 ?>
 <script type="text/javascript" charset="utf-8">
 user_id = 0;
 $(document).ready(function(){
 		$("a[rel^='browse_user']").prettyPopin({
 			modal : true,
 			width : 800,
 			height: 400,
 			opacity: 0.5,
 			animationSpeed: '0', 
 			followScroll: false,
 			loader_path: '<?php echo $this->webroot; ?>/images/prettyPopin/loader.gif',
 			callback: function(){
 				if(user_id > 0) {
 					$("#UserId").val(user_id);

}
user_id = 0;

 			}
 		});
 </script>

onclickでuser_idに選択された項目IDが格納され、コールバックでinputタグの値を更新します。