最近の更新

読込中...

2013年7月31日水曜日

VMware Player5.0.2 for Windowsの起動方法

【目的】
VMware Player5.0.2 for Windowsを起動します。



【手順１】
１．デスクトップに作成された「VMware Player」のショートカットを実行。




【手順２】
１．以下の様に「VMware Player」が起動すれば成功です。









































以上です。

投稿者 0 コメント
ラベル:

VMware Player5.0.2 for Windowsのインストール方法

【目的】
VMware Player5.0.2 for Windowsをダウンロードし、インストールします。



【手順１】
１．「VMware Player5.0.2 for Windowsのダウンロード方法」の手順でダウンロードした「VMware-player-5.0.2-1031769.exe」を実行。




【手順２】
１．「次へ」ボタンをクリック。




【手順３】
１．「次へ」ボタンをクリック。




【手順４】
１．「次へ」ボタンをクリック。




【手順５】
１．「VMware Playerの改善に協力する」(任意)を非選択。
２．「次へ」ボタンをクリック。




【手順６】
１．「次へ」ボタンをクリック。




【手順７】
１．「続行」ボタンをクリック。
２．インストールが完了するのを待ちます。




【手順８】
１．「完了」ボタンをクリック。




以上です。

投稿者 0 コメント
ラベル:

VMware Player5.0.2 for Windowsのダウンロード方法

【目的】
VMware Player5.0.2 for Windowsをダウンロードし、インストールします。



【手順１】
１．「VMware Playerのサイト」にアクセス。
２．「ダウンロード」をクリック。

































【手順２】
１．「VMware Player for Windows 32-bit and 64-bit」の「ダウンロード」をクリック。

































【手順３】
１．保存場所を選択。
２．「保存」ボタンをクリック。

































以上です。

投稿者 0 コメント
ラベル:

2013年7月29日月曜日

h:commandButtonのactionでBeanの値で画面遷移

【目的】
JSF2.2でh:commandButtonを実行します。
commandButtonのactionでManagedBean(マネージドビーン)の値で画面遷移します。
※今回はCDIのマネージドビーンを使用しています。



【手順１】
１．「JSF2.2プロジェクトの作成方法」の作成手順で、「JSF22Sample202-h-commandButtonActionBeanValue」といプロジェクトを作成。
※プロジェクトの設定は以下の通り。
※他の項目は任意。
ウィザード名 項目名 項目に設定する値
動的 Web プロジェクト プロジェクト名 JSF22Sample202-h-commandButtonActionBeanValue
ターゲット・ランタイム GlassFish 4.0
動的 web モジュールバージョン 3.1
プロジェクト・ファセット JavaServer Faces チェック有り バージョン(2.2)
Java ビルド・パス上のソース・フォルダー src
デフォルト出力フォルダー build\classes
Web モジュール コンテキスト・ルート JSF22Sample202-h-commandButtonActionBeanValue
コンテンツ・ディレクトリー WebContent
web.xml デプロイメント記述子の作成 チェックあり
JSF 機能 JSF 実装ライブラリー GlassFish System Library
Configure JSF servlet in deployment descriptor チェック有り
JSF 構成ファイル /WEB-INF/faces-config.xml
JSF サーブレット名 Faces Servlet
JSF Servlet Class Name javax.faces.webapp.FacesServlet
URL マッピング・パターン /faces/*



２．「WebContent/WEB-INF/web.xml」を以下の様に入力。
<?xml version="1.0" encoding="UTF-8"?>
<web-app xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance"
    xmlns="http://xmlns.jcp.org/xml/ns/javaee"
    xsi:schemaLocation="http://xmlns.jcp.org/xml/ns/javaee http://xmlns.jcp.org/xml/ns/javaee/web-app_3_1.xsd"
    id="WebApp_ID" version="3.1">

    <display-name>JSF22Sample202-h-commandButtonActionBeanValue</display-name>

    <welcome-file-list>
        <welcome-file>faces/index.xhtml</welcome-file>
    </welcome-file-list>

    <servlet>
        <servlet-name>Faces Servlet</servlet-name>
        <servlet-class>javax.faces.webapp.FacesServlet</servlet-class>
        <load-on-startup>1</load-on-startup>
    </servlet>

    <servlet-mapping>
        <servlet-name>Faces Servlet</servlet-name>
        <url-pattern>/faces/*</url-pattern>
    </servlet-mapping>
</web-app>

４．「Ctrl+Shift+F」を押し、ソースコードをフォーマッティング、「Ctrl+S」でファイルを保存。
５．「Javaパッケージの作成方法」の手順で、「sample」というパッケージを作成。
６．「Javaクラスファイルの作成方法」の手順で、「SampleBean.java」というクラスファイルを作成。
７．「SampleBean.java」を以下の様に入力。
package sample;

import javax.enterprise.context.RequestScoped;
import javax.inject.Named;

@Named
@RequestScoped
public class SampleBean {
    public String action() {
        System.out.println("actionが呼び出されました。");
        return "page2";
    }
}

８．「Ctrl+Shift+F」を押し、ソースコードをフォーマッティング、「Ctrl+S」でファイルを保存。
９．「任意のファイルの作成方法」の手順で、「WebContent/」ディレクトリに「index.xhtml」というファイルを作成。
１０．「index.xhtml」を以下の様に入力。
<html xmlns="http://www.w3.org/1999/xhtml"
      xmlns:h="http://xmlns.jcp.org/jsf/html">
<h:head>
</h:head>
<h:body>
    <h:outputText value="#{sampleBean.text}" escape="false" />
</h:body>
</html>

１１．「任意のファイルの作成方法」の手順で、「WebContent/」ディレクトリに「page2.xhtml」というファイルを作成。
１２．「page2.xhtml」を以下の様に入力。
<html xmlns="http://www.w3.org/1999/xhtml"
    xmlns:h="http://xmlns.jcp.org/jsf/html">
<h:head>
</h:head>
<h:body>
    ページ２です。
</h:body>
</html>

１３．「Ctrl+Shift+F」を押し、ソースコードをフォーマッティング、「Ctrl+S」でファイルを保存。
１４．「動的Webアプリケーションをサーバーに配置する方法」の手順で、作成したプロジェクトをサーバーに配置します。
１５．「サーバーをデバッグモードで起動する方法」の手順で、サーバーを起動します。
１６．ブラウザで以下のURLにアクセスします。
http://localhost:8080/JSF22Sample202-h-commandButtonActionBeanValue/faces/index.xhtml

１７．以下の様に表示されれば成功です。



































１８．ソースコードは以下の様に出力されていました。(見やすく整形しています)
<html xmlns="http://www.w3.org/1999/xhtml">
    <head id="j_idt2"></head>
    <body>
        <form id="j_idt4" name="j_idt4" method="post" action="/JSF22Sample202-h-commandButtonActionBeanValue/faces/index.xhtml;jsessionid=99e90060394f2f796831df399a3a" enctype="application/x-www-form-urlencoded">
            <input type="hidden" name="j_idt4" value="j_idt4" />
            <input type="submit" name="j_idt4:j_idt5" value="移動" />
            <input type="hidden" name="javax.faces.ViewState" id="j_id1:javax.faces.ViewState:0" value="2120590524293682529:-6012974635607438027" autocomplete="off" />
        </form>
    </body>
</html>



【結論】
「input type="submit"」のボタンが出力されました。
特に画面の遷移先は記載されていません。
サーバ側で処理されると思われます。



以上です。

投稿者 0 コメント
ラベル:

h:commandButtonのactionで固定画面遷移

【目的】
JSF2.2でh:commandButtonを実行します。
commandButtonのactionで画面を固定で遷移します。



【手順１】
１．「JSF2.2プロジェクトの作成方法」の作成手順で、「JSF22Sample101-h-commandButtonAction」といプロジェクトを作成。
※プロジェクトの設定は以下の通り。
※他の項目は任意。
ウィザード名 項目名 項目に設定する値
動的 Web プロジェクト プロジェクト名 JSF22Sample101-h-commandButtonAction
ターゲット・ランタイム GlassFish 4.0
動的 web モジュールバージョン 3.1
プロジェクト・ファセット JavaServer Faces チェック有り バージョン(2.2)
Java ビルド・パス上のソース・フォルダー src
デフォルト出力フォルダー build\classes
Web モジュール コンテキスト・ルート JSF22Sample101-h-commandButtonAction
コンテンツ・ディレクトリー WebContent
web.xml デプロイメント記述子の作成 チェックあり
JSF 機能 JSF 実装ライブラリー GlassFish System Library
Configure JSF servlet in deployment descriptor チェック有り
JSF 構成ファイル /WEB-INF/faces-config.xml
JSF サーブレット名 Faces Servlet
JSF Servlet Class Name javax.faces.webapp.FacesServlet
URL マッピング・パターン /faces/*



２．「WebContent/WEB-INF/web.xml」を以下の様に入力。
<?xml version="1.0" encoding="UTF-8"?>
<web-app xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance"
    xmlns="http://xmlns.jcp.org/xml/ns/javaee"
    xsi:schemaLocation="http://xmlns.jcp.org/xml/ns/javaee http://xmlns.jcp.org/xml/ns/javaee/web-app_3_1.xsd"
    id="WebApp_ID" version="3.1">

    <display-name>JSF22Sample101-h-commandButtonAction</display-name>

    <welcome-file-list>
        <welcome-file>faces/index.xhtml</welcome-file>
    </welcome-file-list>

    <servlet>
        <servlet-name>Faces Servlet</servlet-name>
        <servlet-class>javax.faces.webapp.FacesServlet</servlet-class>
        <load-on-startup>1</load-on-startup>
    </servlet>

    <servlet-mapping>
        <servlet-name>Faces Servlet</servlet-name>
        <url-pattern>/faces/*</url-pattern>
    </servlet-mapping>
</web-app>

４．「Ctrl+Shift+F」を押し、ソースコードをフォーマッティング、「Ctrl+S」でファイルを保存。
５．「任意のファイルの作成方法」の手順で、「WebContent/」ディレクトリに「index.xhtml」というファイルを作成。
６．「index.xhtml」を以下の様に入力。
<html xmlns="http://www.w3.org/1999/xhtml"
    xmlns:h="http://xmlns.jcp.org/jsf/html">
<h:head>
</h:head>
<h:body>
    <h:form>
        <h:commandButton value="移動" action="page2" />
    </h:form>
</h:body>
</html>

７．「任意のファイルの作成方法」の手順で、「WebContent/」ディレクトリに「page2.xhtml」というファイルを作成。
８．「page2.xhtml」を以下の様に入力。
<html xmlns="http://www.w3.org/1999/xhtml"
    xmlns:h="http://xmlns.jcp.org/jsf/html">
<h:head>
</h:head>
<h:body>
    ページ２です。
</h:body>
</html>

９．「Ctrl+Shift+F」を押し、ソースコードをフォーマッティング、「Ctrl+S」でファイルを保存。
１０．「動的Webアプリケーションをサーバーに配置する方法」の手順で、作成したプロジェクトをサーバーに配置します。
１１．「サーバーをデバッグモードで起動する方法」の手順で、サーバーを起動します。
１２．ブラウザで以下のURLにアクセスします。
http://localhost:8080/JSF22Sample101-h-commandButtonAction/faces/index.xhtml

１３．以下の様に表示されれば成功です。



































１４．ソースコードは以下の様に出力されていました。(見やすく整形しています)
<html xmlns="http://www.w3.org/1999/xhtml">
    <head id="j_idt2">
    </head>
    <body>
        <form id="j_idt4" name="j_idt4" method="post" action="/JSF22Sample101-h-commandButtonAction/faces/index.xhtml" enctype="application/x-www-form-urlencoded">
            <input type="hidden" name="j_idt4" value="j_idt4" />
            <input type="submit" name="j_idt4:j_idt5" value="移動" />
            <input type="hidden" name="javax.faces.ViewState" id="j_id1:javax.faces.ViewState:0" value="5062835420762175325:7914364872365477917" autocomplete="off" />
        </form>
    </body>
</html>



【結論】
「input type="submit"」のボタンが出力されました。
特に画面の遷移先は記載されていません。
サーバ側で処理されると思われます。



以上です。

投稿者 0 コメント
ラベル:

2013年7月25日木曜日

h:formの出力内容

【目的】
JSF2.2でh:formを実行します。
formのみを出力します。
※特に意味はありませんが、JSF2.2でformがどのようなHTMLを出力するのかを確認します。



【手順１】
１．「JSF2.2プロジェクトの作成方法」の作成手順で、「JSF22Sample101-h-form」といプロジェクトを作成。
※プロジェクトの設定は以下の通り。
※他の項目は任意。
ウィザード名 項目名 項目に設定する値
動的 Web プロジェクト プロジェクト名 JSF22Sample101-h-form
ターゲット・ランタイム GlassFish 4.0
動的 web モジュールバージョン 3.1
プロジェクト・ファセット JavaServer Faces チェック有り バージョン(2.2)
Java ビルド・パス上のソース・フォルダー src
デフォルト出力フォルダー build\classes
Web モジュール コンテキスト・ルート JSF22Sample101-h-form
コンテンツ・ディレクトリー WebContent
web.xml デプロイメント記述子の作成 チェックあり
JSF 機能 JSF 実装ライブラリー GlassFish System Library
Configure JSF servlet in deployment descriptor チェック有り
JSF 構成ファイル /WEB-INF/faces-config.xml
JSF サーブレット名 Faces Servlet
JSF Servlet Class Name javax.faces.webapp.FacesServlet
URL マッピング・パターン /faces/*



２．「WebContent/WEB-INF/web.xml」を以下の様に入力。
<?xml version="1.0" encoding="UTF-8"?>
<web-app xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance"
    xmlns="http://xmlns.jcp.org/xml/ns/javaee"
    xsi:schemaLocation="http://xmlns.jcp.org/xml/ns/javaee http://xmlns.jcp.org/xml/ns/javaee/web-app_3_1.xsd"
    id="WebApp_ID" version="3.1">

    <display-name>JSF22Sample101-h-form</display-name>

    <welcome-file-list>
        <welcome-file>faces/index.xhtml</welcome-file>
    </welcome-file-list>

    <servlet>
        <servlet-name>Faces Servlet</servlet-name>
        <servlet-class>javax.faces.webapp.FacesServlet</servlet-class>
        <load-on-startup>1</load-on-startup>
    </servlet>

    <servlet-mapping>
        <servlet-name>Faces Servlet</servlet-name>
        <url-pattern>/faces/*</url-pattern>
    </servlet-mapping>
</web-app>

４．「Ctrl+Shift+F」を押し、ソースコードをフォーマッティング、「Ctrl+S」でファイルを保存。
５．「任意のファイルの作成方法」の手順で、「WebContent/」ディレクトリに「index.xhtml」というファイルを作成。
６．「index.xhtml」を以下の様に入力。
<html xmlns="http://www.w3.org/1999/xhtml"
    xmlns:h="http://xmlns.jcp.org/jsf/html">
<h:head>
</h:head>
<h:body>
    <h:form>
        formのみ。
    </h:form>
</h:body>
</html>

７．「Ctrl+Shift+F」を押し、ソースコードをフォーマッティング、「Ctrl+S」でファイルを保存。
８．「動的Webアプリケーションをサーバーに配置する方法」の手順で、作成したプロジェクトをサーバーに配置します。
９．「サーバーをデバッグモードで起動する方法」の手順で、サーバーを起動します。
１０．ブラウザで以下のURLにアクセスします。
http://localhost:8080/JSF22Sample101-h-form/faces/index.xhtml

１１．以下の様に表示されれば成功です。













































１２．ソースコードは以下の様に出力されていました。(見やすく整形しています)
<html xmlns="http://www.w3.org/1999/xhtml">
    <head id="j_idt2">
    </head>
    <body>
        <form id="j_idt4" name="j_idt4" method="post" action="/JSF22Sample101-h-form/faces/index.xhtml;jsessionid=4d320b02deee3bea332ab37d7c78" enctype="application/x-www-form-urlencoded">
            <input type="hidden" name="j_idt4" value="j_idt4" />
            formのみ。
            <input type="hidden" name="javax.faces.ViewState" id="j_id1:javax.faces.ViewState:0" value="-6567124597442535192:1682591068202106085" autocomplete="off" />
        </form>
    </body>
</html>



【結論】
formのタグのみで、上記のformタグと2つのhiddenタグが出力されるようです。



以上です。

投稿者 0 コメント
ラベル:

h:outputTextでBeanの値をエスケープ無しで出力

【目的】
JSF2.2でh:outputTextを実行します。
ManagedBean(マネージドビーン)の値をエスケープ無しで出力します。
※今回はCDIのマネージドビーンを使用しています。



【手順１】
１．「JSF2.2プロジェクトの作成方法」の作成手順で、「JSF22Sample007-h-outputTextBeanValueNoEscape」といプロジェクトを作成。
※プロジェクトの設定は以下の通り。
※他の項目は任意。
ウィザード名 項目名 項目に設定する値
動的 Web プロジェクト プロジェクト名 JSF22Sample007-h-outputTextBeanValueNoEscape
ターゲット・ランタイム GlassFish 4.0
動的 web モジュールバージョン 3.1
プロジェクト・ファセット JavaServer Faces チェック有り バージョン(2.2)
Java ビルド・パス上のソース・フォルダー src
デフォルト出力フォルダー build\classes
Web モジュール コンテキスト・ルート JSF22Sample007-h-outputTextBeanValueNoEscape
コンテンツ・ディレクトリー WebContent
web.xml デプロイメント記述子の作成 チェックあり
JSF 機能 JSF 実装ライブラリー GlassFish System Library
Configure JSF servlet in deployment descriptor チェック有り
JSF 構成ファイル /WEB-INF/faces-config.xml
JSF サーブレット名 Faces Servlet
JSF Servlet Class Name javax.faces.webapp.FacesServlet
URL マッピング・パターン /faces/*



２．「WebContent/WEB-INF/web.xml」を以下の様に入力。
<?xml version="1.0" encoding="UTF-8"?>
<web-app xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance"
    xmlns="http://xmlns.jcp.org/xml/ns/javaee"
    xsi:schemaLocation="http://xmlns.jcp.org/xml/ns/javaee http://xmlns.jcp.org/xml/ns/javaee/web-app_3_1.xsd"
    id="WebApp_ID" version="3.1">

    <display-name>JSF22Sample007-h-outputTextBeanValueNoEscape</display-name>

    <welcome-file-list>
        <welcome-file>faces/index.xhtml</welcome-file>
    </welcome-file-list>

    <servlet>
        <servlet-name>Faces Servlet</servlet-name>
        <servlet-class>javax.faces.webapp.FacesServlet</servlet-class>
        <load-on-startup>1</load-on-startup>
    </servlet>

    <servlet-mapping>
        <servlet-name>Faces Servlet</servlet-name>
        <url-pattern>/faces/*</url-pattern>
    </servlet-mapping>
</web-app>

４．「Ctrl+Shift+F」を押し、ソースコードをフォーマッティング、「Ctrl+S」でファイルを保存。
５．「Javaパッケージの作成方法」の手順で、「sample」というパッケージを作成。
６．「Javaクラスファイルの作成方法」の手順で、「SampleBean.java」というクラスファイルを作成。
７．「SampleBean.java」を以下の様に入力。
package sample;

import javax.annotation.PostConstruct;
import javax.enterprise.context.RequestScoped;
import javax.inject.Named;

@Named
@RequestScoped
public class SampleBean {
    private String text;

    @PostConstruct
    public void init() {
        this.text = "あいうえお<br />かきくけこ";
    }

    public String getText() {
        return text;
    }

    public void setText(String text) {
        this.text = text;
    }
}

８．「Ctrl+Shift+F」を押し、ソースコードをフォーマッティング、「Ctrl+S」でファイルを保存。
９．「任意のファイルの作成方法」の手順で、「WebContent/」ディレクトリに「index.xhtml」というファイルを作成。
１０．「index.xhtml」を以下の様に入力。
<html xmlns="http://www.w3.org/1999/xhtml"
      xmlns:h="http://xmlns.jcp.org/jsf/html">
<h:head>
</h:head>
<h:body>
    <h:outputText value="#{sampleBean.text}" escape="false" />
</h:body>
</html>

１１．「Ctrl+Shift+F」を押し、ソースコードをフォーマッティング、「Ctrl+S」でファイルを保存。
１２．「動的Webアプリケーションをサーバーに配置する方法」の手順で、作成したプロジェクトをサーバーに配置します。
１３．「サーバーをデバッグモードで起動する方法」の手順で、サーバーを起動します。
１４．ブラウザで以下のURLにアクセスします。
http://localhost:8080/JSF22Sample007-h-outputTextBeanValueNoEscape/faces/index.xhtml

１５．以下の様に表示されれば成功です。









































１６．ソースコードは以下の様に出力されていました。(見やすく整形しています)
<html xmlns="http://www.w3.org/1999/xhtml">
    <head id="j_idt2">
    </head>
    <body>
        あいうえお<br />かきくけこ
    </body>
</html>



【結論】
特に何かタグが出力されるわけではなく、そのまま文字列が表示されました。
文字列の中に入力されていたHTMLは、エスケープされずにそのままHTMLとして出力されました。



以上です。

投稿者 0 コメント
ラベル:

h:outputTextでBeanの値を出力

【目的】
JSF2.2でh:outputTextを実行します。
ManagedBean(マネージドビーン)の値を出力します。
※今回はCDIのマネージドビーンを使用しています。



【手順１】
１．「JSF2.2プロジェクトの作成方法」の作成手順で、「JSF22Sample006-h-outputTextBeanValue」といプロジェクトを作成。
※プロジェクトの設定は以下の通り。
※他の項目は任意。
ウィザード名 項目名 項目に設定する値
動的 Web プロジェクト プロジェクト名 JSF22Sample006-h-outputTextBeanValue
ターゲット・ランタイム GlassFish 4.0
動的 web モジュールバージョン 3.1
プロジェクト・ファセット JavaServer Faces チェック有り バージョン(2.2)
Java ビルド・パス上のソース・フォルダー src
デフォルト出力フォルダー build\classes
Web モジュール コンテキスト・ルート JSF22Sample006-h-outputTextBeanValue
コンテンツ・ディレクトリー WebContent
web.xml デプロイメント記述子の作成 チェックあり
JSF 機能 JSF 実装ライブラリー GlassFish System Library
Configure JSF servlet in deployment descriptor チェック有り
JSF 構成ファイル /WEB-INF/faces-config.xml
JSF サーブレット名 Faces Servlet
JSF Servlet Class Name javax.faces.webapp.FacesServlet
URL マッピング・パターン /faces/*



２．「WebContent/WEB-INF/web.xml」を以下の様に入力。
<?xml version="1.0" encoding="UTF-8"?>
<web-app xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance"
    xmlns="http://xmlns.jcp.org/xml/ns/javaee"
    xsi:schemaLocation="http://xmlns.jcp.org/xml/ns/javaee http://xmlns.jcp.org/xml/ns/javaee/web-app_3_1.xsd"
    id="WebApp_ID" version="3.1">

    <display-name>JSF22Sample006-h-outputTextBeanValue</display-name>

    <welcome-file-list>
        <welcome-file>faces/index.xhtml</welcome-file>
    </welcome-file-list>

    <servlet>
        <servlet-name>Faces Servlet</servlet-name>
        <servlet-class>javax.faces.webapp.FacesServlet</servlet-class>
        <load-on-startup>1</load-on-startup>
    </servlet>

    <servlet-mapping>
        <servlet-name>Faces Servlet</servlet-name>
        <url-pattern>/faces/*</url-pattern>
    </servlet-mapping>
</web-app>

４．「Ctrl+Shift+F」を押し、ソースコードをフォーマッティング、「Ctrl+S」でファイルを保存。
５．「Javaパッケージの作成方法」の手順で、「sample」というパッケージを作成。
６．「Javaクラスファイルの作成方法」の手順で、「SampleBean.java」というクラスファイルを作成。
７．「SampleBean.java」を以下の様に入力。
package sample;

import javax.annotation.PostConstruct;
import javax.enterprise.context.RequestScoped;
import javax.inject.Named;

@Named
@RequestScoped
public class SampleBean {
    private String text;

    @PostConstruct
    public void init() {
        this.text = "あいうえお<br />かきくけこ";
    }

    public String getText() {
        return text;
    }

    public void setText(String text) {
        this.text = text;
    }
}

８．「Ctrl+Shift+F」を押し、ソースコードをフォーマッティング、「Ctrl+S」でファイルを保存。
９．「任意のファイルの作成方法」の手順で、「WebContent/」ディレクトリに「index.xhtml」というファイルを作成。
１０．「index.xhtml」を以下の様に入力。
<html xmlns="http://www.w3.org/1999/xhtml"
      xmlns:h="http://xmlns.jcp.org/jsf/html">
<h:head>
</h:head>
<h:body>
    <h:outputText value="#{sampleBean.text}" />
</h:body>
</html>

１１．「Ctrl+Shift+F」を押し、ソースコードをフォーマッティング、「Ctrl+S」でファイルを保存。
１２．「動的Webアプリケーションをサーバーに配置する方法」の手順で、作成したプロジェクトをサーバーに配置します。
１３．「サーバーをデバッグモードで起動する方法」の手順で、サーバーを起動します。
１４．ブラウザで以下のURLにアクセスします。
http://localhost:8080/JSF22Sample006-h-outputTextBeanValue/faces/index.xhtml

１５．以下の様に表示されれば成功です。









































１６．ソースコードは以下の様に出力されていました。(見やすく整形しています)
<html xmlns="http://www.w3.org/1999/xhtml">
    <head id="j_idt2">
    </head>
    <body>
        あいうえお&lt;br /&gt;かきくけこ
    </body>
</html>



【結論】
特に何かタグが出力されるわけではなく、そのまま文字列が表示されました。
文字列の中にHTMLが入力されていた場合は、エスケープされてHTMLが文字列として表示されました。



以上です。

投稿者 0 コメント
ラベル:

h:outputTextでstyleのclassを設定

【目的】
JSF2.2でh:outputTextを実行します。
class属性を使用し、スタイルのクラスを設定します。



【手順１】
１．「JSF2.2プロジェクトの作成方法」の作成手順で、「JSF22Sample005-h-outputTextStyleClass」といプロジェクトを作成。
※プロジェクトの設定は以下の通り。
※他の項目は任意。
ウィザード名 項目名 項目に設定する値
動的 Web プロジェクト プロジェクト名 JSF22Sample005-h-outputTextStyleClass
ターゲット・ランタイム GlassFish 4.0
動的 web モジュールバージョン 3.1
プロジェクト・ファセット JavaServer Faces チェック有り バージョン(2.2)
Java ビルド・パス上のソース・フォルダー src
デフォルト出力フォルダー build\classes
Web モジュール コンテキスト・ルート JSF22Sample005-h-outputTextStyleClass
コンテンツ・ディレクトリー WebContent
web.xml デプロイメント記述子の作成 チェックあり
JSF 機能 JSF 実装ライブラリー GlassFish System Library
Configure JSF servlet in deployment descriptor チェック有り
JSF 構成ファイル /WEB-INF/faces-config.xml
JSF サーブレット名 Faces Servlet
JSF Servlet Class Name javax.faces.webapp.FacesServlet
URL マッピング・パターン /faces/*



２．「WebContent/WEB-INF/web.xml」を以下の様に入力。
<?xml version="1.0" encoding="UTF-8"?>
<web-app xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance"
    xmlns="http://xmlns.jcp.org/xml/ns/javaee"
    xsi:schemaLocation="http://xmlns.jcp.org/xml/ns/javaee http://xmlns.jcp.org/xml/ns/javaee/web-app_3_1.xsd"
    id="WebApp_ID" version="3.1">

    <display-name>JSF22Sample005-h-outputTextStyleClass</display-name>

    <welcome-file-list>
        <welcome-file>faces/index.xhtml</welcome-file>
    </welcome-file-list>

    <servlet>
        <servlet-name>Faces Servlet</servlet-name>
        <servlet-class>javax.faces.webapp.FacesServlet</servlet-class>
        <load-on-startup>1</load-on-startup>
    </servlet>

    <servlet-mapping>
        <servlet-name>Faces Servlet</servlet-name>
        <url-pattern>/faces/*</url-pattern>
    </servlet-mapping>
</web-app>

４．「Ctrl+Shift+F」を押し、ソースコードをフォーマッティング、「Ctrl+S」でファイルを保存。
５．「任意のファイルの作成方法」の手順で、「WebContent/」ディレクトリに「index.xhtml」というファイルを作成。
６．「index.xhtml」を以下の様に入力。
<html xmlns="http://www.w3.org/1999/xhtml"
    xmlns:h="http://xmlns.jcp.org/jsf/html">
<h:head>
    <style>
        .mainColor {
            color: blue;
        }
    </style>
</h:head>
<h:body>
    <h:outputText value="styleのclassを適応" styleClass="mainColor" />
</h:body>
</html>

７．「Ctrl+Shift+F」を押し、ソースコードをフォーマッティング、「Ctrl+S」でファイルを保存。
８．「動的Webアプリケーションをサーバーに配置する方法」の手順で、作成したプロジェクトをサーバーに配置します。
９．「サーバーをデバッグモードで起動する方法」の手順で、サーバーを起動します。
１０．ブラウザで以下のURLにアクセスします。
http://localhost:8080/JSF22Sample005-h-outputTextStyleClass/faces/index.xhtml

１１．以下の様に表示されれば成功です。









































１２．ソースコードは以下の様に出力されていました。(見やすく整形しています)
<html xmlns="http://www.w3.org/1999/xhtml">
    <head id="j_idt2">
        <style>
            .mainColor {
                color: blue;
            }
        </style>
    </head>
    <body>
        <span class="mainColor">styleのclassを適応</span>
    </body>
</html>



【結論】
styleのclassがセットされた場合、spanタグで囲まれて文字列が表示されました。



以上です。
投稿者 0 コメント
ラベル:

h:outputTextでstyleを設定

【目的】
JSF2.2でh:outputTextを実行します。
style属性を使用し、インラインのスタイルを設定します。



【手順１】
１．「JSF2.2プロジェクトの作成方法」の作成手順で、「JSF22Sample004-h-outputTextStyle」といプロジェクトを作成。
※プロジェクトの設定は以下の通り。
※他の項目は任意。
ウィザード名 項目名 項目に設定する値
動的 Web プロジェクト プロジェクト名 JSF22Sample004-h-outputTextStyle
ターゲット・ランタイム GlassFish 4.0
動的 web モジュールバージョン 3.1
プロジェクト・ファセット JavaServer Faces チェック有り バージョン(2.2)
Java ビルド・パス上のソース・フォルダー src
デフォルト出力フォルダー build\classes
Web モジュール コンテキスト・ルート JSF22Sample004-h-outputTextStyle
コンテンツ・ディレクトリー WebContent
web.xml デプロイメント記述子の作成 チェックあり
JSF 機能 JSF 実装ライブラリー GlassFish System Library
Configure JSF servlet in deployment descriptor チェック有り
JSF 構成ファイル /WEB-INF/faces-config.xml
JSF サーブレット名 Faces Servlet
JSF Servlet Class Name javax.faces.webapp.FacesServlet
URL マッピング・パターン /faces/*



２．「WebContent/WEB-INF/web.xml」を以下の様に入力。
<?xml version="1.0" encoding="UTF-8"?>
<web-app xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance"
    xmlns="http://xmlns.jcp.org/xml/ns/javaee"
    xsi:schemaLocation="http://xmlns.jcp.org/xml/ns/javaee http://xmlns.jcp.org/xml/ns/javaee/web-app_3_1.xsd"
    id="WebApp_ID" version="3.1">

    <display-name>JSF22Sample004-h-outputTextStyle</display-name>

    <welcome-file-list>
        <welcome-file>faces/index.xhtml</welcome-file>
    </welcome-file-list>

    <servlet>
        <servlet-name>Faces Servlet</servlet-name>
        <servlet-class>javax.faces.webapp.FacesServlet</servlet-class>
        <load-on-startup>1</load-on-startup>
    </servlet>

    <servlet-mapping>
        <servlet-name>Faces Servlet</servlet-name>
        <url-pattern>/faces/*</url-pattern>
    </servlet-mapping>
</web-app>

４．「Ctrl+Shift+F」を押し、ソースコードをフォーマッティング、「Ctrl+S」でファイルを保存。
５．「任意のファイルの作成方法」の手順で、「WebContent/」ディレクトリに「index.xhtml」というファイルを作成。
６．「index.xhtml」を以下の様に入力。
<html xmlns="http://www.w3.org/1999/xhtml"
      xmlns:h="http://xmlns.jcp.org/jsf/html">
<h:head>
</h:head>
<h:body>
    <h:outputText value="インラインのstyleを適応" style="color: blue;" />
</h:body>
</html>

７．「Ctrl+Shift+F」を押し、ソースコードをフォーマッティング、「Ctrl+S」でファイルを保存。
８．「動的Webアプリケーションをサーバーに配置する方法」の手順で、作成したプロジェクトをサーバーに配置します。
９．「サーバーをデバッグモードで起動する方法」の手順で、サーバーを起動します。
１０．ブラウザで以下のURLにアクセスします。
http://localhost:8080/JSF22Sample004-h-outputTextStyle/faces/index.xhtml

１１．以下の様に表示されれば成功です。









































１２．ソースコードは以下の様に出力されていました。(見やすく整形しています)
<html xmlns="http://www.w3.org/1999/xhtml">
    <head id="j_idt2">
    </head>
    <body>
        <span style="color: blue;">インラインのstyleを適応</span>
    </body>
</html>



【結論】
styleがセットされた場合、spanタグで囲まれて文字列が表示されました。



以上です。
投稿者 0 コメント
ラベル:

h:outputTextで表示・非表示

【目的】
JSF2.2でh:outputTextを実行します。
rendered属性を使用し、文字列の表示非表示を制御します。



【手順１】
１．「JSF2.2プロジェクトの作成方法」の作成手順で、「JSF22Sample003-h-outputTextRendered」といプロジェクトを作成。
※プロジェクトの設定は以下の通り。
※他の項目は任意。
ウィザード名 項目名 項目に設定する値
動的 Web プロジェクト プロジェクト名 JSF22Sample003-h-outputTextRendered
ターゲット・ランタイム GlassFish 4.0
動的 web モジュールバージョン 3.1
プロジェクト・ファセット JavaServer Faces チェック有り バージョン(2.2)
Java ビルド・パス上のソース・フォルダー src
デフォルト出力フォルダー build\classes
Web モジュール コンテキスト・ルート JSF22Sample003-h-outputTextRendered
コンテンツ・ディレクトリー WebContent
web.xml デプロイメント記述子の作成 チェックあり
JSF 機能 JSF 実装ライブラリー GlassFish System Library
Configure JSF servlet in deployment descriptor チェック有り
JSF 構成ファイル /WEB-INF/faces-config.xml
JSF サーブレット名 Faces Servlet
JSF Servlet Class Name javax.faces.webapp.FacesServlet
URL マッピング・パターン /faces/*



２．「WebContent/WEB-INF/web.xml」を以下の様に入力。
<?xml version="1.0" encoding="UTF-8"?>
<web-app xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance"
    xmlns="http://xmlns.jcp.org/xml/ns/javaee"
    xsi:schemaLocation="http://xmlns.jcp.org/xml/ns/javaee http://xmlns.jcp.org/xml/ns/javaee/web-app_3_1.xsd"
    id="WebApp_ID" version="3.1">

    <display-name>JSF22Sample003-h-outputTextRendered</display-name>

    <welcome-file-list>
        <welcome-file>faces/index.xhtml</welcome-file>
    </welcome-file-list>

    <servlet>
        <servlet-name>Faces Servlet</servlet-name>
        <servlet-class>javax.faces.webapp.FacesServlet</servlet-class>
        <load-on-startup>1</load-on-startup>
    </servlet>

    <servlet-mapping>
        <servlet-name>Faces Servlet</servlet-name>
        <url-pattern>/faces/*</url-pattern>
    </servlet-mapping>
</web-app>

４．「Ctrl+Shift+F」を押し、ソースコードをフォーマッティング、「Ctrl+S」でファイルを保存。
５．「任意のファイルの作成方法」の手順で、「WebContent/」ディレクトリに「index.xhtml」というファイルを作成。
６．「index.xhtml」を以下の様に入力。
<html xmlns="http://www.w3.org/1999/xhtml"
      xmlns:h="http://xmlns.jcp.org/jsf/html">
<h:head>
</h:head>
<h:body>
    <h:outputText value="こっちは表示されない。" rendered="false" />
    <h:outputText value="こっちが表示される。" rendered="true" />
</h:body>
</html>

７．「Ctrl+Shift+F」を押し、ソースコードをフォーマッティング、「Ctrl+S」でファイルを保存。
８．「動的Webアプリケーションをサーバーに配置する方法」の手順で、作成したプロジェクトをサーバーに配置します。
９．「サーバーをデバッグモードで起動する方法」の手順で、サーバーを起動します。
１０．ブラウザで以下のURLにアクセスします。
http://localhost:8080/JSF22Sample003-h-outputTextRendered/faces/index.xhtml

１１．以下の様に表示されれば成功です。









































１２．ソースコードは以下の様に出力されていました。(見やすく整形しています)
<html xmlns="http://www.w3.org/1999/xhtml">
    <head id="j_idt2">
    </head>
    <body>
        こっちが表示される。
    </body>
</html>



【結論】
renderedが"true"の文字列のみ表示されました。
タグが出力されるわけではなく、そのまま文字列が表示されました。
また、renderedが"false"の方は、HTMLのソースコードにすら何も表示されませんでした。



以上です。

投稿者 0 コメント
ラベル:

h:outputTextで固定文字列

【目的】
JSF2.2でh:outputTextを実行します。
固定文字列を出力します。



【手順１】
１．「JSF2.2プロジェクトの作成方法」の作成手順で、「JSF22Sample002-h-outputText」といプロジェクトを作成。
※プロジェクトの設定は以下の通り。
※他の項目は任意。
ウィザード名 項目名 項目に設定する値
動的 Web プロジェクト プロジェクト名 JSF22Sample002-h-outputText
ターゲット・ランタイム GlassFish 4.0
動的 web モジュールバージョン 3.1
プロジェクト・ファセット JavaServer Faces チェック有り バージョン(2.2)
Java ビルド・パス上のソース・フォルダー src
デフォルト出力フォルダー build\classes
Web モジュール コンテキスト・ルート JSF22Sample002-h-outputText
コンテンツ・ディレクトリー WebContent
web.xml デプロイメント記述子の作成 チェックあり
JSF 機能 JSF 実装ライブラリー GlassFish System Library
Configure JSF servlet in deployment descriptor チェック有り
JSF 構成ファイル /WEB-INF/faces-config.xml
JSF サーブレット名 Faces Servlet
JSF Servlet Class Name javax.faces.webapp.FacesServlet
URL マッピング・パターン /faces/*



２．「WebContent/WEB-INF/web.xml」を以下の様に入力。
<?xml version="1.0" encoding="UTF-8"?>
<web-app xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance"
    xmlns="http://xmlns.jcp.org/xml/ns/javaee"
    xsi:schemaLocation="http://xmlns.jcp.org/xml/ns/javaee http://xmlns.jcp.org/xml/ns/javaee/web-app_3_1.xsd"
    id="WebApp_ID" version="3.1">

    <display-name>JSF22Sample002-h-outputText</display-name>

    <welcome-file-list>
        <welcome-file>faces/index.xhtml</welcome-file>
    </welcome-file-list>

    <servlet>
        <servlet-name>Faces Servlet</servlet-name>
        <servlet-class>javax.faces.webapp.FacesServlet</servlet-class>
        <load-on-startup>1</load-on-startup>
    </servlet>

    <servlet-mapping>
        <servlet-name>Faces Servlet</servlet-name>
        <url-pattern>/faces/*</url-pattern>
    </servlet-mapping>
</web-app>

４．「Ctrl+Shift+F」を押し、ソースコードをフォーマッティング、「Ctrl+S」でファイルを保存。
５．「任意のファイルの作成方法」の手順で、「WebContent/」ディレクトリに「index.xhtml」というファイルを作成。
６．「index.xhtml」を以下の様に入力。
<html xmlns="http://www.w3.org/1999/xhtml"
      xmlns:h="http://xmlns.jcp.org/jsf/html">
<h:head>
</h:head>
<h:body>
    <h:outputText value="ハロー　JSF2.2　ワールド！" />
</h:body>
</html>

７．「Ctrl+Shift+F」を押し、ソースコードをフォーマッティング、「Ctrl+S」でファイルを保存。
８．「動的Webアプリケーションをサーバーに配置する方法」の手順で、作成したプロジェクトをサーバーに配置します。
９．「サーバーをデバッグモードで起動する方法」の手順で、サーバーを起動します。
１０．ブラウザで以下のURLにアクセスします。
http://localhost:8080/JSF22Sample002-h-outputText/faces/index.xhtml

１１．以下の様に表示されれば成功です。









































１２．ソースコードは以下の様に出力されていました。(見やすく整形しています)
<html xmlns="http://www.w3.org/1999/xhtml">
    <head id="j_idt2">
    </head>
    <body>
        ハロー　JSF2.2　ワールド！
    </body>
</html>



【結論】
特に何かタグが出力されるわけではなく、そのまま文字列が表示されました。
固定文字列の場合は、わざわざh:outputTextを使う必要がないのかもしれません。



以上です。
投稿者 0 コメント
ラベル:

ナビゲーションバー(ドロップダウンサブメニュー)

【目的】
Twitter Bootstrap2.3.1でナビゲーションバーにドロップダウンのサブメニューを指定します。



【準備】
１．「Twitter Bootstrap2.3.1の使用方法」の手順の通り、Twitter Bootstrapを配置しておきます。



【手順１】
１．HTMLファイル「index.html」(任意)を作成。
２．「index.html」を以下の様に入力。
<!DOCTYPE html>
<html>
    <head>
        <link href="bootstrap/css/bootstrap.min.css" rel="stylesheet" />
    </head>
    <body>
        <div class="navbar">
            <div class="navbar-inner">
                <ul class="nav">
                    <li class="dropdown">
                        <a class="dropdown-toggle" data-toggle="dropdown" href="#">
                            その他
                            <b class="caret"></b>
                        </a>
                        <ul class="dropdown-menu">
                            <li><a href="http://google.com">Google</a></li>
                            <li><a href="http://yahoo.com">Yahoo</a></li>
                            <li class="dropdown-submenu">
                            <a tabindex="-1" href="#">More options</a>
                            <ul class="dropdown-menu">
                                <li><a href="http://google.com">Google</a></li>
                                <li><a href="http://yahoo.com">Yahoo</a></li>
                            </ul>
                        </li>
                        </ul>
                    </li>
                </ul>
            </div>
        </div>

        <script src="http://code.jquery.com/jquery.js"></script>
        <script src="bootstrap/js/bootstrap.min.js"></script>
    </body>
</html>



【手順２】
１．ブラウザで「index.html」を開き、以下の様に表示されれば成功です。































以上です。

投稿者 0 コメント
ラベル:

2013年7月19日金曜日

JSF2.2プロジェクトの実行方法

【目的】
JSF2.2のプロジェクトを作成し、実行します。



【手順１】
１．「JSF2.2のプロジェクトの作成方法」の手順で、プロジェクトを作成します。
２．「動的Webアプリケーションをサーバーに配置する方法」の手順で、作成したプロジェクトをサーバーに配置します。
３．「サーバーをデバッグモードで起動する方法」の手順で、サーバーを起動します。
４．ブラウザで以下のURLにアクセスします。
※JSF22Sample001-HelloWorldはプロジェクトのコンテキスト・ルート名。

http://localhost:8080/JSF22Sample001-HelloWorld/faces/index.xhtml

５．以下の様に表示されれば成功です。





































以上です。

投稿者 0 コメント
ラベル:

JSF2.2プロジェクトの作成方法

【目的】
JSF2.2のプロジェクトを作成し、実行します。



【準備】
１．「Eclipse 4.3.0 Kepler(64ビット版)のインストール(解凍)方法」の手順で、Eclipseをインストール。
２．「サーバー・アダプターの追加方法(GlassFish)」の手順を実施。
３．「サーバー・ランタイムの設定(GlassFish4)」の手順を実施。



【手順１】
１．「Eclipse 4.3.0 Kepler(64ビット版)の起動方法」の手順で、Eclipseを起動。
２．メニューの「ファイル」⇒「新規」⇒「プロジェクト」を選択。




【手順２】
１．「Web」⇒「動的Webプロジェクト」を選択。
２．「次へ」ボタンをクリック。




【手順３】
１．「プロジェクト名」に「JSF22Sample001-HelloWorld」と入力。
２．ターゲット・ランタイムは「GlassFish 4.0」を選択。
３．構成の「変更」ボタンをクリック。




【手順４】
１．「JavaServer Faces」を選択。
２．「OK」ボタンをクリック。




【手順５】
１．「次へ」ボタンをクリック。




【手順６】
１．「次へ」ボタンをクリック。




【手順７】
１．「web.xmlデプロイメント記述子の生成」を選択。
２．「次へ」ボタンをクリック。




【手順８】
１．「完了」ボタンをクリック。




【手順９】
１．以下の様に、動的プロジェクトが作成されます。



































【手順１０】
１．「WebContent/WEB-INF/web.xml」を以下の様に入力。
<?xml version="1.0" encoding="UTF-8"?>
<web-app xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance"
    xmlns="http://xmlns.jcp.org/xml/ns/javaee"
    xsi:schemaLocation="http://xmlns.jcp.org/xml/ns/javaee http://xmlns.jcp.org/xml/ns/javaee/web-app_3_1.xsd"
    id="WebApp_ID" version="3.1">

    <display-name>JSF22Sample001-HelloWorld</display-name>

    <welcome-file-list>
        <welcome-file>faces/index.xhtml</welcome-file>
    </welcome-file-list>

    <servlet>
        <servlet-name>Faces Servlet</servlet-name>
        <servlet-class>javax.faces.webapp.FacesServlet</servlet-class>
        <load-on-startup>1</load-on-startup>
    </servlet>

    <servlet-mapping>
        <servlet-name>Faces Servlet</servlet-name>
        <url-pattern>/faces/*</url-pattern>
    </servlet-mapping>
</web-app>
２．「Ctrl+Shift+F」を押し、ソースコードをフォーマッティング、「Ctrl+S」でファイルを保存。



【手順１１】
１．「faces-config.xml」を以下の様に入力。
<?xml version="1.0" encoding="UTF-8"?>
<faces-config xmlns="http://xmlns.jcp.org/xml/ns/javaee"
    xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance"
    xsi:schemaLocation="http://xmlns.jcp.org/xml/ns/javaee http://xmlns.jcp.org/xml/ns/javaee/web-facesconfig_2_2.xsd"
    version="2.2">

</faces-config>
２．「Ctrl+Shift+F」を押し、ソースコードをフォーマッティング、「Ctrl+S」でファイルを保存。



【手順１２】
１．「任意のファイルの作成方法」の手順で、「WebContent/」ディレクトリに「index.xhtml」というファイルを作成。
２．「index.xhtml」を以下の様に入力。
<html xmlns="http://www.w3.org/1999/xhtml"
      xmlns:h="http://xmlns.jcp.org/jsf/html">
<h:head>
</h:head>
<h:body>
    <h:outputText value="ハローワールド JSF2.2"/>
</h:body>
</html>
３．「Ctrl+Shift+F」を押し、ソースコードをフォーマッティング、「Ctrl+S」でファイルを保存。



以上です。

投稿者 0 コメント
ラベル:

m5simpleTextCount(改)

【目的】
テキストボックス・テキストエリアで入力文字数の最大値・現在値を表示したい。



【本家】
改造元のプラグインはこちら⇒「m5simpleTextCount」



【変更点】
１．jQuery1.10.x以降でも動作するように修正。
２．最大値を分母に表示するように修正。
３．色のデフォルトの値を修正。
４．警告色となる閾値のデフォルトの値を修正。
５．フォーカス時に表示されるようにデフォルトの値を修正。



【使い方】
<input class="countText10" type="text" />

<textarea class="countText200" rows="10"></textarea>


<script src="//ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js"></script>
<script src="//sites.google.com/site/foolprogrammer/m5simpleTextCount.js?attredirects=0&d=1"></script>

<script type="text/javascript">
$('.countText10').m5simpleTextCount({
    maxLength: 10
});
$('.countText200').m5simpleTextCount({
    maxLength: 200
});
</script>
※詳しい使い方は本家を御覧ください。



【サンプル】











【ソースコード】
/**
 * m5simpleTextCount
 *
 * @version      1.0
 * @author       nori (norimania@gmail.com)
 * @copyright    5509 (http://5509.me/)
 * @license      The MIT License
 * @link         http://5509.me/log/m5simpletextcount
 *
 * Date: 2010-12-05 21:20
 */

(function($) {
    
    $.fn.m5simpleTextCount = function(options) {
        var conf = $.extend({
                focusDisplay: true,
                padding: '3px',
                color: '#3a87ad',
                atColor: '#b94a48',
                background: '#d9edf7',
                atBackground: '#f2dede',
                fontWeight: 'bold',
                atFontWeight: 'bold',
                opacity: .8,
                alertLength: -1,
                maxLength: 10
            }, options);
            
        $(this).each(function() {
            var target = $(this),
                targetOffset = target.offset(),
                border = {
                    rightWidth: parseInt(target.css('borderRightWidth')),
                    bottomWidth: parseInt(target.css('borderBottomWidth'))
                },
                currentCount = getCount(target),
                count = $('<span class="simpleTextCount"></span>')
                    .css({
                        padding: conf.padding,
                        display: 'block',
                        position: 'absolute',
                        color: conf.color,
                        background: conf.background,
                        fontWeight: conf.fontWeight,
                        opacity: conf.opacity
                    })
                    .text(currentCount + '/' + conf.maxLength),
                pos = {};
                
            countStyle(currentCount, count);
            
            $(window).resize(function() {
                setCountPos(count, getPos(target, count), border)
            });
            $('body').append(count);
            setCountPos(count, getPos(target, count), border);
            
            if ( conf.focusDisplay ) {
                count.hide();
                target
                    .focus(function() {
                        count.stop(true, true).fadeIn(250);
                    })
                    .blur(function() {
                        count.stop(true, true).fadeOut(250);
                    });
            }    
            target.keyup(function() {
                var currentCount = getCount(target);
                countStyle(currentCount, count);
                count.text(currentCount + '/' + conf.maxLength);
                setCountPos(count, getPos(target, count), border);
            });
        });
        
        function getCount(target) {
            return conf.maxLength - target.val().length;
        }
        
        function countStyle(currentCount, count) {
            if ( currentCount < (conf.alertLength + 1) ) {
                count.css({
                    color: conf.atColor,
                    background: conf.atBackground,
                    fontWeight: conf.atFontWeight
                });
            } else {
                count.css({
                    color: conf.color,
                    background: conf.background,
                    fontWeight: conf.fontWeight
                });
            }
        }
        
        function getPos(target, count) {
            var targetOffset = target.offset();
            return {
                x: Math.floor(targetOffset.left),
                y: Math.floor(targetOffset.top),
                xdash: target.get(0).offsetWidth,
                ydash: target.get(0).offsetHeight,
                cx: count.get(0).offsetWidth,
                cy: count.get(0).offsetHeight
            }
        }
        
        function setCountPos(count, pos, border) {
            return count.css({
                left: pos.x + pos.xdash - pos.cx - border.rightWidth,
                top: pos.y + pos.ydash - pos.cy - border.bottomWidth
            });
        }
    
    }

})(jQuery);

ダウンロード



以上です。
投稿者 0 コメント
ラベル:

サーバー・ランタイムの設定(GlassFish4)

【目的】
EclipseでGlassFish4のサーバの設定をする。



【準備】
１．「サーバー・アダプターの追加方法(GlassFish)」の手順で、GlassFish用のサーバー・アダプターを追加しておきます。



【手順１】
１．Eclipseを起動します。
２．メニューから「ウィンドウ」⇒「設定」を選択。




【手順２】
１．左のメニューから「サーバー」⇒「ランタイム環境」を選択。
２．ウィンドウ右側の「追加」ボタンをクリック。




【手順３】
１．「GlassFish」⇒「GlassFish4」を選択。
２．「新規ローカル・サーバーの作成」を選択。
３．「次へ」ボタンをクリック。




【手順４】
１．「GlassFish Server Open Source Edition 4.0(Zip版)のインストール(解凍)方法」の手順で、GlassFish4をインストールしておきます。




【手順５】
１．「JRE」は「java7」を選択。
２．「Glassfish Server Directory」は【手順４】でインストールしておいた場所を選択。
３．「次へ」ボタンをクリック。




【手順６】
１．「完了」ボタンをクリック。




【手順７】
１．「OK」ボタンをクリック。




【手順８】
１．「サーバー・ビューの表示方法」を実施。
２．以下の様に「サーバー・ビュー」にGlassFish4.0が表示されれば成功です。




























以上です。

投稿者 0 コメント
ラベル:
登録: コメント (Atom)

関連記事

loading..