확인란 상태에 따라 JqGrid의 행을 강조 표시하는 방법은 무엇입니까?

체크박스가 True일 때 행 강조표시

jqGrid 프로젝트에서는 체크박스의 상태에 따라 행을 강조표시하는 것을 목표로 합니다.

Rowattr 콜백

jqGrid 버전 4.3.2에는 그리드 채우기 프로세스 중에 행에 사용자 정의 속성을 추가할 수 있는 rowattr 콜백이 도입되었습니다. 이는 행 강조 표시에 적합한 접근 방식입니다.

rowattr: function (rd) {
    if (rd.GroupHeader === "1") { // Verify this logic based on your data structure
        return {"class": "myAltRowClass"};
    }
}

강조 표시를 위한 CSS 클래스

강조 표시된 행의 배경색을 설정하는 CSS 클래스 myAltRowClass를 정의하세요.

Multiselect 및 Gridview

행 선택 없이 행 강조 표시의 경우 multiselect를 생략합니다: true. 성능을 향상하려면 Gridview를 활성화하십시오: true.

열 템플릿 사용

코드를 간소화하려면 열 템플릿을 활용할 수 있습니다.

cmTemplate

cmTemplate: {align: 'center', sortable: false, editable: true, width: 80}

사용자 정의 템플릿

일반적으로 사용되는 속성에 대한 사용자 정의 템플릿 만들기:

var myCheckboxTemplate = {
    formatter: 'checkbox',
    edittype: 'checkbox',
    type: 'select',
    editoptions: {value: "1:0"}
};

var myTextareaTemplate = {
    edittype: "textarea",
    editoptions: {size: "30", maxlength: "30"}
};

최적화된 colModel

colModel: [
    {name: 'TypeID', index: 'TypeID', width: 350, hidden: true, edittype: "select",
        editoptions: {value: getTypeID()}, editrules: { edithidden: true}},
    {name: 'Order1', index: 'Order1', template: myTextareaTemplate},
    {name: 'Order2', index: 'Order2', template: myTextareaTemplate},
    {name: 'Order3', index: 'Order3', template: myTextareaTemplate},
    {name: 'Description', index: 'Description', width: 140, template: myTextareaTemplate},
    {name: 'Notes', index: 'Notes', width: 120, template: myTextareaTemplate},
    {name: 'Measure', index: 'Measure', template: myTextareaTemplate},
    {name: 'UnitPrice', index: 'UnitPrice', width: 100, editable: false, template: myTextareaTemplate},
    {name: 'Remarks', index: 'Remarks', width: 140, template: myTextareaTemplate},
    {name: 'UnitCost', index: 'UnitCost', width: 100, template: myTextareaTemplate},
    {name: 'Service', index: 'Service', width: 120, template: myTextareaTemplate},
    //If the GroupHeader is true the row background is yellow
    {name: 'GroupHeader', index: 'GroupHeader', width: 100, template: myCheckboxTemplate},
    {name: 'IsGroup', index: 'IsGroup', template: myCheckboxTemplate}
],
cmTemplate: {align: 'center', sortable: false, editable: true, width: 80}

위 내용은 확인란 상태에 따라 JqGrid의 행을 강조 표시하는 방법은 무엇입니까?의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!