Изменить видимость объекта с помощью javascript, используя флажок?

Question

Мне очень жаль, если этот вопрос был задан раньше, но я не мог его найти.

Работа с веб-приложением ASP.NET/C#.

я создаю ярлык в код и добавить его на страницу (все закодированной в коде позади и не в дизайне страницы)

Теперь у меня есть флажок Я хочу, чтобы изменить видимость метка в зависимости от того, установлен ли флажок (показать) или нет (скрыть).

Я попытался использовать панель обновления. Но поскольку метка генерируется в коде, я должен ее генерировать снова каждый раз, когда есть частичная обратная передача. и я не хочу этого.

Есть ли способ сделать это с помощью javascript, чтобы избежать post-backs? другие решения также приветствуются.

Большое спасибо за любую помощь

Answer 1

Вы на правильном пути. Вы можете избежать накладных расходов и сложности использования элементов управления UpdatePanel и вызова AJAX, используя вместо этого сценарий на стороне клиента.

Вы хотите, чтобы определить функцию JavaScript, чтобы стрелять на событие OnClick от флажка на вашей веб-странице:

<input type="checkbox" onclick="checkboxChanged(this);" /> 

Я предполагаю, что вы хотите добавить метку с идентификатором «LBL» в страницу с вашего кода. Убедитесь, что вы сделали ярлык Защищенным членом класса Page, чтобы вы могли получить доступ к нему с страницы aspx с помощью тега сервера, чтобы получить правильный идентификатор, когда вы вызываете document.getElementById в JavaScript. Это важно.

Partial Class MyPage 
    Inherits System.Web.UI.Page 
    Protected lbl As Label 

    Private Sub Page_Load(sender As Object, e As EventArgs) 

    If Not Page.IsPostback Then 

     lbl = New Label() 
     lbl.ID = "lbl" 
     Me.Controls.Add(lbl) 

    End If 

    End Sub 

End Class 

Так вот, что ваш код JavaScript на странице ASPX будет выглядеть следующим образом:

function checkboxChanged(checkbox) { 
    if (checkbox.checked) { 
    document.getElementById("<%=Me.lbl.ClientID %>").style.display = 'inline'; 
    } else { 
    document.getElementById("<%=Me.lbl.ClientID %>").style.display = 'none'; 
    } 
} 

Answer 2

Поместите этот код на странице Load.

if (!Page.IsPostBack) { 
    Label lbl = new Label(); 
    lbl.ID = "lbl"; 
    lbl.Text = "Test"; 
    this.Controls.Add(lbl); 

Добавить ссылку на jQuery javascript и поместить его в HTML ниже.

<asp:CheckBox runat="server" ID="chk" /> 
<script language="javascript" type="text/javascript"> 
    $(document).ready(function() { 
     $("#chk").change(function() { 
      if (this.checked) 
       $("#lbl").hide(); 
      else 
       $("#lbl").show(); 
     }); 
    }); 
</script> 

Попробуйте использовать AJAX (jQuery), если вам нужно создать динамические элементы управления.

Answer 3

<asp:CheckBox ID="CheckBox1" onclick='$("span[id$=lblToHide]").toggle();' runat="server" Text="Bla" AutoPostBack="false" /> 

if (!Page.IsPostBack) { 
    Label lbl = new Label(); 
    lbl.ID = "lblToHide";  
    lbl.Text = "I am visible"; 
    lbl.Attributes.Add("style", "display:none"); //hide at first 
    this.Controls.Add(lbl); //or however you are adding it 
} 

Answer 4

Почему вы не хотите загружать контроль над меткой при каждой обратной передаче? С ASP.NET вся страница загружается с помощью КАЖДОЙ обратной передачи, а состояние представления перезагружается в элемент управления. Затем вы можете в событии инициализации страницы создавать элемент управления меткой каждый раз, и видимое свойство viewstate в этом случае будет храниться между обратными передачами.