2012年3月31日土曜日

groovyとApache Commons Mathで回帰分析する

groovyとApache Commons Mathで回帰分析するには、以下のコードを実行します。
@Grab(group='org.apache.commons', module='commons-math3', version='3.0')
import org.apache.commons.math3.stat.regression.*

// 線形回帰
regression = new SimpleRegression()
data = [[1, 5.1], [2, 7.9], [3, 10.5], [4, 14.2]] as double[][]
regression.addData(data)
// 傾きを表示
println "slope:" + regression.getSlope()
// 切片を表示
println "intercept:" + regression.getIntercept()
// 決定係数を表示
println "r-square:" + regression.getRSquare()

動作環境
groovy 1.8.5, JDK7 Update2, Apache Commons Math 3.0

grailsとjQuery Mobileでdynamic scaffoldingのlist表示を変更する

grailsとjQuery Mobileでdynamic scaffoldingのlist表示を変更する grailsとjQuery Mobileでdynamic scaffoldingのlist表示を変更するには、以下の手順を実行します。

1. ApplicationResources.groovyでモジュールを宣言
modules = {
    application {
        resource url:'js/application.js'
    }
    // jQuery mobileのモジュールを宣言
    jquerymobile {
      dependsOn 'jquery'
      resource url: 'js/jquery.mobile-1.1.0-rc.1.min.js', disposition:'head'
      resource url: 'css/jquery.mobile-1.1.0-rc.1.min.css'
    }
}
jquery.mobile-1.1.0-rc.1.min.jsはweb-app/jsに、jquery.mobile-1.1.0-rc.1.min.cssはweb-app/cssに 画像類はweb-app/css/imagesに配置します。

2. web-app/WEB-INF/sitemesh.xmlに以下のようにexcludes要素を追加します。
<sitemesh>
<!-- sitemesh除外 -->
<excludes file="/WEB-INF/sitemesh-excludes.xml" />
    <page-parsers>
        <parser content-type="text/html"
            class="org.codehaus.groovy.grails.web.sitemesh.GrailsHTMLPageParser" />
        <parser content-type="text/html;charset=ISO-8859-1"
            class="org.codehaus.groovy.grails.web.sitemesh.GrailsHTMLPageParser" />
        <parser content-type="text/html;charset=UTF-8"
            class="org.codehaus.groovy.grails.web.sitemesh.GrailsHTMLPageParser" />
    </page-parsers>

    <decorator-mappers>
        <mapper class="org.codehaus.groovy.grails.web.sitemesh.GrailsLayoutDecoratorMapper" />
    </decorator-mappers>
</sitemesh>
3. sitemesh-excludes.xmlを以下のように作成し、web-app/WEB-INF/に配置します。
<?xml version="1.0" encoding="UTF-8"?>
<sitemesh-excludes>
  <excludes>
    <pattern>/*</pattern>
  </excludes>
</sitemesh-excludes>

4. テンプレートをインストールします。
grails install-templates

5. src/templates/scaffolding/list.gspを開き、下記コードのように変更します。
<% import grails.persistence.Event %>
<%=packageName%>
<!doctype html>
<html>
  <head>
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width, initial-scale=1"> 
    <g:set var="entityName" value="\${message(code: '${domainClass.propertyName}.label', default: '${className}')}" />
    <title><g:message code="default.list.label" args="[entityName]" /></title>
    <style type="text/css" media="screen">
/* headerが...で省略されるのを防ぐ  */
body .ui-header .ui-title {
  white-space: normal;
  margin-left: 0;
  margin-right: 0;
}
    </style>
    <!-- jquerymobileを使用 -->
    <r:require module="jquerymobile"/>
    <r:layoutResources />
  </head>
  <body>
    <div data-role="page">
      <div data-role="header" data-position="inline">
        <a data-icon="home" href="\${createLink(uri: '/')}"><g:message code="default.home.label"/></a>
        <h1><g:message code="default.list.label" args="[entityName]" /></h1>
        <div data-role="navbar">
          <ul>
            <li><g:link action="create" data-ajax="false"><g:message code="default.new.label" args="[entityName]" /></g:link></li>
          </ul>
        </div>
      </div>
      <div data-role="content">
        <g:if test="\${flash.message}">
          <p>\${flash.message}</p>
        </g:if>
        <ul data-role="listview" data-theme="d">

          <%  excludedProps = Event.allEvents.toList() << 'id' << 'version'
            allowedNames = domainClass.persistentProperties*.name << 'dateCreated' << 'lastUpdated'
            props = domainClass.properties.findAll { allowedNames.contains(it.name) && !excludedProps.contains(it.name) && it.type != null && !Collection.isAssignableFrom(it.type) }
            Collections.sort(props, comparator.constructors[0].newInstance([domainClass] as Object[]))
          %>

          <g:each in="\${${propertyName}List}" status="i" var="${propertyName}">
            <li><g:link data-ajax="false" action="show" id="\${${propertyName}.id}">
            <%  props.eachWithIndex { p, i ->
              if (i == 0) { %>
                <h3>\${fieldValue(bean: ${propertyName}, field: "${p.name}")}</h3>
            <%      } else if (i < 6) {
                if (p.type == Boolean || p.type == boolean) { %>
              <p><g:formatBoolean boolean="\${${propertyName}.${p.name}}" /></p>
            <%          } else if (p.type == Date || p.type == java.sql.Date || p.type == java.sql.Time || p.type == Calendar) { %>
              <p><g:formatDate date="\${${propertyName}.${p.name}}" /></p>
            <%          } else { %>
              <p>\${fieldValue(bean: ${propertyName}, field: "${p.name}")}</p>
            <%  }   }   } %>
            </g:link></li>
          </g:each>

        </ul>

      </div>
      <div data-role="footer">
        <g:paginate total="\${${propertyName}Total}" />
      </div>
    </div>
  <r:layoutResources />
  </body>
</html>
出力画面

動作環境
grails 2.0.1

関連情報
jQuery mobileのホームページ
http://jquerymobile.com/

2012年3月30日金曜日

grailsでdynamic scaffoldingのリスト表示で特定のプロパティを表示しないようにする

grailsでdynamic scaffoldingのリスト表示で特定のプロパティを表示しないようにする grailsでdynamic scaffoldingのリスト表示で特定のプロパティを表示しないようにするには、以下の手順を実行します。

1. テンプレートをインストールします。
grails install-templates

2. src/templates/scaffolding/list.gspを開き、下記コードのようにリスト表示で表示しないプロパティをexcludedPropsに追加します。
      <table>
        <thead>
          <tr>
          <%  excludedProps = Event.allEvents.toList() << 'id' << 'version'
// 一覧に表示しないプロパティを追加するには、以下の1行を追加
excludedProps << 'detail'
            allowedNames = domainClass.persistentProperties*.name << 'dateCreated' << 'lastUpdated'
            props = domainClass.properties.findAll { allowedNames.contains(it.name) && !excludedProps.contains(it.name) && it.type != null && !Collection.isAssignableFrom(it.type) }


動作環境
grails 2.0.1

2012年3月29日木曜日

grailsとjQuery Mobileでコントローラーをリストビュー表示する

grailsとjQuery Mobileでコントローラーをリストビュー表示するには、以下の手順を実行します。

1. ApplicationResources.groovyでモジュールを宣言
modules = {
    application {
        resource url:'js/application.js'
    }
    // jQuery mobileのモジュールを宣言
    jquerymobile {
      dependsOn 'jquery'
      resource url: 'js/jquery.mobile-1.1.0-rc.1.min.js', disposition:'head'
      resource url: 'css/jquery.mobile-1.1.0-rc.1.min.css'
    }
}
jquery.mobile-1.1.0-rc.1.min.jsはweb-app/jsに、jquery.mobile-1.1.0-rc.1.min.cssはweb-app/cssに 画像類はweb-app/css/imagesに配置します。

2. web-app/WEB-INF/sitemesh.xmlに以下のようにexcludes要素を追加します。
<sitemesh>
<!-- sitemesh除外 -->
<excludes file="/WEB-INF/sitemesh-excludes.xml" />
    <page-parsers>
        <parser content-type="text/html"
            class="org.codehaus.groovy.grails.web.sitemesh.GrailsHTMLPageParser" />
        <parser content-type="text/html;charset=ISO-8859-1"
            class="org.codehaus.groovy.grails.web.sitemesh.GrailsHTMLPageParser" />
        <parser content-type="text/html;charset=UTF-8"
            class="org.codehaus.groovy.grails.web.sitemesh.GrailsHTMLPageParser" />
    </page-parsers>

    <decorator-mappers>
        <mapper class="org.codehaus.groovy.grails.web.sitemesh.GrailsLayoutDecoratorMapper" />
    </decorator-mappers>
</sitemesh>
3. sitemesh-excludes.xmlを以下のように作成し、web-app/WEB-INF/に配置します。
<?xml version="1.0" encoding="UTF-8"?>
<sitemesh-excludes>
  <excludes>
    <pattern>/*</pattern>
  </excludes>
</sitemesh-excludes>
4. index.gspを以下のように変更します。
<!DOCTYPE html> 
<html>
<head>
  <meta charset="utf-8">
  <meta name="viewport" content="width=device-width, initial-scale=1"> 
  <title>grails and jQuery mobile</title> 
  <style type="text/css" media="screen">
/* headerが...で省略されるのを防ぐ  */
body .ui-header .ui-title {
  white-space: normal;
  margin-left: 0;
  margin-right: 0;
}
  </style>
  <!-- jquerymobileを使用 -->
  <r:require module="jquerymobile"/>
  <r:layoutResources />
</head> 
<body> 
  <div data-role="page">
    <div data-role="header">
      <h1>コントローラー一覧をリストビューで表示</h1>
    </div>
    <div data-role="content">
      <ul data-role="listview" data-inset="true">
        <g:each var="c" in="${grailsApplication.controllerClasses.sort { it.fullName } }">
          <li>
            <g:link controller="${c.logicalPropertyName}">
              <g:message code='${c.fullName}.label' default="${c.fullName}"/>
            </g:link>
          </li>
        </g:each>
      </ul>
    </div>
    <div data-role="footer">
      <h4>フッター</h4>
    </div>
  </div>
<r:layoutResources />
</body>
</html>
5. grails-app/i18n/messages_ja.propertiesに以下のエントリを追加します。
# <フル装飾コントローラークラス名>.labelで日本語名を指定
jm17.BookController.label=書籍
jm17.MovieController.label=映画
jm17.GadgetController.label=ガジェット
出力画面

動作環境
grails 2.0.1

関連情報
jQuery mobileのホームページ
http://jquerymobile.com/

2012年3月28日水曜日

grailsとjQuery Mobileでディバイダー有りのリストビューを表示する

grailsとjQuery Mobileでディバイダー有りのリストビューを表示するには、以下の手順を実行します。

1. ApplicationResources.groovyでモジュールを宣言
modules = {
    application {
        resource url:'js/application.js'
    }
    // jQuery mobileのモジュールを宣言
    jquerymobile {
      dependsOn 'jquery'
      resource url: 'js/jquery.mobile-1.1.0-rc.1.min.js', disposition:'head'
      resource url: 'css/jquery.mobile-1.1.0-rc.1.min.css'
    }
}
jquery.mobile-1.1.0-rc.1.min.jsはweb-app/jsに、jquery.mobile-1.1.0-rc.1.min.cssはweb-app/cssに 画像類はweb-app/css/imagesに配置します。

2. web-app/WEB-INF/sitemesh.xmlに以下のようにexcludes要素を追加します。
<sitemesh>
<!-- sitemesh除外 -->
<excludes file="/WEB-INF/sitemesh-excludes.xml" />
    <page-parsers>
        <parser content-type="text/html"
            class="org.codehaus.groovy.grails.web.sitemesh.GrailsHTMLPageParser" />
        <parser content-type="text/html;charset=ISO-8859-1"
            class="org.codehaus.groovy.grails.web.sitemesh.GrailsHTMLPageParser" />
        <parser content-type="text/html;charset=UTF-8"
            class="org.codehaus.groovy.grails.web.sitemesh.GrailsHTMLPageParser" />
    </page-parsers>

    <decorator-mappers>
        <mapper class="org.codehaus.groovy.grails.web.sitemesh.GrailsLayoutDecoratorMapper" />
    </decorator-mappers>
</sitemesh>
3. sitemesh-excludes.xmlを以下のように作成し、web-app/WEB-INF/に配置します。
<?xml version="1.0" encoding="UTF-8"?>
<sitemesh-excludes>
  <excludes>
    <pattern>/*</pattern>
  </excludes>
</sitemesh-excludes>
4. index.gspを以下のように変更します。
<!DOCTYPE html> 
<html>
<head>
  <meta charset="utf-8">
  <meta name="viewport" content="width=device-width, initial-scale=1"> 
  <title>grails and jQuery mobile</title> 
  <style type="text/css" media="screen">
/* headerが...で省略されるのを防ぐ  */
body .ui-header .ui-title {
  white-space: normal;
  margin-left: 0;
  margin-right: 0;
}
  </style>
  <!-- jquerymobileを使用 -->
  <r:require module="jquerymobile"/>
  <r:layoutResources />
</head> 
<body> 
  <div data-role="page">
    <div data-role="header">
      <h1>ディバイダー有りのリストビューのサンプル</h1>
    </div>
    <div data-role="content">
      <ul data-role="listview" data-inset="true" data-theme="c" data-dividertheme="b">
        <li data-role="list-divider">News</li>
        <li><a href="#">速報News</a></li>
        <li><a href="#">IT News</a></li>
        <li><a href="#">金融News</a></li>
        <li data-role="list-divider">ブックマーク</li>
        <li><a href="#">サイト1</a></li>
        <li><a href="#">サイト2</a></li>
      </ul>
    </div>
    <div data-role="footer">
      <h4>フッター</h4>
    </div>
  </div>
<r:layoutResources />
</body>
</html>
出力画面

動作環境
grails 2.0.1

関連情報
jQuery mobileのホームページ
http://jquerymobile.com/

2012年3月27日火曜日

grailsとjQuery Mobileでセレクトボックスを表示する

grailsとjQuery Mobileでセレクトボックスを表示するには、以下の手順を実行します。

1. ApplicationResources.groovyでモジュールを宣言
modules = {
    application {
        resource url:'js/application.js'
    }
    // jQuery mobileのモジュールを宣言
    jquerymobile {
      dependsOn 'jquery'
      resource url: 'js/jquery.mobile-1.1.0-rc.1.min.js', disposition:'head'
      resource url: 'css/jquery.mobile-1.1.0-rc.1.min.css'
    }
}
jquery.mobile-1.1.0-rc.1.min.jsはweb-app/jsに、jquery.mobile-1.1.0-rc.1.min.cssはweb-app/cssに 画像類はweb-app/css/imagesに配置します。

2. web-app/WEB-INF/sitemesh.xmlに以下のようにexcludes要素を追加します。
<sitemesh>
<!-- sitemesh除外 -->
<excludes file="/WEB-INF/sitemesh-excludes.xml" />
    <page-parsers>
        <parser content-type="text/html"
            class="org.codehaus.groovy.grails.web.sitemesh.GrailsHTMLPageParser" />
        <parser content-type="text/html;charset=ISO-8859-1"
            class="org.codehaus.groovy.grails.web.sitemesh.GrailsHTMLPageParser" />
        <parser content-type="text/html;charset=UTF-8"
            class="org.codehaus.groovy.grails.web.sitemesh.GrailsHTMLPageParser" />
    </page-parsers>

    <decorator-mappers>
        <mapper class="org.codehaus.groovy.grails.web.sitemesh.GrailsLayoutDecoratorMapper" />
    </decorator-mappers>
</sitemesh>
3. sitemesh-excludes.xmlを以下のように作成し、web-app/WEB-INF/に配置します。
<?xml version="1.0" encoding="UTF-8"?>
<sitemesh-excludes>
  <excludes>
    <pattern>/*</pattern>
  </excludes>
</sitemesh-excludes>
4. index.gspを以下のように変更します。
<!DOCTYPE html> 
<html>
<head>
  <meta charset="utf-8">
  <meta name="viewport" content="width=device-width, initial-scale=1"> 
  <title>grails and jQuery mobile</title> 
  <style type="text/css" media="screen">
/* headerが...で省略されるのを防ぐ  */
body .ui-header .ui-title {
  white-space: normal;
  margin-left: 0;
  margin-right: 0;
}
  </style>
  <!-- jquerymobileを使用 -->
  <r:require module="jquerymobile"/>
  <r:layoutResources />
</head> 
<body> 
  <div data-role="page">
    <div data-role="header">
      <h1>セレクトボックスのサンプル</h1>
    </div>
    <div data-role="content">
      <div data-role="fieldcontain">
        <label for="select1" class="select">お支払方法1:</label>
        <g:select name="select1" id="select1" 
          from="${[["value":"銀行振り込み", key:"1"],["value":"代金引換", "key":"2"]]}"
          value="1" optionKey="key" optionValue="value" />
      </div>
      <!-- ミニバージョンのセレクトボックス -->
      <div data-role="fieldcontain">
        <label for="select2" class="select">お支払方法2:</label>
        <g:select name="select2" id="select2" 
          from="${[["value":"銀行振り込み", key:"1"],["value":"代金引換", "key":"2"]]}"
          value="1" optionKey="key" optionValue="value" data-mini="true" />
      </div>
    </div>
    <div data-role="footer">
      <h4>フッター</h4>
    </div>
  </div>
<r:layoutResources />
</body>
</html>
出力画面

動作環境
grails 2.0.1

関連情報
jQuery mobileのホームページ
http://jquerymobile.com/

2012年3月26日月曜日

grailsとjQuery Mobileでチェックボックスを表示する

grailsとjQuery Mobileでチェックボックスを表示するには、以下の手順を実行します。

1. ApplicationResources.groovyでモジュールを宣言
modules = {
    application {
        resource url:'js/application.js'
    }
    // jQuery mobileのモジュールを宣言
    jquerymobile {
      dependsOn 'jquery'
      resource url: 'js/jquery.mobile-1.1.0-rc.1.min.js', disposition:'head'
      resource url: 'css/jquery.mobile-1.1.0-rc.1.min.css'
    }
}
jquery.mobile-1.1.0-rc.1.min.jsはweb-app/jsに、jquery.mobile-1.1.0-rc.1.min.cssはweb-app/cssに 画像類はweb-app/css/imagesに配置します。

2. web-app/WEB-INF/sitemesh.xmlに以下のようにexcludes要素を追加します。
<sitemesh>
<!-- sitemesh除外 -->
<excludes file="/WEB-INF/sitemesh-excludes.xml" />
    <page-parsers>
        <parser content-type="text/html"
            class="org.codehaus.groovy.grails.web.sitemesh.GrailsHTMLPageParser" />
        <parser content-type="text/html;charset=ISO-8859-1"
            class="org.codehaus.groovy.grails.web.sitemesh.GrailsHTMLPageParser" />
        <parser content-type="text/html;charset=UTF-8"
            class="org.codehaus.groovy.grails.web.sitemesh.GrailsHTMLPageParser" />
    </page-parsers>

    <decorator-mappers>
        <mapper class="org.codehaus.groovy.grails.web.sitemesh.GrailsLayoutDecoratorMapper" />
    </decorator-mappers>
</sitemesh>
3. sitemesh-excludes.xmlを以下のように作成し、web-app/WEB-INF/に配置します。
<?xml version="1.0" encoding="UTF-8"?>
<sitemesh-excludes>
  <excludes>
    <pattern>/*</pattern>
  </excludes>
</sitemesh-excludes>
4. index.gspを以下のように変更します。
<!DOCTYPE html> 
<html>
<head>
  <meta charset="utf-8">
  <meta name="viewport" content="width=device-width, initial-scale=1"> 
  <title>grails and jQuery mobile</title> 
  <style type="text/css" media="screen">
/* headerが...で省略されるのを防ぐ  */
body .ui-header .ui-title {
  white-space: normal;
  margin-left: 0;
  margin-right: 0;
}
  </style>
  <!-- jquerymobileを使用 -->
  <r:require module="jquerymobile"/>
  <r:layoutResources />
</head> 
<body> 
  <div data-role="page">
    <div data-role="header">
      <h1>チェックボックスのサンプル</h1>
    </div>
    <div data-role="content">
      <div data-role="fieldcontain">
        <fieldset data-role="controlgroup">
          <legend>移動手段1:</legend>
          <g:checkBox name="checkbox1" id="trans1" value="car" checked="true" />
          <label for="trans1">自動車</label>
          <g:checkBox name="checkbox1" id="trans2" value="train" checked="false" />
          <label for="trans2">電車</label>
          <g:checkBox name="checkbox1" id="trans3" value="airplane" checked="false" />
          <label for="trans3">飛行機</label>
        </fieldset>
      </div>
      <!-- ミニバージョンのチェックボックス -->
      <div data-role="fieldcontain">
        <fieldset data-role="controlgroup" data-mini="true">
          <legend>移動手段2:</legend>
          <g:checkBox name="checkbox2" id="trans1" value="car" data-mini="true" checked="false" />
          <label for="trans1">自動車</label>
          <g:checkBox name="checkbox2" id="trans2" value="train" data-mini="true" checked="true" />
          <label for="trans2">電車</label>
          <g:checkBox name="checkbox2" id="trans3" value="airplane" data-mini="true" checked="false" />
          <label for="trans3">飛行機</label>
        </fieldset>
      </div>
    </div>
    <div data-role="footer">
      <h4>フッター</h4>
    </div>
  </div>
<r:layoutResources />
</body>
</html>
出力画面

動作環境
grails 2.0.1

関連情報
jQuery mobileのホームページ
http://jquerymobile.com/

2012年3月25日日曜日

grailsとjQuery Mobileでラジオボタンを表示する

grailsとjQuery Mobileでラジオボタンを表示するには、以下の手順を実行します。

1. ApplicationResources.groovyでモジュールを宣言
modules = {
    application {
        resource url:'js/application.js'
    }
    // jQuery mobileのモジュールを宣言
    jquerymobile {
      dependsOn 'jquery'
      resource url: 'js/jquery.mobile-1.1.0-rc.1.min.js', disposition:'head'
      resource url: 'css/jquery.mobile-1.1.0-rc.1.min.css'
    }
}
jquery.mobile-1.1.0-rc.1.min.jsはweb-app/jsに、jquery.mobile-1.1.0-rc.1.min.cssはweb-app/cssに 画像類はweb-app/css/imagesに配置します。

2. web-app/WEB-INF/sitemesh.xmlに以下のようにexcludes要素を追加します。
<sitemesh>
<!-- sitemesh除外 -->
<excludes file="/WEB-INF/sitemesh-excludes.xml" />
    <page-parsers>
        <parser content-type="text/html"
            class="org.codehaus.groovy.grails.web.sitemesh.GrailsHTMLPageParser" />
        <parser content-type="text/html;charset=ISO-8859-1"
            class="org.codehaus.groovy.grails.web.sitemesh.GrailsHTMLPageParser" />
        <parser content-type="text/html;charset=UTF-8"
            class="org.codehaus.groovy.grails.web.sitemesh.GrailsHTMLPageParser" />
    </page-parsers>

    <decorator-mappers>
        <mapper class="org.codehaus.groovy.grails.web.sitemesh.GrailsLayoutDecoratorMapper" />
    </decorator-mappers>
</sitemesh>
3. sitemesh-excludes.xmlを以下のように作成し、web-app/WEB-INF/に配置します。
<?xml version="1.0" encoding="UTF-8"?>
<sitemesh-excludes>
  <excludes>
    <pattern>/*</pattern>
  </excludes>
</sitemesh-excludes>
4. index.gspを以下のように変更します。
<!DOCTYPE html> 
<html>
<head>
  <meta charset="utf-8">
  <meta name="viewport" content="width=device-width, initial-scale=1"> 
  <title>grails and jQuery mobile</title> 
  <style type="text/css" media="screen">
/* headerが...で省略されるのを防ぐ  */
body .ui-header .ui-title {
  white-space: normal;
  margin-left: 0;
  margin-right: 0;
}
  </style>
  <!-- jquerymobileを使用 -->
  <r:require module="jquerymobile"/>
  <r:layoutResources />
</head> 
<body> 
  <div data-role="page">
    <div data-role="header">
      <h1>ラジオボタンのサンプル</h1>
    </div>
    <div data-role="content">
      <fieldset data-role="controlgroup">
        <legend>ラジオボタン1:</legend>
        <g:radio name="radio1" id="val1" value="1" checked="true"/>
        <label for="val1">黒色</label>
        <g:radio name="radio1" id="val2" value="2"/>
        <label for="val2">青色</label>
        <g:radio name="radio1" id="val3" value="3"/>
        <label for="val3">白色</label>
      </fieldset>
      <!-- ミニバージョンのラジオボタン -->
      <fieldset data-role="controlgroup" data-mini="true">
        <legend>ラジオボタン2:</legend>
        <g:radio name="radio2" id="val1" value="1"/>
        <label for="val1">黒色</label>
        <g:radio name="radio2" id="val2" value="2" checked="true"/>
        <label for="val2">青色</label>
        <g:radio name="radio2" id="val3" value="3"/>
        <label for="val3">白色</label>
      </fieldset>
    </div>
    <div data-role="footer">
      <h4>フッター</h4>
    </div>
  </div>
<r:layoutResources />
</body>
</html>
出力画面

動作環境
grails 2.0.1

関連情報
jQuery mobileのホームページ
http://jquerymobile.com/