通过

创建使用Web 服务后端的数值增大/减小控件

Christian Wenz

本文档是Visual C# 教程 （转至 Visual Basic 教程）

相比在文本框中键入数值，用户会更倾向于使用数值增大/减小控件（位于Windows 和其它操作系统中）。默认情况下，NumericUpDown 控件每次使数值加/减 1，而使用web 服务会获得更大的灵活性。

« 前一篇教程 |  下一篇教程 »

概述

相比在文本框中键入数值，用户会更倾向于使用数值增大/减小控件（位于Windows 和其它操作系统中）。

默认情况下，NumericUpDown 控件每次使数值加/减 1，而使用web 服务会获得更大的灵活性。

步骤

ASP.NET AJAX Control Toolkit 中包含一个NumericUpDown 扩展器，该扩展器会自动向一个文本框添加两个按钮

：一个用于增加数值，另一个用于减少数值。而该控件还支持web 服务调用（或页面方法调用）。

无论单击哪个按钮，JavaScript 代码都会连接到web 服务器，并在web 服务器上执行一个方法。

方法签名如下所示：

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

current 参数是在文本框中显示的当前值；tag 属性是额外的上下文数据，

可以设置为NumericUpDown 扩展器的属性（但该属性不是必需的属性）。

对于本示例，数值增大/减小控件仅允许使用2 的幂数值，如：1、2、4、8、16、32、64 等。因此，当用户希望增加数值时，

执行的方法必须使原数值加倍；而减少数值时使用的方法必须使原数值减半。以下是完整的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 服务的路径，该 web 服务使用使数值减小的服务方法；如果使用页面方法，则忽略此项。
  • ServiceUpMethod — 使数值增大的 web 方法或页面方法的名称。
  • ServiceUpPath — 到 web 服务的路径，该 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 的幂数

 

 

下一篇教程