Rumah > hujung hadapan web > tutorial js > Bagaimana untuk Menyerlahkan Baris dalam JqGrid Berdasarkan Status Kotak Semak?

Bagaimana untuk Menyerlahkan Baris dalam JqGrid Berdasarkan Status Kotak Semak?

DDD
Lepaskan: 2024-11-07 10:49:02
asal
908 orang telah melayarinya

How to Highlight Rows in a JqGrid Based on Checkbox Status?

Serlahkan Baris Apabila Kotak Semak Benar

Dalam projek jqGrid anda, anda bertujuan untuk menyerlahkan baris berdasarkan status kotak pilihan.

Panggil Balik Rowattr

Versi 4.3.2 jqGrid memperkenalkan panggilan balik rowattr, yang membolehkan anda menambah atribut tersuai pada baris semasa proses pengisian grid. Ini ialah pendekatan yang sesuai untuk penyerlahan baris.

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

Kelas CSS untuk Penyerlahan

Tentukan kelas CSS myAltRowClass yang menetapkan warna latar belakang untuk baris yang diserlahkan.

Berbilang pilih dan paparan grid

Untuk penyerlahan baris tanpa pemilihan baris, tinggalkan pilihan berbilang: benar. Untuk meningkatkan prestasi, dayakan gridview: true.

Penggunaan Templat Lajur

Untuk menyelaraskan kod anda, anda boleh menggunakan templat lajur:

cmTemplate

cmTemplate: {align: 'center', sortable: false, editable: true, width: 80}
Salin selepas log masuk

Templat Tersuai

Buat templat tersuai untuk sifat yang biasa digunakan:

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

var myTextareaTemplate = {
    edittype: "textarea",
    editoptions: {size: "30", maxlength: "30"}
};
Salin selepas log masuk

ColModel yang dioptimumkan

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}
Salin selepas log masuk

Atas ialah kandungan terperinci Bagaimana untuk Menyerlahkan Baris dalam JqGrid Berdasarkan Status Kotak Semak?. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!

sumber:php.cn
Kenyataan Laman Web ini
Kandungan artikel ini disumbangkan secara sukarela oleh netizen, dan hak cipta adalah milik pengarang asal. Laman web ini tidak memikul tanggungjawab undang-undang yang sepadan. Jika anda menemui sebarang kandungan yang disyaki plagiarisme atau pelanggaran, sila hubungi admin@php.cn
Tutorial Popular
Lagi>
Muat turun terkini
Lagi>
kesan web
Kod sumber laman web
Bahan laman web
Templat hujung hadapan