GridViewを含む空のdivを取り除く方法

Question

ASP.NETでGridviewsは親divコンテナを生成するテーブルを生成します。これは、生成されたdivにスタイルを付加する方法がないため、CSSレイアウトを壊す可能性があります。 divが生成されないようにする方法やスタイルを適用する方法はありますか？

これは、hereと尋ねられ、解決済みとマークされましたが、MSは、ページングと並べ替えの機能にdivが必要だと言っただけです。私がページングとソート機能を使いたい場合、自分のdivをその周りにラップしてスタイルを適用することはできないということを理解していますか？ありがとう

Answer 1

削除：

<asp:GridView ... CssClass="nameOfStyleClass" ... /> 

次にCSSクラスを定義します外側のdivを作成し、次にプレレンダリングイベントで新しいレンダリングされたhtmlをhtmltextwriteするか、これを行うためのユーザーコントロールまたはカスタムコントロールを作成します。

しかし、グリッドビューの機能を破る危険性がありますが、divを使用する機能を使用しないことがわかっている場合は、その機能を使用できなくなる可能性があります。

Answer 2

asp：Panelの内部に配置し、テーブルが空の場合はパネルのVisibleプロパティをfalseに設定できます。

Answer 3

あなたのグリッドビューに明示的なCssClassを定義して利用することができます。 、私はこれをやったことがないが、私は私の最初の推測は、あなたがそれをブラウザになる直前にレンダリングされたHTML出力をつかむことができだろう

.nameOfStyleClass 
{ 
    < Style stuff > 
} 

Answer 4

ここで同じ問題は、OMGのそれですだから厄介な。 IE6/7のレンダリングで、divをグリッドビューの一番上に置いたときにグリッチが発生する - 親DIVによって、2つの要素の間にスペースができます。

私は反射板を使用してGridViewのコードに掘って、問題を発見した：

Protected Friend Overrides Sub Render(ByVal writer As HtmlTextWriter) 
    Me.Render(writer, Not MyBase.DesignMode) 
End Sub 

をので、 'renderPanel' ==ないのdesignMode：

Private Sub Render(ByVal writer As HtmlTextWriter, ByVal renderPanel As Boolean) 
    If (Not Me.Page Is Nothing) Then 
     Me.Page.VerifyRenderingInServerForm(Me) 
    End If 
    Me.PrepareControlHierarchy 
    If renderPanel Then 
     Dim clientID As String = Me.ClientID 
     If Me.DetermineRenderClientScript Then 
      If (clientID Is Nothing) Then 
       Throw New HttpException(SR.GetString("GridView_MustBeParented")) 
      End If 
      Dim builder As New StringBuilder("__gv", (clientID.Length + 9)) 
      builder.Append(clientID) 
      builder.Append("__div") 
      writer.AddAttribute(HtmlTextWriterAttribute.Id, builder.ToString, True) 
     End If 
     writer.RenderBeginTag(HtmlTextWriterTag.Div) 
    End If 
    Me.RenderContents(writer) 
    If renderPanel Then 
     writer.RenderEndTag 
    End If 
End Sub 

がこれはレンダリングから呼び出されます。 DIVは、UpdatePanelでgridview がではない場合、ページングとソートに使用されます。私のサイトでは、すべてのGridViewsがUPしているプラ​​ス私の解決策は、以下に上記関数をオーバーライドすることだったので、彼らは、カスタムGridViewのクラスから継承されます：

Protected Overrides Sub Render(ByVal writer As System.Web.UI.HtmlTextWriter) 
     Me.PrepareControlHierarchy() 
     Me.RenderContents(writer) 
    End Sub 

他のソリューションからrenderメソッドをコピーすることができ必要に応じて変更しました。

これはHACKの匂いです。あなたは警告されていますが、ページング/ソートを使用していない場合はespで動作する可能性があります。

Answer 5

変更レンダリングせずに簡単な解決策：

私はそれが私のレイアウトを壊すためのGridViewによって生成されたdiv要素にスタイルを適用する必要があるので、私は「myContainerDiv」idを持つdiv要素を作成し、その中に私のGridViewを移動jQueryを使用していくつかのスタイルを適用します。

例：

$("#myContainerDiv > div").css("display", "inline"); 

Iは$（ドキュメント）.ready（関数（{}））でこのJavaScriptを置く;. UpdatePanelを使用する場合は、この特定のケースで使用する必要があるように、すべての非同期ポストバックでこの$（）。css（）を実行します。それがなければ、あなたのgridviewが含まれているupdatepanelを実行するとスタイルは失われます。しかし、私はこの$を実行する（）CSSを（）特定のUpdatePanelは、（すべてのすべてのすべての非同期ポストバックでこのjavascriptの命令を実行する必要）

例解雇されていない場合にのみ：。

<script type="text/javascript"> 

Sys.WebForms.PageRequestManager.getInstance().add_endRequest(EndRequestHandler); 

function EndRequestHandler(sender, args) { 
    if (args.get_error() == undefined && sender._updatePanelClientIDs != null && 
      sender._updatePanelClientIDs.length > 0 && sender._updatePanelClientIDs[0] == "<%= MyParticularUpdatePanel.ClientID %>") { 
      $("#myContainerDiv > div").css("display", "inline"); 
     } 
    } 

</script> 

を解決します！

ページ全体がそのようになります。

<script type="text/javascrcipt" src="jquery.js"></script> 

<script type="text/javascript">  

Sys.WebForms.PageRequestManager.getInstance().add_endRequest(EndRequestHandler); 

function EndRequestHandler(sender, args) { 
    if (args.get_error() == undefined && sender._updatePanelClientIDs != null && 
      sender._updatePanelClientIDs.length > 0 && sender._updatePanelClientIDs[0] == "<%= MyParticularUpdatePanel.ClientID %>") { 
      $("#myContainerDiv > div").css("display", "inline"); 
     } 
    } 

</script> 

<asp:UpdatePanel runat="server" ID="MyParticularUpdatePanel" UpdateMode="Conditional" RenderMode="Inline"> 
<Triggers> 
// Your triggers here... 
</Triggers> 
<ContentTemplate> 
<div id="myContainerDiv" style="display:inline;"> 
    <asp:GridView runat="server" ID="MyGridView" AutoGenerateColumns="false" Height="150px" EmptyDataText="No data."> 
    <Columns> 
     <asp:BoundField DataField="ID" HeaderText="My ID" /> 
    </Columns> 
    </asp:GridView> 
</div> 
</ContentTemplate> 
</asp:UpdatePanel> 

私はメモ帳を使用して、それを書いたので、私が書いたように、このコードは正確にコンパイルするかどうか、私は知りません。

私の貧しい私の英語のために申し訳ありませんが、私はブラジル出身です。

Christophe Trevisani Chavey。 http://www.christophetrevisani.com

Answer 6

あなたは（あなたがしていることが表示されます）unstyledラッパーで立ち往生したが、スタイルを適用し、それを別ラッパーを与える、との組み合わせにあなたのスタイルを適用したいしている場合。無地のdivは、あなたが（例えば）を取り除きたいいくつかのパディングを持っている場合、これは、ASPXで：CSSのための

<div id="crushGvDiv"> 
<asp:GridView ... > 
</div> 

と、この：

div#crushGvDiv, div#crushGvDiv div { padding: 0; margin: 0; } 

Answer 7

私は、ブートストラップ応答を使用して、この同じ問題を抱えていましたGridViewコントロールを持つテーブル私は簡単に準備ができて関数に次の行を追加することで（一部はハック言うかもしれない）問題を解決することができました：

$("div.table-responsive > div").addClass('table-responsive'); 

これは、次のようなものになります：

<div class=table-responsive> 
    <div class=table-responsive> 
     <table ..... 

これはかなり動作するはずですまあ、それは完璧な解決策ではありません。

Answer 8

CSSクラス "gridViewWrapperFix"を使用した、最も簡単で最適なソリューションです。

ASPX：

<div class="gridViewWrapperFix"> 

    <asp:GridView> 
    <%--the full gridview would go here--%> 
    </asp:GridView> 

</div> 

CSS：

/* styles the div that gets auto generated around and asp.net gridview */ 

.gridViewWrapperFix > div { 
    padding: 0; 
    margin: 0; 
    border: 3px solid red; 
}