Thanks for your help. One thing I could not understand is: how do I recreate the desktop app? If I run the code pasted down here and close it, the dialog is completely destroyed. How can I recreate the same dialog (desktop app) again?

$('body').desktop('openApp', {
        id:'winid',
   icon: 'images/win.png',
   name: 'About',
   width: 400,
   height: 200,
   href: ...,
   onLoad: function(){
      //.....
   },
   onClose: function(){
      $(this).dialog('destroy');
   }
});

How do I recreate it programmatically?


Thanks for your patience and help.

Alfred

Thanks for the reply. it's ok for me to use buffer. But When I use it in a datagrid inside a dialog, the scrolling with mouse wheel is very slow. If I use the verticle scroll bar, the speed is normal. But If I use the mousewheel, it is very very slow. That's the problem. I wonder if you could help me solve the problem.

Thanks and regards,

Alfred

The mousewheel scrolling of datagrid inside the dialog is very slow. For example, I open a dialog. This dialog contains a datagrid. The datagrid has many rows, so I used buffer scroll. Everything works fine except that the scrolling speed is when I use my mouse wheel to scroll. What could be the problem?


Thanks and regards,

Alfred

I am trying to format date to show event and status from remote json file but could not get it working:

var remotejson = {
   "id":[{
      "d":5,
      "m":4,
      "y":2019,
      "status":"P",
      "color":"teal"
   },{
      "d":12,
      "m":4,
      "y":2019,
      "status":"H",
      "color":"blue"
   }]
};
$.each(remotejson.id, function(i, item) {
       var jd = json.id.d;
       var jm = json.id.m;
       var jy = json.id.y;
       var jc = json.id.color;
       var js = json.id.status;
  });
   $('#atcalendar').calendar({
   formatter: function(date){
      var m = date.getMonth();
      var d = date.getDate();
      var y = date.getFullYear();
                var opts = $(this).calendar('options');
      if(opts.d==jd && opts.m==jm && opts.y==jy){
         return '<div style="color:'+jc+'">' + d + '<br>'+jdate.status+'</div>';
          } else {
                   return d;
              }      
   },
   onSelect: function(date){
            //show another dialog
   },
       onNavigate:function(year,month,date){
          //load fresh data from php which generates the json
       }
});

If I put the each loop inside the formatter, the calendar date also gets looping. With the above code, no date is shown on the calendar. I am trying to put the above code on easyui dialog onLoad:function(). I want to style and show custom text along with the date, and when I click and the calendar navigation, I want fresh data from remote json generated by php. Is this possible in easyui calendar? If it is possible to achieve, please help.

Thanks and regards,
Alfred

Thanks for the quick reply. Please can you show me an example code. If I run an OnClose:function(){ $(this).dialog('destroy')}, I could no longer create the desktop dialog.

Thanks and regards,
Alfred

I already tested this, It does not simply work.  For example

$('body').desktop('openApp', {
        id:'did',
   icon: 'images/win.png',
   name: 'About',
   width: 400,
   height: 200,
   href: ...,
   onLoad: function(){
      //...
   },
   onClose: function(){
       $('#did').dialog('destroy');
            //$(this).dialog('destroy');
   }
});

If we close the '#did' dialog, we completely destroy the dialog. there is no way we can run the dialog now. But if I want to run the dialog again, how can I recreate the dialog? In my application, I sometimes want to recreate the dialog rather than depending on the existing dialog. Thank you very much.

Regards,

Alfred

This solves the problem. Before your solution arrived, I did this way:

   

Code:

 var dgContainer= document.getElementById('idcontain');
    h = document.createElement('div');
    h.setAttribute("id", 'dgid');
    dgContainer.appendChild(h);

Now I want a way to do the same with Easyui Desktop dialog. Please can you give me the code.

Thanks and regards.
Alfred

I open a new dialog which contains a script to open another dialog which has cancel and ok button.

Code:

function openDialog(){
   $('#perDialog').dialog({
        title: 'All Students',
        width: 900,
        height: 650,
        closed: false,
        maximizable:true,
        cache: false,
        href: 'Students/All'
}

Inside Students/All.php, I have the following script:

Code:

function Note(){
   $('#note').dialog({
        title: ' Write A Note',
        width: 500,
        height: 250,
        closed: false,
        maximizable:true,
        cache: false,
        href: 'Students/Form',
        buttons: [{
            text:'Save',
            iconCls:'icon-ok',
            handler:function(){
                saveNote();
            }
        },{
            text:'Cancel',
            iconCls:'icon-undo',
            handler:function(){
                $('#note').dialog('close');
            }
        }]
   });
}

When I run openDialog() to open  $('#perDialog') for the first time and run Note() to open $('#note') dialog, the Save and Cancel buttons are working fine. But If I close $('#perDialog') dialog and run openDialog() to open it, and open the  $('#note') dialog, the Save Button and Cancel Button in  $('#note') dialog are no longer working. What could be the problem? Please help.

Thanks it works..

It works great. But I have one more request. Why does not it close the dialog created using function? I really appreciate your help.

Code:

function singleCollect(){
    $('body').desktop('openApp', {
        id:'scollection',
    	name: '',
        icon: '../images/get.png',
        width: 290,  
        href: 'template/single.php',
        bodyCls: 'panel-noscroll'
    });
}

Thanks

Alfred

Please can you give an example on how I would select the active window and close it.

Thanks.

How do I close an active dialog in easyui desktop. I know it is possible to close it by its ID but I want to close just the active window using js code. This was we can close the active window by using keyboard shortcut key. Please help. I want to know how I would get the active window (desktop dialog) using js.

The following code checks whether the dialog is created but it uses ID selector and does not particularly target active dialog.

Code:

$('#dlg').data('dialog')

But how do I target an active dialog and not using ID selector.

Thanks and regards,

Alfred

Thanks this works. How do I center the panel on the desktop?

Thanks and regards,
Alfred

How can I add a widget panel on Easyui Desktop. The content of the widget would be from remote data. Please see my expected output. I want something like this one:

Please check the link.

Please help.

Thanks and regards
Alfred

How do I remove the start button on the Desktop Extension?


Thanks and regards
Alfred