rowboundイベントでGridView列の幅を取得する方法は？

Question

GridViewに "Weightage"という列があります。私はグリッドビューの外に "合計"と呼ばれるテキストボックスを持っています。このテキストボックスを列の重みのすぐ下に並べます。

</asp:GridView> 
    <div> 
      <span id="q1totalweightage" runat="server">Total<asp:TextBox ID="txtq1totalweightage" runat="server" ></asp:TextBox></span> 
    </div> 

背後にあるコード：

protected void grvGoals_RowDataBound1(object sender, GridViewRowEventArgs e) 
{ 
    switch (e.Row.RowType) 
    { 
     case DataControlRowType.DataRow: 
     q1totalweightage.Attributes.Add("style", "margin-left: " +  e.Row.Cells[0].Width + "px;"); 
break; 
    } 

注：は、私はいくつかの理由でフッター内、この合計テキストボックスを配置することはできませんと仮定します。

Answer 1

できませんサーバー側のGridView列の計算幅を取得します。そのためにはJavaScriptを使用する必要があります。そのために

あなたはまた、この

<asp:TemplateField HeaderText="Contact Name"> 
    <ItemTemplate> 
     <asp:Label ID="ContactName" runat="server" 
      CssClass="my-column" 
      Text='<%# Eval("ContactName") %>'> 
     </asp:Label>     
    </ItemTemplate> 
</asp:TemplateField> 

のようなあなたの列にスパンについてrunat="server"を使用する必要がクラス名を与えない必要があります。

<span id="q1totalweightage">Total 
    <asp:TextBox ID="txtq1totalweightage" runat="server" > 
    </asp:TextBox> 
</span> 

バニラはJavaScript

document.addEventListener("DOMContentLoaded", function (event) { 
    var column = document.getElementsByClassName("my-column")[0].parentNode; 
    var row = column.parentNode; 
    var newMargin = row.clientWidth - column.clientWidth; 
    document.getElementById("q1totalweightage").style.marginLeft = newMargin + "px"; 
}); 

またはjQueryの

$(document).ready(function() { 
    var column = $(".my-column:first").closest("td"); 
    var row = column.closest("tr"); 
    //var newMargin = row.width() - column.width(); 
    var newMargin = row.outerWidth() - column.outerWidth(); 
    $("#q1totalweightage").css("margin-left", newMargin + "px"); 
}); 

P.S：このコードは、列連絡先の名前がテーブルの最後列であることを前提としています。