動態添加easyui 控件


jquery提供了append,appendTo方法,可以動態添加靜態的html文本,在easyui中,要動態添加easyui控件要怎么做呢,下面就來介紹動態添加easyui控件。

    使用方法:和添加靜態html一樣,只是在添加完后,需要用調用$.parser.parse()渲染頁面。

 1  function createPanel(container) {
 2         var icon = 'layout-button-down';
 3 
 4         var p = $('<div></div>').appendTo($(container)).panel({
 5             cls: 'easyui-panel',
 6             title: 'lname',
 7             closed: false,
 8             width: $(container).width(),
 9             iconCls: 'icon-save',
10             doSize: false,
11             tools: [{
12                 iconCls: icon,
13                 handler: function () {
14                     $(p).toggle("slow");
15                 }
16             }]
17         }).css('display','block');
18         return p;
19         //        $(container).append('<div  class=\"easyui-panel\" title=\"My Panel\"  style=\"width:500px;height:150px;padding:10px;\"  data-options=\"iconCls:\'icon-save\',closable:true,    collapsible:true,minimizable:true,maximizable:true\"></div>');
20     }
21     function createContentPanel(container, para) {
22       var parent=$('<div class=\"easyui-panel\"  ></div>');
23       $.each(para,function(i,n)
24       {
25             $(parent).append('<div><label for=\"'+n.name+'\">名稱:</label> <input class=\"easyui-validatebox\" type=\"'+n.type+'\" name=\"'+n.name+'\" data-options=\"required:true\" /> </div>  <div>');
26       });
27       $(container).append(parent);
28        
29     }
30 
31     $.fn.cform = function (para) {
32         try {
33             var forms = $('<form action=\'\'></form>');
34             for (var j = 0; j < 3; j++) {
35                 var panels = [];
36                 for (var i = 0; i < 3; i++) {
37                     var obj =
38                 {
39                     'name': para.name,
40                     'type': para.type
41                 };
42                     panels.push(obj);
43                 }
44                 createPanel($(forms));
45                 createContentPanel(forms, panels);
46             }
47            
48             $(this).append($(forms));
49             
50             $.parser.parse();
51         } catch (e) {
52             alert(e);
53         }

 


免責聲明!

本站轉載的文章為個人學習借鑒使用,本站對版權不負任何法律責任。如果侵犯了您的隱私權益,請聯系本站郵箱yoyou2525@163.com刪除。



 
粵ICP備18138465號   © 2018-2025 CODEPRJ.COM