Как добавить пользовательский флажок в заголовке JQGrid

Question

Попробовал как ниже

jqGrid({
datatype: 'json',
colNames: ["<input type='checkbox' name = 'chkAllOutputField'/>", "other columns" ]

Флажок показан в заголовке, но не будет отмечен / снят, независимо от того, как вы его щелкнете.

Как я могу сделать это отмеченным / снятым, нажав

Answer 1

Найдите здесь один способ: Как добавить флажок в заголовок jQgrid

<input type="checkbox" onclick="checkBox(event)" /> 

и добавил следующий метод ...

function checkBox(e) 
{ 
   e = e||event;/* get IE event ( not passed ) */ 
   e.stopPropagation? e.stopPropagation() : e.cancelBubble = true; 
} 

Answer 2

Я не понимаю, какой сценарий вы хотите реализовать с помощью флажка внутри заголовка столбца, но чтобы иметь возможность просто изменить состояние флажка "check", вы должны отсоединить дескриптор события click, используемый jqGrid.для заголовка.Например, если столбец имеет имя «foo» (name: «foo»), а сетка имеет id = «list», то соответствующий элемент заголовка имеет id = «list_foo», и вы можете использовать

$("th#list_foo").unbind('click');

для этого

$("th#list_foo input").click(function(){
    // implement your custom behavior
    alert("clicked!");
});

Answer 3

Вот лучший способ заставить флажок в заголовке jqgrid работать.

Если вы видите HTML-код, есть тег div, окружающий входной тег, который имеет класс - ui-jqgrid-sortable,Это мешает установить флажок.

Удалите его, все работает так, как вы ожидали.

Решение ниже

Добавьте идентификатор к флажку

<input type="checkbox" id="hdrCbox" onclick="checkBox(event)" />

при инициализации сетки или формыдобавьте следующую строку.

$('#hdrCbox').parent().removeClass('ui-jqgrid-sortable');