是否有一种方法可以在ASP中使用数字上下颠倒?. NET不使用JavaScript?
如果没有,还有其他选择吗?
我试图做同样的事情,事实证明asp文本框有一个选项。对我有用的是:
<asp:TextBox TextMode="Number" runat="server" min="0" max="20" step="1"/>
这给了我一个文本框,当鼠标悬停在它上面或给予焦点时,显示上下控制,并且只允许从最小到最大的数字。它的工作原理与
相同<input type="number" min="0" max="20" step="1" />
请查看Ajax控件工具包
http://www.asp.net/ajaxLibrary/AjaxControlToolkitSampleSite/NumericUpDown/NumericUpDown.aspx<ajaxToolkit:NumericUpDownExtender ID="NUD1" runat="server"
TargetControlID="TextBox1"
Width="100"
RefValues="January;February;March;April"
TargetButtonDownID="Button1"
TargetButtonUpID="Button2"
ServiceDownPath="WebService1.asmx"
ServiceDownMethod="PrevValue"
ServiceUpPath="WebService1.asmx"
ServiceUpMethod="NextValue"
Tag="1" />
还可以考虑使用PM> Install-Package AjaxControlToolkit
我认为下面的html可以回答你的问题:
<head runat="server">
<title>Numeric Up Down</title>
<script type="text/jscript">
function Load() {
/*numericUpDown1.value = or*/ document.getElementById("numericUpDown1").value = parseFloat(document.getElementById("<%=NumericUpDown1.ClientID%>").value);
}
function Change() {
document.getElementById("<%=NumericUpDown1.ClientID%>").value = document.getElementById("numericUpDown1").value; //or numericUpDown1.value
}
</script>
</head>
<body onload="Load()">
<form id="form1" runat="server">
<div>
<input type="number" id="numericUpDown1" onchange="Change()" />
<asp:HiddenField ID="NumericUpDown1" runat="server" />
</div>
</form>
</body>
然后在c#或Visual Basic的asp服务器端代码中,您可以将HiddenField视为NumericUpDown,但注意,他的值是字符串,而不是十进制,如System.Windows.Forms.NumericUpDown控件,或float,或double,或int,所以您将不得不将其解析为您最需要的类型之一。
如果你想样式数字上下,那么在javascript中很简单。只需设置document.getElementById("numericUpDown1")。样式,但如果你想通过asp服务器端代码在c#或Visual Basic中做到这一点,那么html 必须不同:
<head runat="server">
<title>Numeric Up Down</title>
<script type="text/jscript">
function Change() {
document.getElementById("<%=NumericUpDown1.ClientID%>").value = document.getElementById("numericUpDown1").value; //or numericUpDown1.value
}
</script>
</head>
<body>
<form id="form1" runat="server">
<div>
<% this.Response.Write(string.Format("<input type='number' id='numericUpDown1' value='{0}' onchange='Change()' style='{1}' />", this.NumericUpDown1.Value, this.numericUpDown1Style)); %>
<asp:HiddenField ID="NumericUpDown1" runat="server" />
</div>
</form>
</body>
numericUpDown1Style是一个受保护的字段,其类型为string,定义在asp服务器端代码中的c#或Visual Basic中。
如果你想给它一个类而不给它设置样式,那么html必须是:
<head runat="server">
<title>Numeric Up Down</title>
<script type="text/jscript">
function Change() {
document.getElementById("<%=NumericUpDown1.ClientID%>").value = document.getElementById("numericUpDown1").value; //or numericUpDown1.value
}
</script>
</head>
<body>
<form id="form1" runat="server">
<div>
<% this.Response.Write(string.Format("<input type='number' id='numericUpDown1' value='{0}' onchange='Change()' class='{1}' />", this.NumericUpDown1.Value, this.numericUpDown1CssClass)); %>
<asp:HiddenField ID="NumericUpDown1" runat="server" />
</div>
</form>
</body>
numericUpDown1CssClass是一个受保护的字段,它的类型是string,定义在asp服务器端c#或Visual Basic代码中。
如果你想给它样式并给它一个类,那么html就像html #2或html #3,但唯一的变化是在下一行:
<% this.Response.Write(string.Format("<input type='number' id='numericUpDown1' value='{0}' onchange='Change()' style='{1}' class='{2}' />", this.NumericUpDown1.Value, this.numericUpDown1Style, this.numericUpDown1CssClass)); %>
我想你知道numericUpDown1Style和numericUpDown1CssClass从#2和#3
建议提示:
如果你的网站包含大量的数字上下控件,在你的asp服务器端代码中使用,这是不利的,以这种方式创建它们,那么你可以添加一个新的"Web用户控件"项目到你的网站,并命名为"NumericUpDown"。然后在它的源html中,你可以复制我上面发布的html #1或html #2或html #3或html #4(取决于你是否想要将数字向上或向下设置样式,或者是否给它一个类,或者两者兼而有之),并进行一些删除和更改,因为它不是"WebForm",而是"Web用户控制"并在asp服务器端代码做出以下属性(他们是在c#,但如果你使用Visual Basic,我不认为这将是一个问题,你翻译代码):
public decimal Value
{
get
{
return decimal.Parse(this.HiddenField.Value);
}
set
{
this.HiddenField.Value = value.ToString();
}
}
//Like the System.Windows.Forms.NumericUpDown.Value, but if you dislike 'decimal', and you want other type, then you can change the return type and the type Parse.
//Note that the ID of the HiddenField is simply "HiddenField", and not "NumericUpDown1", so make sure in the Source html to rename "NumericUpDown1" to "HiddenField", but probably you would like a different ID, so if you gave it different ID, then ensure that in the code you refer this HiddenField with the ID you chose, and not "HiddenField" or "NumericUpDown1".
//The following properties are for only if you want to style your Numeric Up Down:
protected string style;
public string Style
{
get
{
return this.style;
}
set
{
this.style = value;
}
}
//If you chose, copied, pasted and changed html #2 or html #4, then don't forget to replace this.numericUpDown1Style to this.Style in the source html of the Web User Control.
//Optional
public Unit Width
{
get
{
int startIndex = this.style.IndexOf("width") + 6;
if (index != -1)
{
int endIndex = this.style.IndexOf(';', startIndex);
return Unit.Parse(this.style.Substring(startIndex, endIndex - startIndex));
}
return Unit.Empty;
}
set
{
if (this.style.Contains("width"))
{
this.style = this.style.Replace("width:" + this.Width.ToString() + ';', "width:" + value.ToString() + ';');
}
else
{
this.style += "width:" + value.ToString() + ';';
}
}
}
//The same you can do with the Height property.
//You can replace all the style code with the CssClass code instead, or just add it:
protected string cssClass;
public string CssClass
{
get
{
return this.cssClass;
}
set
{
this.cssClass = value;
}
}
//If you chose, copied, pasted and changed html #3 or html #4, then don't forget to replace this.numericUpDown1CssClass to this.CssClass in the source html of the Web User Control.
如果你设置了NumericUpDown的样式,那么也要知道在每一个ASP。. NET控件,你可以在它们的ID后面键入。style ["style"] = "value".
如果你希望NumericUpDown也能做到这一点,那么将受保护字段style的类型从string更改为MyStyle有MyStyle: 的定义public class MyStyle
{
internal string style;
public string this[string style]
{
get
{
int startIndex = this.style.IndexOf(style) + style.Length + 1;
int endIndex = this.style.IndexOf(';', startIndex);
return this.style.Substring(startIndex, endIndex - startIndex)
}
set
{
this.style = this.style.Replace(style + ':' + this[style] + ';', style + ':' + value + ';')
}
}
}
将该类添加到Web用户控件的代码中,并更改Style属性:
public string Styles
{
get
{
return this.style.style;
}
set
{
this.style.style = value;
}
}
,然后添加属性:
public MyStyle Style
{
get
{
return this.style;
}
}
并将行改为:
protected string style;
:
protected readonly MyStyle style = new MyStyle();
不要忘记在Web用户控件的源html中替换它。样式到这里。样式。
注意:我没有耐心自己测试代码,所以它可能不工作,所以你必须自己修复它。至少你理解了我的想法。
修复后,您可以编辑我的答案,并将错误的代码替换为您的修复代码。
我将非常感激!
这个Web用户控件是你想要的ASP NumericUpDown !
如果你在。net 4.0上卡住了,你想使用原生HTML5输入类型"number"(而不是来自Ajax控件工具包的NumericUpDown),你可以使用ASP TextBox控件与额外的"type"标签的组合:
<asp:TextBox runat="server" ID="txtMyTextBox" type="number" min="0" max="10" step="1"/>
如果你想阻止任何文本输入,你甚至可以从Ajax控件工具包中添加FilteredTextBoxExtender:
<ajaxToolkit:FilteredTextBoxExtender runat="server" TargetControlID="txtMyTextBox" FilterType="Numbers" />