L B Choudhury Ответов: 0

Как изменить размеры div во время выполнения на основе размера его элемента управления


У меня есть div и gridview на моей странице, как показано ниже:
<div id="gdDiv" style="overflow:scroll; height:500px; width:1270px; background-color:Black;" onload="MakeEqualDimension()">
            <asp:GridView ID="gdView" runat="server" Width="1200px" Height="350px"  
                RowStyle-HorizontalAlign="Center" RowStyle-VerticalAlign="Middle" 
                HeaderStyle-HorizontalAlign="Center" HeaderStyle-BackColor="Maroon" 
                HeaderStyle-ForeColor="White" HeaderStyle-Height="5px" 
                RowStyle-BackColor="Black" RowStyle-ForeColor="White"  GridLines="Both" 
                ShowFooter="true" RowStyle-Wrap="false" onrowcreated="gdView_RowCreated" 
                onrowdatabound="gdView_RowDataBound" HeaderStyle-Font-Size="10px" RowStyle-Font-Size="10px" HeaderStyle-Font-Bold="true" FooterStyle-Font-Bold="true" FooterStyle-Font-Size="10px">
            </asp:GridView>
        </div>

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

Что я уже пробовал:

Поэтому я попробовал следующий javascript на стороне клиента.

<script type="text/javascript">
    function MakeEqualDimension() 
    {
        if ((document.getElementById('gdDiv').offsetHeight) >
        (document.getElementById('gdView').getAttribute("height"))) 
        {
            document.getElementById('gdDiv').style.height =
          (document.getElementById('gdView').getAttribute("height")) + "px";
        }
        if ((document.getElementById('gdDiv').style.width) >
        (document.getElementById('gdView').getAttribute("width"))) 
        {
            document.getElementById('gdDiv').width =
          (document.getElementById('gdView').getAttribute("width")) + "px";
        }
    }
</script>

Но это не работает. Пожалуйста, помогите мне. Спасибо.

ZurdoDev

Вы пробовали установить высоту вашего div на 100%?

Richard Deeming

Просто уберите overflow, height и width стили. До тех пор, пока вы не используете float или абсолютное позиционирование на сетке, div автоматически расширится, чтобы быть по крайней мере таким же большим, как и его содержимое.

L B Choudhury

Стили height &width задаются для установки максимальных значений для div. И в тех случаях, когда высота или ширина gridview становится больше, чем максимальные значения div, то переполнение:прокрутка должна войти в изображение.

Richard Deeming

Так в чем же тогда проблема? Либо вы хотите, чтобы div расширялся, чтобы соответствовать сетке, либо нет.

0 Ответов