Ringkasan fungsi biasa dan ciri pemalam Jquery pokok tak terhingga zTree_jquery

Malah, tapak web rasmi Ztree sudah mempunyai dokumentasi API terperinci Semuanya tertakluk kepada arahan di tapak web rasmi Saya hanya meringkaskan beberapa ciri fungsi ztree yang biasa digunakan.

(Struktur sintaks ztree adalah berdasarkan konfigurasi nilai kunci)

1: Sokong pemuatan data tak segerak

Konfigurasi sintaks:

async: {
enable: true, 

url:'abc.ashx',

otherParam: { "request": "requestname" }

}

Penerangan ringkas:

dayakan: Tetapkan sama ada zTree mendayakan mod pemuatan tak segerak.

url: alamat URL untuk Ajax mendapatkan data.

otherParam: Pasangan nilai kunci parameter statik diserahkan oleh permintaan Ajax Setara dengan parameter data dalam ajax.

2: Muatkan data dan ikat Secara amnya, entiti struktur data ditakrifkan sebagai model ini harus mengandungi perhubungan hierarki, biasanya termasuk: ID, ID induk, Nama.

.

Kemudian konfigurasikan sintaks:

data: {
simpleData: {
enable: true
}
}

atau

data: {
key: {
children: "childrens",

checked: "IsChecked"
}
}

Penerangan ringkas:

simpleData: Anda boleh menggunakan tatasusunan sebagai pengikatan sumber data Pada masa ini, data yang dimuatkan secara tidak segerak boleh menjadi struktur selari.

kanak-kanak: Tentukan nama atribut untuk menyimpan data nod anak dalam data nod Pada masa ini, data yang dimuatkan secara tidak segerak ialah struktur terlipat pepohon jadi algoritma rekursif mesti digunakan apabila bahagian belakang memuatkan data.

3: Menyokong pemilihan tunggal dan fungsi semak

Konfigurasi sintaks:

check: {
enable: true,
chkStyle: "checkbox",
radioType: "all"
chkboxType:{ "Y": "", "N": "" }
},

data: {
key: {

checked: "IsChecked"
}
}

Penerangan ringkas:

dayakan: Tetapkan sama ada kotak semak / radio dipaparkan pada nod zTree

chkStyle: jenis kotak pilihan (kotak semak atau radio)

radioType:radio grouping julat

chkboxType: Tandai kotak pilihan untuk perhubungan antara nod ibu bapa dan anak

ditandakan: Menunjukkan sama ada kotak semak ditandakan selepas memuatkan data IsChecked ialah medan yang ditakrifkan dalam model struktur data bahagian belakang

4: Sokong menambah nod anak, mengedit nod dan memadamkan acara nod

Di sini saya akan memperkenalkan cara menyesuaikan butang menambah, mengedit dan memadam

Konfigurasi sintaks:

view: {
addHoverDom: addHoverDom,
removeHoverDom: removeHoverDom
　}

Fungsi addHoverDom ialah:

function addHoverDom(treeId, treeNode) {
var sObj = $("#" + treeNode.tId + "_span");
if ($("#addBtn_" + treeNode.id).length > 0) return;
var str= "<a id='addBtn_" + treeNode.id + "' onclick='自定义函数1(" + treeNode.DepartmentID + ")'>添加子节点</a>";
str+= "<a id='addBtn1_" + treeNode.id + "' onclick='自定义函数2(" + treeNode.DepartmentID + ")'>编辑节点</a>";
str+= "<a id='addBtn2_" + treeNode.id + "' onclick='自定义函数3(" + treeNode.DepartmentID + ")'>删除节点</a>";
sObj.after(str);
};

Fungsi removeHoverDom ialah:

function removeHoverDom(treeId, treeNode) {
$("#addBtn_" + treeNode.id).unbind().remove();
$("#addBtn1_" + treeNode.id).unbind().remove();
$("#addBtn2_" + treeNode.id).unbind().remove();
　};

Penerangan ringkas:

addHoverDom: digunakan untuk memaparkan kawalan yang ditentukan pengguna apabila tetikus bergerak ke nod Keadaan tersembunyi adalah sama dengan butang edit dan padam di dalam zTree

removeHoverDom: Digunakan untuk menyembunyikan kawalan yang ditentukan pengguna apabila tetikus bergerak keluar dari nod Keadaan tersembunyi adalah sama dengan butang edit dan padam di dalam zTree