Web サービス バックエンドで数値を上げ下げするコントロールを作成する (C#)

作成者: Christian Wenz

PDF のダウンロード

ユーザーが チェック ボックスに値を入力する代わりに、数値の上下コントロール (Windows やその他のオペレーティング システムに存在) が、より快適になる可能性があります。 既定では、NumericUpDown コントロールは常に値を 1 ずつ増減しますが、Web サービスは柔軟性を高めます。

概要

ユーザーが チェック ボックスに値を入力する代わりに、数値の上下コントロール (Windows やその他のオペレーティング システムに存在) が、より快適になる可能性があります。 既定では、NumericUpDown コントロールは常に値を 1 ずつ増減しますが、Web サービスは柔軟性を高めます。

手順

ASP.NET AJAX コントロール ツールキットには、テキスト ボックスに自動的に 2 つのボタン (1 つは値を増やすため、1 つは値を減らすため) を追加する NumericUpDown エクステンダー コントロールが含まれています。 ただし、コントロールは Web サービス呼び出し (またはページ メソッド呼び出し) もサポートします。 上または下のボタンがクリックされるたびに、JavaScript コードは Web サーバーに接続し、そこでメソッドを実行します。 メソッド シグネチャは次のとおりです。

public int MethodName(int current, string tag) {}

current 引数はテキスト ボックス内の現在の値です。tag 属性は、NumericUpDown エクステンダー コントロールのプロパティとして設定できる追加のコンテキスト データです (必須ではありません)。

このサンプルでは、数値の上下制御では、1、2、4、8、16、32、64 などの 2 の累乗の値のみを使用できます。 したがって、ユーザーが値を大きくする場合に実行されるメソッドは、古い値を 2 倍にする必要があります。もう 1 つのメソッドでは、値を 2 で除算する必要があります。 完全な Web サービスを次に示します。

<%@ WebService Language="C#" Class="NumericUpDown1" %>
using System;
using System.Web;
using System.Web.Services;
using System.Web.Services.Protocols;
[System.Web.Script.Services.ScriptService]
public class NumericUpDown1 : System.Web.Services.WebService
{
 [WebMethod]
 public int Up(int current, string tag)
 {
 if (current <= 536870912)
 {
 return current * 2;
 }
 else
 {
 return current;
 }
 }
 [WebMethod]
 public int Down(int current, string tag)
 {
 if (current >= 2)
 {
 return (int)(current / 2);
 }
 else
 {
 return current;
 };
 }
}

最後に、新しい ASP.NET ページを作成します。 通常どおり、ScriptManager コントロール、TextBox コントロール、NumericUpDownExtender コントロールが必要です。 後者の場合は、Web サービス情報を指定する必要があります。

  • ServiceDownMethod: ダウン Web メソッドまたはページ メソッドの名前
  • ServiceDownPath: ダウン サービス メソッドを使用した Web サービスへのパス。ページ メソッドを使用している場合は省略する
  • ServiceUpMethod: Web メソッドまたはページ メソッドの名前
  • ServiceUpPath: アップ サービス メソッドを使用した Web サービスへのパス。ページ メソッドを使用している場合は省略する

ページの完全なマークアップを次に示します。

<%@ Page Language="C#" %>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head id="Head1" runat="server">
 <title>Control Toolkit</title>
</head>
<body>
 <form id="form1" runat="server">
 <asp:ScriptManager ID="asm" runat="server" />
 <div>
 How many MB do you want? <asp:TextBox ID="TextBox1" Text="32" runat="server" />
 <ajaxToolkit:NumericUpDownExtender ID="nud" runat="server"
 TargetControlID="TextBox1" Width="100"
 ServiceUpPath="NumericUpDown1.cs.asmx" 
 ServiceDownPath="NumericUpDown1.cs.asmx"
 ServiceUpMethod="Up" ServiceDownMethod="Down" />
 </div>
 </form>
</body>
</html>

ページを実行する場合は、上ボタンをクリックするとテキスト ボックスの値が常に 2 倍になり、下ボタンをクリックすると半分になります。

Only numbers that are a power of 2 appear

2 の累乗である数値のみが表示されます (フルサイズの画像を表示する場合はクリックします)