Установите ширину столбца в представлении ГАНТА

Question

Когда используется представление ГАНТА, как можно изменить размер столбцов с помощью jQuery без использования сгенерированного controlid (как в этом примере)?Я ищу способ сделать это с помощью многократно используемой функции javascript.

Я думаю о том, чтобы иметь возможность найти элемент управления, который имеет ListViewWebPartJSGrid в его идентификаторе.Возможно, что на странице их было бы больше одного, но это сработало бы.

[обновление]

Хорошо, я выяснил, как получить идентификатор элемента управления (вы можете видеть изменение цвета):

var $trackingGridID = $("[id$=_ListViewWebPartJSGrid_leftpane_mainTable]").attr("id");
$('#' + trackingGridID).css("background-color", "blue");

//this will fetch:  ctl00_ctl21_g_c3e5fead_d466_4448_9648_dcb92778921d_ListViewWebPartJSGrid_leftpane_mainTable

Теперь, когда у меня есть идентификатор, нужно выяснить, как изменить ширину столбцов...

Но я хочу сделать что-то вроде этого:

function SetColumnWidths(column1, column2, column3)...

Answer 1

А, понял.

Сначала извлеките динамический идентификатор элемента управления.Для наших целей нединамическая его часть - это _ListViewWebPartJSGrid_leftpane_mainTable, так что мы запросим это у jQuery.

var $trackingGridID = $("[id$=_ListViewWebPartJSGrid_leftpane_mainTable]").attr("id");
$('#' + trackingGridID).css("background-color", "blue");

//это приведет к извлечению:ctl00_ctl21_g_c3e5fead_d466_4448_9648_dcb92778921d_ListViewWebPartJSGrid_leftpane_mainTable

---

Извлеките столбец по индексу (чтобы изменить цвет, вы должны изменить различные a свойства)

var thiscolumn = $('#' + trackingGridID + " th[role='columnheader']:eq(0)");    
$(thiscolumn).css("width", "400");

Выборка строки по индексу:

var thisrow = $('#' + trackingGridID).find("tr:eq(2)"); 
$(thisrow).css("background-color", "blue");

Извлекать определенную ячейку по индексу:

var thiscell = $('#' + trackingGridID).find("td:eq(6)");
$(thiscell).css("background-color", "yellow");

Конечно, чтобы изменить ширину, вы просто добавляете это в переменные:

.css("width", "400");

---

Функция

SetGanntColumnWidth(0, 400)  //set the first column's width
SetGanntColumnWidth(2, 350)  //set the third column's width

//The third parameter is optional in case the idpart changes
function SetGanntColumnWidth(whatcolumn, whatwidth, whatidpart){
    if(!whatidpart)
        whatidpart = "_ListViewWebPartJSGrid_leftpane_mainTable";
    var thisid = $("[id$=" + whatidpart + "]").attr("id");
    var thiscolumn = $('#' + thisid + " th[role='columnheader']:eq(" + whatcolumn + ")");

    $(thiscolumn).css("width", whatwidth);
    $(thiscolumn).children().css("width", whatwidth);   
}