다음을 통해 공유

웹 서비스 백 엔드를 사용하여 숫자 위로/아래로 컨트롤 만들기(VB)

작성자: Christian Wenz

PDF 다운로드

사용자가 검사 상자에 값을 입력하도록 하는 대신 숫자 위쪽/아래쪽 컨트롤(Windows 및 기타 운영 체제에 있음)이 더 편안할 수 있습니다. 기본적으로 NumericUpDown 컨트롤은 항상 값을 1씩 늘리거나 줄이지만 웹 서비스는 더 많은 유연성을 입증합니다.

개요

사용자가 검사 상자에 값을 입력하도록 하는 대신 숫자 위쪽/아래쪽 컨트롤(Windows 및 기타 운영 체제에 있음)이 더 편안할 수 있습니다. 기본적으로 컨트롤은 NumericUpDown 항상 값을 1로 늘리거나 줄이지만 웹 서비스는 더 많은 유연성을 입증합니다.

단계

ASP.NET AJAX 컨트롤 도구 키트에는 텍스트 상자에 두 개의 단추를 자동으로 추가하는 extender가 포함되어 NumericUpDown 있습니다. 하나는 값을 높이기 위한 단추이며, 하나는 줄입니다. 그러나 컨트롤은 웹 서비스 호출(또는 페이지 메서드 호출)도 지원합니다. 위쪽 또는 아래쪽 단추를 클릭할 때마다 JavaScript 코드는 웹 서버에 연결하고 메서드를 실행합니다. 메서드 서명은 다음과 같습니다.

Function MethodName(ByVal current As Integer, ByVal tag As String) As Integer

인수는 current 텍스트 상자의 현재 값입니다. tag 특성은 extender의 NumericUpDown 속성으로 설정할 수 있는 추가 컨텍스트 데이터입니다(필수는 아님).

이 샘플의 경우 숫자 위쪽/아래쪽 컨트롤은 1, 2, 4, 8, 16, 32, 64 등 2의 권한 값만 허용합니다. 따라서 사용자가 값을 늘리려는 경우 실행되는 메서드는 이전 값의 두 배가 되어야 합니다. 다른 메서드는 값을 2로 나누어야 합니다. 전체 웹 서비스는 다음과 같습니다.

<%@ WebService Language="VB" Class="NumericUpDown1" %>
Imports System.Web
Imports System.Web.Services
Imports System.Web.Services.Protocols
<System.Web.Script.Services.ScriptService()> _
Public Class NumericUpDown1
 Inherits System.Web.Services.WebService
 <WebMethod()> _
 Function Up(ByVal current As Integer, ByVal tag As String) As Integer
 If current <= 536870912 Then
 Return current * 2
 Else
 Return current
 End If
 End Function
 <WebMethod()> _
 Function Down(ByVal current As Integer, ByVal tag As String) As Integer
 If current >= 2 Then
 Return CInt(current / 2)
 Else
 Return current
 End If
 End Function
End Class

마지막으로 새 ASP.NET 페이지를 만듭니다. 평소와 같이 컨트롤, TextBox 컨트롤 및 컨트롤이 NumericUpDownExtender 필요합니다ScriptManager. 후자의 경우 웹 서비스 정보를 제공해야 합니다.

  • ServiceDownMethod 다운 웹 메서드 또는 페이지 메서드의 이름
  • ServiceDownPath 다운 서비스 메서드를 사용하여 웹 서비스에 대한 경로입니다. 페이지 메서드를 사용하는 경우 생략
  • ServiceUpMethod up 웹 메서드 또는 페이지 메서드의 이름
  • ServiceUpPath up 서비스 메서드를 사용하여 웹 서비스에 대한 경로입니다. 페이지 메서드를 사용하는 경우 생략

페이지의 전체 태그는 다음과 같습니다.

<%@ Page Language="VB" %>
<!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.vb.asmx" ServiceDownPath="NumericUpDown1.vb.asmx"
 ServiceUpMethod="Up" ServiceDownMethod="Down" />
 </div>
 </form>
</body>
</html>

페이지를 실행하는 경우 위쪽 단추를 클릭할 때 텍스트 상자의 값이 항상 두 배로 표시되고 아래쪽 단추를 클릭하면 절반으로 줄입니다.

2의 강력한 숫자만 표시됩니다.

전원이 2인 숫자만 표시됩니다(전체 크기 이미지를 보려면 클릭).

이전