2012年2月21日火曜日

grailsとjquery-ui pluginでradioボタンをボタン化する

grailsとjquery-ui pluginでradioボタンをボタン化するには、以下の手順を実行します。

1. pluginのインストール
grails install-plugin jquery-ui
2. main.gspに以下のようにr:requireを使用してリソースを導入します。
  <g:layoutHead/>
<!-- jquery-uiを使用 -->
<r:require module="jquery-ui"/>
        <r:layoutResources />
3. ビューのgspに以下のようなコードを追加します。
<div id="radiobuttons">
  <input type="radio" id="radio1" name="radio" value="1" checked="checked" /><label for="radio1">選択1</label>
  <input type="radio" id="radio2" name="radio" value="2" /><label for="radio2">選択2</label>
  <input type="radio" id="radio3" name="radio" value="3" /><label for="radio3">選択3</label>
</div>
<script type="text/javascript">
  $(function(){
    $("#radiobuttons").buttonset();
  });
</script>
画面イメージ

動作環境
grails 2.0.1

0 件のコメント:

コメントを投稿