Category Archives: Tutorial

Tutorial of easyui

Download jQuery EasyUI 1.4.1

Download jQuery EasyUI 1.4.1

ChangeLog

Bug
  • The combogrid has different height than other combo components. fixed.
  • datagrid: The row element loses some class style value after calling ‘updateRow’ method. fixed.
  • menubutton: Calling ‘enable’ method on a disabled button can not work well. fixed.
  • form: The filebox components in the form do not work correctly after calling ‘clear’ method. fixed.
Improvement
  • tabs: The ‘update’ method accepts ‘type’ option that allows the user to update the header,body,or both.
  • panel: Add ‘openAnimation’,’openDuration’,’closeAnimation’ and ‘closeDuration’ properties to set the animation for opening or closing a panel.
  • panel: Add ‘footer’ property that allows the user to add a footer bar to the bottom of panel.
  • datagrid: Calling ‘endEdit’ method will accept the editing value correctly.
  • datagrid: Add ‘onBeforeSelect’,’onBeforeCheck’,’onBeforeUnselect’,’onBeforeUncheck’ events.
  • propertygrid: The user can edit a row by calling ‘beginEdit’ method.
  • datebox: Add ‘cloneFrom’ method to create the datebox component quickly.
  • datetimebox: Add ‘cloneFrom’ method to create the datetimebox component quickly.

Download EasyUI Package

There are two editions of EasyUI package:

GPL Edition

The GPL Edition is available under GPL License, you can use it in any GPL-licensed projects. Download jQuery EasyUI under GPL license:

Download

Commercial Edition

The Commercial Edition is also available under Commercial License, you can use it in a non-GPL/proprietary project.

Purchase

Other Versions

The other released versions of jQuery EasyUI are also available. Click here to view a listing and choose which version you would like to download.

EasyUI1.2.5 assignment problem in Numberbox

The original application has been developed with EasyUI1.2.4, recent tests found value Numberbox components are submitted to 0, so the view js code found on numberbox assignment code is as follows:

$('#number').val(23);

EasyUI1.2.4 using the code assigned to numberbox success, and can be submitted to the background save, EasyUI1.2.5 not use this assignment method setValue assignment, the modified code as follows:

$('#number').numberbox('setValue',23);

EasyUI Datagrid component getFooterRows method of using the tutorial

 
The total amount of the project need to obtain aggregated footer, so check EasyUI the datagrid documents found getFooterRows method is used to obtain the footer, then write the following code:
var footers=$('#grid').datagrid('getFooterRows');
var sum=footers.Sum_Money;

But prompted footers.Sum_Money undefined undefined, online search under relevant information, there is no suitable answer, view the source code and found getFooterRows returns an array of all footer, even though only one here in my footer, it will still return an array so try to alert the next footers.length findings suggest that length is 1, then modify the code as follows:

var footers=$('#grid').datagrid('getFooterRows');
var sum=footers[0].Sum_Money;

Extends two methods of EasyUI tree get parents nodes

$.extend($.fn.tree.methods,{
getCheckedExt: function(jq){
var checked = $(jq).tree(“getChecked”);
var checkbox2 = $(jq).find(“span.tree-checkbox2”).parent();
$.each(checkbox2,function(){
var node = $.extend({}, $.data(this, “tree-node”), {
target : this
});
checked.push(node);
});
return checked;
},
getSolidExt:function(jq){
var checked =[];
var checkbox2 = $(jq).find(“span.tree-checkbox2”).parent();
$.each(checkbox2,function(){
var node = $.extend({}, $.data(this, “tree-node”), {
target : this
});
checked.push(node);
});
return checked;
}
});

Welcome to jQuery EasyUI

Welcome to jQuery EasyUI

jQuery EasyUI framework help you build your web page easily.

  • easyui is a collection of user-interface plugin based on jQuery.
  • using easyui you don’t need to write many javascript code, you usually defines user-interface by writing some HTML markup.
  • easyui is very easy but powerful.