Nota
L'accesso a questa pagina richiede l'autorizzazione. È possibile provare ad accedere o modificare le directory.
L'accesso a questa pagina richiede l'autorizzazione. È possibile provare a modificare le directory.
Invece di consentire a un utente di digitare un valore in una casella di controllo, un controllo numerico su/giù (esistente in Windows e altri sistemi operativi) potrebbe risultare più comodo. Per impostazione predefinita, il controllo NumericUpDown aumenta o diminuisce sempre un valore di 1, ma un servizio Web dimostra una maggiore flessibilità.
Panoramica
Invece di consentire a un utente di digitare un valore in una casella di controllo, un controllo numerico su/giù (esistente in Windows e altri sistemi operativi) potrebbe risultare più comodo. Per impostazione predefinita, il NumericUpDown controllo aumenta o diminuisce sempre un valore di 1, ma un servizio Web dimostra una maggiore flessibilità.
Passaggi
Il ASP.NET AJAX Control Toolkit contiene l'extender NumericUpDown che aggiunge automaticamente due pulsanti a una casella di testo: uno per aumentare il valore, uno per ridurlo. Tuttavia, il controllo supporta anche una chiamata al servizio Web (o chiamata al metodo di pagina). Ogni volta che si fa clic sul pulsante su o giù, il codice JavaScript si connette al server Web ed esegue un metodo in questa posizione. La firma del metodo è la seguente:
Function MethodName(ByVal current As Integer, ByVal tag As String) As Integer
L'argomento è il valore corrente nella casella di testo. L'attributo currenttag è dati di contesto aggiuntivi che possono essere impostati come proprietà dell'extender NumericUpDown (ma non è obbligatorio).
Per questo esempio, il controllo numerico verso l'alto/verso il basso consentirà solo valori che sono poteri di due: 1, 2, 4, 8, 16, 32, 64 e così via. Pertanto, il metodo eseguito quando l'utente vuole aumentare il valore deve raddoppiare il valore precedente; l'altro metodo deve dividere il valore per due. Di seguito è riportato il servizio Web completo:
<%@ 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
Creare infine una nuova pagina ASP.NET. Come al solito, è necessario un ScriptManager controllo, un TextBox controllo e un NumericUpDownExtender controllo . Per quest'ultimo, è necessario fornire le informazioni sul servizio Web:
ServiceDownMethodnome del metodo o della pagina Web inattivoServiceDownPathpercorso del servizio Web con il metodo di servizio inattivo; omettere se si usa un metodo di paginaServiceUpMethodnome del metodo o della pagina Web upServiceUpPathpercorso del servizio Web con il metodo up service; omettere se si usa un metodo di pagina
Ecco il markup completo per la pagina:
<%@ 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>
Se si esegue la pagina, si noti che il valore nella casella di testo viene sempre raddoppiato quando si fa clic sul pulsante superiore e viene dimezzato quando si fa clic sul pulsante inferiore.
Vengono visualizzati solo i numeri con potenza 2 (fare clic per visualizzare l'immagine a dimensione intera)
