閲覧総計：10649　　（本日：1　　昨日：1)

　Ajax Control Toolkitは、日付入力に便利なCalendar Extenderという部品を
提供してくれている。早速使ってみた。　09/08/11

　ところが、このCalender Extenderは標準の方法での日本語表示化では、カレンダ
の表示の全てが日本語表示になってくれない。この欠点を補完するする方法が
↓このページに紹介されていたので、対応してみた。
http://devadjust.exblog.jp/7018028/

開発環境：VWD2005+AJAX1.0+Toolkit + SQL Server2005
サーバ：ASP.NET2.0+AJAX1.0 + SQL Server2005

【機能】TextBoxをクリックするとカレンダがポップアップし、日付が簡単に入力できる。
　　　　（カレンダの表示が日本語化されているところが特徴）

【稼動サンプル】
http://www.kuri6005.fscs.jp/4AjaxTr/Toolkit/ValidatorCallout.aspx

ValidatorCallout02.JPG


ValidatorCallout04.JPG


ValidatorCallout05.JPG

作成時の画面(VWD2005) ▼

ValidatorCallout01.JPG

(参考)VWD2008での作成時の画面 ▼　Extender部品は表示されずWYGIWYGレイアウトが出来る様になっている。

ValidatorCallout03.JPG

コントロールの設定値

コントロールプロパティ値コメント
RequiredFieldValidator(ID)RequiredFieldValidator1入力必須チェック
ControlToValidateTextBox1
SetFocusOnErrorTrueエラー時 問題ヶ所へカーソル移動
DisplayNone2重表示にならぬ様消し
ErrorMessage名前は必須です
ValidatorCalloutExtender(ID)ValidatorCalloutExtender1バルーン AJAX Toolkit
TargetControlIDRequiredFieldValidator1
RequiredFieldValidator(ID)RequiredFieldValidator2入力必須チェック
ControlToValidateTextBox2
SetFocusOnErrorTrueエラー時 問題ヶ所へカーソル移動
DisplayNone2重表示にならぬ様消し
ErrorMessage年齢は必須です
ValidatorCalloutExtender(ID)ValidatorCalloutExtender2バルーン AJAX Toolkit
TargetControlIDRequiredFieldValidator2
RangeValidator(ID)RangeValidator1データ範囲チェック
ControlToValidateTextBox2
MaximumValue100
MinimumValue0
SetFocusOnErrorTrueエラー時 問題ヶ所へカーソル移動
TypeInteger整数に設定
DisplayNone2重表示にならぬ様消し
ErrorMessage年齢は0〜100の間で
ValidatorCalloutExtender(ID)ValidatorCalloutExtender3バルーン AJAX Toolkit
TargetControlIDRangeValidator1

【ValidatorCallout.aspx】

<%@ Page Language="VB" %>

<%@ Register Assembly="AjaxControlToolkit" Namespace="AjaxControlToolkit" TagPrefix="cc1" %>

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<script runat="server">

</script>

<html xmlns="http://www.w3.org/1999/xhtml" >
<head runat="server">
    <title>無題のページ</title>
</head>
<body>
    <form id="form1" runat="server">
    <div>
        <asp:ScriptManager ID="ScriptManager1" runat="server">
        </asp:ScriptManager>
        名前：<asp:TextBox ID="TextBox1" runat="server"></asp:TextBox>
        <asp:RequiredFieldValidator ID="RequiredFieldValidator1" runat="server" ErrorMessage="名前は必須です" ControlToValidate="TextBox1" Display="None" SetFocusOnError="True"></asp:RequiredFieldValidator>
        <cc1:ValidatorCalloutExtender ID="ValidatorCalloutExtender1" runat="server" TargetControlID="RequiredFieldValidator1">
        </cc1:ValidatorCalloutExtender>
        <br />
        年齢：<asp:TextBox ID="TextBox2" runat="server"></asp:TextBox>
        <asp:RequiredFieldValidator ID="RequiredFieldValidator2" runat="server" ControlToValidate="TextBox2"
            Display="None" ErrorMessage="年齢は必須です" SetFocusOnError="True"></asp:RequiredFieldValidator>
        <cc1:ValidatorCalloutExtender ID="ValidatorCalloutExtender2" runat="server" TargetControlID="RequiredFieldValidator2">
        </cc1:ValidatorCalloutExtender>
        <asp:RangeValidator ID="RangeValidator1" runat="server" ControlToValidate="TextBox2"
            Display="None" ErrorMessage="年齢は0〜100の間で" MaximumValue="100" MinimumValue="0" SetFocusOnError="True" Type="Integer"></asp:RangeValidator>
        <cc1:ValidatorCalloutExtender ID="ValidatorCalloutExtender3" runat="server" TargetControlID="RangeValidator1">
        </cc1:ValidatorCalloutExtender>
        <br />
        <br />
        <asp:Button ID="Button1" runat="server" Text="Button" /></div>
    </form>
</body>
</html>

【参考にしたページ】
1.Ajaxカレンダの表示を日本語化する 08/01/19
http://devadjust.exblog.jp/7018028/

2.JavaScriptコードの埋め込み方法 04/05/21
http://www.atmarkit.co.jp/fdotnet/dotnettips/160regscript/regscript.html


選択肢 投票
参考になった 0  
ふつう 0  
参考にならなかった 0  
トップ   新規 一覧 単語検索 最終更新   ヘルプ   最終更新のRSS