Easyui fügt Treegrid ein Steuerungsbeispiel-Tutorial hinzu

Ich habe mir kürzlich einen einfachen Baum angesehen und fand, dass der Baum darin ziemlich gut war, obwohl er sich etwas unflexibel anfühlte. Lassen Sie uns darüber sprechen, wie man Baumarten Kontrolleffekte hinzufügt. In diesem Artikel wird hauptsächlich die Implementierungsmethode zum Hinzufügen von Kontrollen zum Baumgitter vorgestellt in Easyui. Freunde in Not können sich darauf beziehen, ich hoffe, es kann allen helfen.

Easyui Tree Plus Control

Fügen Sie das zu verwendende Formatierungsattribut im Buch hinzu, das beim Laden angezeigt werden kann

function formatProgress(value){
 //console.log(value);
 if (value){
  var box = value.split(",");
  //console.log(box);
  var boxid = box[1];
  var s;
  //alert(value);
  if(box[0]=="显示"){
   s = '<input id=&#39;+boxid+&#39; type="checkbox" onclick="isShow()" checked="checked">';
  }else{
   s = '<input id=&#39;+boxid+&#39; type="checkbox" onclick="isShow()" >';
  }
  return s;
 } else {
  return '';
 }
}

Auf diese Weise wird das Steuerelement beim Laden angezeigt. Wenn der Steuerelementtyp beim Laden in Ordnung ist, kann die Auswahl anhand des Werts beurteilt werden. Dies ist etwas mühsam, kann aber verwendet werden.

function formatProgress1(value){
 console.log("formatProgress1 执行了");
 console.log(value);
 if (value){
  var box = value.split(",");
  console.log(box);
  var boxid = box[1];
  var s;
  if(box[0]=='缺省'){
   s= '<select class=&#39;+boxid+&#39; onchange="isType()"><option selected="selected" value="0">缺省</option><option value="1">直接链接</option><option value="2">内容列表</option><option value="3">教学资源</option></select>'; 
  }else if(box[0]=='直接链接'){
   s= '<select class=&#39;+boxid+&#39; onchange="isType()"><option value="0" >缺省</option><option value="1" selected="selected">直接链接</option><option value="2">内容列表</option><option value="3">教学资源</option></select>'; 
  }else if(box[0]=='内容列表'){
   s= '<select class=&#39;+boxid+&#39; onchange="isType()"><option value="0" >缺省</option><option value="1">直接链接</option><option selected="selected" value="2">内容列表</option><option value="3">教学资源</option></select>'; 
  }else if(box[0]=='教学资源'){
   s= '<select class=&#39;+boxid+&#39; onchange="isType()"><option value="0" >缺省</option><option value="1">直接链接</option><option value="2">内容列表</option><option selected="selected" value="3">教学资源</option></select>'; 
  }
  return s;
 } else {
  return '';
 }
}

Einige Dinge in Easyui sind recht flexibel, aber die Stile sehen nicht so gut aus wie die von Bootstrap, aber ich finde die Bäume wirklich gut.

Verwandte Empfehlungen:

Über die Implementierung der TreeGrid-Abfragefunktion von EasyUI in jQuery,

Über die Implementierung des Anzeige-Kontrollkästchens durch jQuery Easyui Treegrid Funktionsbeispiel

Ein einfaches Beispiel für die Verwendung von Treegrids in jquery easyui

Das obige ist der detaillierte Inhalt vonEasyui fügt Treegrid ein Steuerungsbeispiel-Tutorial hinzu. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!