Как добавить класс css в панель обновления в файле С#, за файлом asp.net
Как добавить класс css в панель обновления в ASP.Net?
Ответ 1
Как вы видели, панель обновления не имеет свойства класса CSS. Так как это невозможно сделать напрямую, вам нужна работа; есть два (спрятаться от UpdatePanel и CSS), которые могут получить желаемое поведение.
Один из них состоит в том, чтобы окружить панель обновления div:
<div id="foo" style="visibility: hidden; position: absolute">
<asp:UpdatePanel ID="UpdatePanel1" runat="server">
</asp:UpdatePanel>
</div>
Другой - применить селектор css на основе идентификатора панели обновления:
<style type="text/css">
#<%=UpdatePanel1.ClientID%> {
visibility: hidden;
position: absolute;
}
</style>
Еще один способ, не упомянутый в статье, - это окружение панели в div и стиль панели обновления на основе ее рендеринга как div:
<style type="text/css">
#foo div {
visibility: hidden;
position: absolute;
}
</style>
<div id="foo">
<asp:UpdatePanel ID="UpdatePanel1" runat="server">
</asp:UpdatePanel>
</div>
Ответ 2
вы можете использовать атрибут html одного класса
<asp:UpdatePanel ID="UpdatePanel1" runat="server" class="MyCssClass">
</asp:UpdatePanel>
Ответ 3
Панель обновления может отображать как div или span (в зависимости от режима). Самый простой способ добиться того, что вы хотите, - обернуть UpdatePanel в стандартной панели:
<asp:Panel ID="Panel1" runat="Server">
<asp:UpdatePanel ID="UpdatePanel1" runat="server">
</asp:UpdatePanel>
</asp:Panel>
Вы можете просто сделать это в codebehind:
Panel1.CssClass = "myCssClass";
Вы также можете использовать div, например, LFSR Consulting, и добавить runat="server", а затем изменить атрибут класса. Но Panel немного легче работать (панель просто отображается как div).
Ответ 4
Вы также можете сделать так, как я, и просто создать новый класс, который наследует UpdatePanel. Я получил основание для этого где-то еще, но я не помню, где я не могу полностью одолжить, но я только изменил его для этой идеи. Я собираюсь сделать то же самое для атрибутов HTML (поскольку коллекция .attributes() для css на UpdatePanel вместо необработанных атрибутов HTML, как и в большинстве других web.ui.controls).
ОБНОВЛЕНО: я обновил эту версию, чтобы включить в нее еще одну настройку, которая позволила добавить ANY-атрибут. На самом деле это дублирует первую настройку, за исключением того, что первый создает довольно стандартный подход, где это полностью гибко (поэтому не стандартно).
Imports System.ComponentModel
Imports System.Collections
Imports System.Web.UI
Namespace Controls
Public Class UpdatePanelCss
Inherits UpdatePanel
Private _cssClass As String
Private _tag As HtmlTextWriterTag = HtmlTextWriterTag.Div
Public HtmlAttributes As New HtmlAttributes
<DefaultValue("")> _
<Description("Applies a CSS style to the panel.")> _
Public Property CssClass() As String
Get
Return If(_cssClass, [String].Empty)
End Get
Set(ByVal value As String)
_cssClass = value
End Set
End Property
' Hide the base class RenderMode property since we don't use it
<Browsable(False)> _
<EditorBrowsable(EditorBrowsableState.Never)> _
<DesignerSerializationVisibility(DesignerSerializationVisibility.Hidden)> _
Public Shadows Property RenderMode() As UpdatePanelRenderMode
Get
Return MyBase.RenderMode
End Get
Set(ByVal value As UpdatePanelRenderMode)
MyBase.RenderMode = value
End Set
End Property
<DefaultValue(HtmlTextWriterTag.Div)> _
<Description("The tag to render for the panel.")> _
Public Property Tag() As HtmlTextWriterTag
Get
Return _tag
End Get
Set(ByVal value As HtmlTextWriterTag)
_tag = value
End Set
End Property
Protected Overrides Sub RenderChildren(ByVal writer As HtmlTextWriter)
If IsInPartialRendering Then
' If the UpdatePanel is rendering in "partial" mode that means
' it the top-level UpdatePanel in this part of the page, so
' it doesn't render its outer tag. We just delegate to the base
' class to do all the work.
MyBase.RenderChildren(writer)
Else
' If we're rendering in normal HTML mode we do all the new custom
' rendering. We then go render our children, which is what the
' normal control behavior is.
writer.AddAttribute(HtmlTextWriterAttribute.Id, ClientID)
If CssClass.Length > 0 Then
writer.AddAttribute(HtmlTextWriterAttribute.[Class], CssClass)
End If
If HtmlAttributes.Count > 0 Then
For Each ha As HtmlAttribute In HtmlAttributes
writer.AddAttribute(ha.AttrName, ha.AttrVal)
Next
End If
writer.RenderBeginTag(Tag)
For Each child As Control In Controls
child.RenderControl(writer)
Next
writer.RenderEndTag()
End If
End Sub
End Class
Public Class HtmlAttribute
Private PAttrName As String
Private PAttrVal As String
Public Sub New(AttrName As String, AttrVal As String)
PAttrName = AttrName
PAttrVal = AttrVal
End Sub
Public Property AttrName() As String
Get
Return PAttrName
End Get
Set(value As String)
PAttrName = value
End Set
End Property
Public Property AttrVal() As String
Get
Return PAttrVal
End Get
Set(value As String)
PAttrVal = value
End Set
End Property
End Class
Public Class HtmlAttributes
Inherits CollectionBase
Public ReadOnly Property Count() As Integer
Get
Return List.Count
End Get
End Property
Default Public Property Item(ByVal index As Integer) As HtmlAttribute
Get
Return CType(List.Item(index), HtmlAttribute)
End Get
Set(ByVal Value As HtmlAttribute)
List.Item(index) = Value
End Set
End Property
Public Function Add(ByVal item As HtmlAttribute) As Integer
Return List.Add(item)
End Function
Public Sub Remove(ByVal index As Integer)
If index < List.Count AndAlso List.Item(index) IsNot Nothing Then
List.RemoveAt(index)
Else
Throw New Exception(String.Concat("Index(", index.ToString, ") is not valid. List only has ", List.Count.ToString, " items."))
End If
End Sub
Public Sub Remove(ByRef hAttribute As HtmlAttribute)
If List.Count > 0 AndAlso List.IndexOf(hAttribute) >= 0 Then
List.Remove(hAttribute)
Else
Throw New Exception("Object does not exist in collection.")
End If
End Sub
End Class
End Namespace
Преобразование С# через http://www.developerfusion.com/:
using Microsoft.VisualBasic;
using System;
using System.Collections;
using System.Collections.Generic;
using System.Data;
using System.Diagnostics;
using System.ComponentModel;
using System.Web.UI;
namespace Controls
{
public class UpdatePanelCss : UpdatePanel
{
private string _cssClass;
private HtmlTextWriterTag _tag = HtmlTextWriterTag.Div;
public HtmlAttributes HtmlAttributes = new HtmlAttributes();
[DefaultValue("")]
[Description("Applies a CSS style to the panel.")]
public string CssClass {
get { return _cssClass ?? String.Empty; }
set { _cssClass = value; }
}
// Hide the base class RenderMode property since we don't use it
[Browsable(false)]
[EditorBrowsable(EditorBrowsableState.Never)]
[DesignerSerializationVisibility(DesignerSerializationVisibility.Hidden)]
public new UpdatePanelRenderMode RenderMode {
get { return base.RenderMode; }
set { base.RenderMode = value; }
}
[DefaultValue(HtmlTextWriterTag.Div)]
[Description("The tag to render for the panel.")]
public HtmlTextWriterTag Tag {
get { return _tag; }
set { _tag = value; }
}
protected override void RenderChildren(HtmlTextWriter writer)
{
if (IsInPartialRendering) {
// If the UpdatePanel is rendering in "partial" mode that means
// it the top-level UpdatePanel in this part of the page, so
// it doesn't render its outer tag. We just delegate to the base
// class to do all the work.
base.RenderChildren(writer);
} else {
// If we're rendering in normal HTML mode we do all the new custom
// rendering. We then go render our children, which is what the
// normal control behavior is.
writer.AddAttribute(HtmlTextWriterAttribute.Id, ClientID);
if (CssClass.Length > 0) {
writer.AddAttribute(HtmlTextWriterAttribute.Class, CssClass);
}
if (HtmlAttributes.Count > 0) {
foreach (HtmlAttribute ha in HtmlAttributes) {
writer.AddAttribute(ha.AttrName, ha.AttrVal);
}
}
writer.RenderBeginTag(Tag);
foreach (Control child in Controls) {
child.RenderControl(writer);
}
writer.RenderEndTag();
}
}
}
public class HtmlAttribute
{
private string PAttrName;
private string PAttrVal;
public HtmlAttribute(string AttrName, string AttrVal)
{
PAttrName = AttrName;
PAttrVal = AttrVal;
}
public string AttrName {
get { return PAttrName; }
set { PAttrName = value; }
}
public string AttrVal {
get { return PAttrVal; }
set { PAttrVal = value; }
}
}
public class HtmlAttributes : CollectionBase
{
public int Count {
get { return List.Count; }
}
public HtmlAttribute this[int index] {
get { return (HtmlAttribute)List[index]; }
set { List[index] = value; }
}
public int Add(HtmlAttribute item)
{
return List.Add(item);
}
public void Remove(int index)
{
if (index < List.Count && List[index] != null) {
List.RemoveAt(index);
} else {
throw new Exception(string.Concat("Index(", index.ToString(), ") is not valid. List only has ", List.Count.ToString(), " items."));
}
}
public void Remove(ref HtmlAttribute hAttribute)
{
if (List.Count > 0 && List.IndexOf(hAttribute) >= 0) {
List.Remove(hAttribute);
} else {
throw new Exception("Object does not exist in collection.");
}
}
}
}
Ответ 5
CodeBehind:
UpdatePanel panel = new UpdatePanel();
panel.Attributes.Add("class","your-css-class");
Результат HTML:
<div id="..." class="your-css-class"></div>
Ответ 6
HTML
<asp:UpdatePanel ID="UpdatePanel1" runat="server"></asp:UpdatePanel>
CSS
<style type="text/css">
#UpdatePanel1 { position: relative; }
</style>