Как изменить размер и сохранить динамические таблицы? - PullRequest
Новая
       63

Как изменить размер и сохранить динамические таблицы?

0 голосов
/ 09 апреля 2019

Я следую этому уроку https://github.com/dobtco/jquery-resizable-columns для изменения размера и сохранения столбцов таблицы.

Из моей таблицы, First, два столбца заголовка и последний дочерний элемент являются статическими идентификаторами, но остальные являются значениями динамического идентификатора.

Каждый динамический идентификатор-изменяемого размера столбца-идентификатора имеет разные значения, но опция сохранения не работает.Но для статического data-resizable-column-id - опция хранилища работает хорошо.

Ресурсы: 

<script src="http://ajax.googleapis.com/ajax/libs/jquery/3.1.0/jquery.min.js"></script>
<script src="~/Scripts/store.min.js"></script>
<script src="~/Scripts/store.min.js"></script>
<script src="~/Scripts/jquery.resizableColumns.js"></script>

JavaScript: 

$(function(){
    $("table").resizableColumns({
        store: window.store
    });
});

HTML-код статического заголовка: 

<th data-resizable-column-id="PlusSymbol" style="width: 3.5%; text-align: center;">
    <div class="th-inner" style="width: 30px; height: 40px;"></div>
</th>

HTML-код динамического заголовка: 

<th id="asdf" data-resizable-column-id="Description-4f81-b691-061facef4e53" class="Description-4f81-b691-061facef4e53 key-grid-header-column" data-property="Description" data-guid="SchedularGuid" title="Description" data-toggle="tooltip" style="width:4.0952380952380952380952380952%;">
    <div class="th-inner">
        <span class="key-grid-header-column-text">
            <i class="sort-icon fa"></i>
            Description
        </span>
    </div>
</th>

Css:

#asdf {
    display: none;
    max-width: 0;
    overflow: hidden; 
    text-overflow: ellipsis; 
    white-space: nowrap;
}
.th-inner {
    overflow: hidden; 
    text-overflow: ellipsis; 
    white-space: nowrap; 
    height: 40px;
}
.sort-icon {
    display: none;
}
...