在 javascript 上将标签更改为文本框
首先，我的英语不太好，但我会尽力使其易于理解
所以我所做的是创建一个网格视图，其中列； 两个控件一个标签和一个文本框 标签设置为可见 虽然文本框反之亦然，
但这里是我的 gridview 的客户端代码
<asp:Image ID="img" onclick="javascript:Toggle(this);" runat="server" ImageUrl="~/Images/minus.gif"
ToolTip="Collapse" Width="7px" Height="7px" ImageAlign="AbsMiddle" /></a>
<asp:Label ID="lbllastname" Height="15px" Width="180px" runat="server" Text='<%# Eval("CourseCatName")%>'></asp:Label>
<asp:TextBox ID="txtCourseCategory" AutoPostBack="true" runat="server" Text='<%# Eval("CourseCatName")%>'
Font-Size="XX-Small" Font-Names="Verdana" Style="display: none" OnTextChanged="txtCourseCategory_TextChanged"
Height="16px" Width="207px"></asp:TextBox><br />
，我知道很难在 gridview 中找到控件，所以我所做的是在我的服务器端创建一个属性以传递给我的 javascript 函数 这就是我所做的
Dim txttry As TextBox = DirectCast(e.Row.FindControl("txtCourseCategory"), TextBox)
Dim labeltry As Label = DirectCast(e.Row.FindControl("lbllastname"), Label)
labeltry.Attributes.Add("onclick", "javascript:return validate('" + txttry.ClientID + "','" + labeltry.ClientID + "')")
，在我的 javascript 上，我创建了一个函数来调用控件
function validate(txtobj, lblobj) {
document.getElementById(lblobj).style.display = 'none';
document.getElementById(txtobj).style.display = 'block';
}
，以便代码可以工作，我认为它几乎完成了，但是当我运行我的程序并单击标签时； 标签隐藏，但文本框在下面，就像之间有一个
感谢您花时间和精力尝试阅读我的问题。
First of all I am not really good in english but Ill try to make it understandable as possible
So what I did was create a gridview wherein the column;
two controls a label and a textbox
label is set to be visible
while textbox is vice versa
here is the client-code of my gridview
<asp:Image ID="img" onclick="javascript:Toggle(this);" runat="server" ImageUrl="~/Images/minus.gif"
ToolTip="Collapse" Width="7px" Height="7px" ImageAlign="AbsMiddle" /></a>
<asp:Label ID="lbllastname" Height="15px" Width="180px" runat="server" Text='<%# Eval("CourseCatName")%>'></asp:Label>
<asp:TextBox ID="txtCourseCategory" AutoPostBack="true" runat="server" Text='<%# Eval("CourseCatName")%>'
Font-Size="XX-Small" Font-Names="Verdana" Style="display: none" OnTextChanged="txtCourseCategory_TextChanged"
Height="16px" Width="207px"></asp:TextBox><br />
I know that it is difficult to find control inside a gridview so what i did is create a atrribute on my server side to be passed on my javascript function
Here is what I did
Dim txttry As TextBox = DirectCast(e.Row.FindControl("txtCourseCategory"), TextBox)
Dim labeltry As Label = DirectCast(e.Row.FindControl("lbllastname"), Label)
labeltry.Attributes.Add("onclick", "javascript:return validate('" + txttry.ClientID + "','" + labeltry.ClientID + "')")
And on my javascript ive created a function to call the controls
function validate(txtobj, lblobj) {
document.getElementById(lblobj).style.display = 'none';
document.getElementById(txtobj).style.display = 'block';
}
So that code works and I think it is almost done but when I run my program and click on the label;
the label hides but the textbox is below like there is a <br/> between then
I check the codes again but found nothing that could make the textbox below.
Sir/Madam what do you think is the problem or should I add a CSS for it?
Or my code is the huge problem?
I am open for suggestion be it bad or good.
By the way I am really new on javascript
Thanks for your time and effort trying to read my problem.
如果你对这篇内容有疑问，欢迎到本站社区发帖提问 参与讨论，获取更多帮助，或者扫码二维码加入 Web 技术交流群。
绑定邮箱获取回复消息
由于您还没有绑定你的真实邮箱，如果其他用户或者作者回复了您的评论，将不能在第一时间通知您！
发布评论
评论（2）
尝试更改以下行：
To be：
如果将元素设置为
block元素，它将显示在下一行，因为这就是块元素的作用。如果将display属性设置为空字符串，则应通过将其设置为特定元素类型的默认display类型（在输入的情况下），使其再次可见元素应该是内联。如果这不起作用，您可以将其显式设置为内联。有关
display的更多信息，请访问：http://www.quirksmode。 org/css/display.html - 包含图片，甚至在页面底部有一个动态更改设置的演示。Try changing the following line:
To be:
If you set your element to be a
blockelement it will display on the next line because that's what block elements do. If you set thedisplayproperty to an empty string it should make it visible again by setting it to the defaultdisplaytype for the particular element type which in the case of an input element should beinline. If that doesn't work you could explicitly set it toinline.More information about
displayis available here: http://www.quirksmode.org/css/display.html - complete with pictures and even a change-the-settings-on-the-fly demo at the bottom of the page.您也可以不使用 JavaScript 来完成此操作。
为此，您需要使用 2 个面板。在一个面板中保留您的标签，在另一面板中保留您的文本框。现在通过将其可见属性设置为 false 来保持带有文本框的面板不可见。
现在在按钮单击事件中获取标签的文本并将其存储在字符串变量中，并将包含标签的面板的可见属性更改为 false。然后将包含文本框的面板的可见属性更改为 true，并使用变量中的字符串设置文本属性。
You can also do it without using javascript.
To do so you will need to use 2 panels. in one panel keep your label and in other panel keep your textbox. now keep the panel with textbox invisible by setting its visible property false.
now in buttons click event get the text of label and store it in a string variable and change the visible property to false for the panel containing label. then change th visible property to true for the panel containing textbox and set the text property with the string in the variable.