#c# #javascript #asp.net #html #css
#c# #javascript #asp.net #HTML #css
Вопрос:
У меня есть текстовое поле на странице. Видимость которого установлена false со стороны сервера. Теперь я хочу сделать его видимым со стороны клиента с помощью java-script. (Любая обратная отправка или частичная обратная отправка не может быть реализована в этом случае.)
<%@ Page Title="Home Page" Language="C#" AutoEventWireup="true" CodeFile="Default.aspx.cs" Inherits="_Default" %>
<!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>ControlVisibilityClientSide</title>
<script type="text/javascript">
function toggleVisibility(controlId)
{
var control = document.getElementById(controlId);
if(control.style.visibility == "visible" || control.style.visibility == "")
control.style.visibility = "hidden";
else
control.style.visibility = "visible";
}
</script>
</head>
<body>
<form id="form1" runat="server">
<div>
<asp:TextBox ID="TextBox1" runat="server"></asp:TextBox>
<input type="button" ID="btnShowHide" value="Show/Hide" onclick="toggleVisibility('TextBox1');" />
</div>
</form>
</body>
</html>
Это работает нормально.
Но когда я использую
using System;
using System.Collections.Generic;
using System.Linq;
using System.Web;
using System.Web.UI;
using System.Web.UI.WebControls;
public partial class _Default : System.Web.UI.Page
{
protected void Page_Load(object sender, EventArgs e)
{
TextBox1.Visible = false;
}
}
Приведенный выше код вообще не работает.
Может ли кто-нибудь, пожалуйста, помочь мне с этой проблемой или любое предложение будет оценено.
Ответ №1:
Если вы установите элемент управления visible=false , он не будет отображаться на стороне клиента, но есть хитрое решение, которое выполнит то же самое.
При загрузке вашей страницы, на которой вы настроены Visible=false , вы можете установить style значение display:none
protected void Page_Load(object sender, EventArgs e)
{
TextBox1.Attributes.Add("style", "display:none");
}
Это отобразит элемент управления на стороне клиента, но пользователь не сможет его увидеть, и тогда вы сможете отобразить элемент управления в функции Javascript для установки style Diplay:block , НАПРИМЕР…
document.getElementById('<%=TextBox2.ClientID %>').style.display = 'block';
Комментарии:
1. Спасибо за ваш ответ, но та же проблема сохраняется. Не работает.
2. я ОБНОВИЛ СВОЙ ОТВЕТ. ВЫ ДОЛЖНЫ УСТАНОВИТЬ DISPLAY = BLOCK НА ВИДИМЫЙ ДЛЯ ВАШЕГО ЭЛЕМЕНТА УПРАВЛЕНИЯ.
3. @Muhammad Akhtar да, когда я использую control.style.display = ‘none’; или control.style.display = ‘block’; тогда это работает. Тем не менее, я не принял ваш ответ, потому что я хочу посмотреть, есть ли какое-либо решение для «TextBox1.Visible = false;» или нет. Большие усилия, большое спасибо.
4. Это то, что я предлагаю вам альтернативное решение для visible / invisible. Если вы установите свойство элемента управления visible = false, то элемент управления не отображается, тогда как вы можете видеть этот конкретный элемент управления.
5. Для «TextBox1.Visible =false» нет решения, потому что (согласно ответу VinayC, который вы, должно быть, видели, потому что вы поместили под ним комментарий) это останавливает HTML-разметку для элемента управления, отправляемого клиенту, поэтому, что касается браузера и любого клиентского JavaScript, элемент управления не существует. Ответ Мухаммеда дает вам способ включить HTML-разметку для элемента управления на страницу, но использовать CSS, чтобы скрыть / показать его. С помощью CSS вы можете использовать либо ‘display’, либо ‘visibility’ — для вашей цели, я подозреваю, что ‘display’ — лучший вариант.
Ответ №2:
Как только элемент управления помечен как невидимый на стороне сервера, для него не создается разметка (html). Таким образом, его нельзя сделать видимым в JS, потому что он (соответствующий html) не существует на стороне клиента.
Вместо того, чтобы делать невидимым на стороне сервера, вам нужно создать сценарий запуска, чтобы скрыть его на стороне клиента.
Комментарии:
1. Спасибо за вашу помощь. Есть ли какой-нибудь трюк для выполнения такого рода действий? Потому что требование только такое.
Ответ №3:
установите style["visibility"] = "hidden" на стороне сервера. Т.е. в c # btnSave.style["visibility"] = "hidden"; будет отображаться кнопка, и, следовательно, на стороне клиента этот элемент доступен. На стороне клиента измените стиль видимости на видимый.
$('#btnSave).css("visibility", "visible");