Section No. 204, JQuery easyui,dialog (dialog box) components

JQuery easyui,dialog (dialog box) component

Learning Essentials:

1. Loading mode

2. List of properties

3. Event List

4. Method List

This lesson focuses on the use of the Dialog (window) component in Easyui, which relies on the window component, the LinkButton (button) component.

A Load mode

Class Load Mode

<class= "Easyui-dialog"  title= "My Dialog"     style = "width:400px;height:200px;"      data-options= "iconcls: ' Icon-save ', resizable:true,modal:true">     dialog Box </ Div >

The dialog () method, which executes the elements of the dialog box method

JS Load Call

$ (function  () {    $ (' #box '). Dialog ({        ' title ',        250         ,         true ,    });});

Two Property List

Window properties are extended from the window (panel), and the properties of the windows are added or redefined as follows:

Title String Dialog window caption text. The default value is new Dialog.

The collapsible Boolean defines whether the collapsible button is displayed. The default value is False.

The Minimizable Boolean defines whether the Minimize button is displayed. The default value is False.

The Maximizable Boolean defines whether the Maximize button is displayed. The default value is False.

Resizable Boolean defines whether the dialog window size can be changed. The default value is False.

Toolbar Array,selector the toolbar at the top of the Settings dialog window, the available values are: (1) An array, and the tool properties in each toolbar are the same as the LinkButton. (2) A selector specifies the toolbar. The default value is null.

Buttons Array,selector dialog window at the bottom of the button, the available values are: (1) An array, each button has the same properties as LinkButton. (2) A selector specifies the button bar. The default value is null.

Section No. 204, JQuery easyui,dialog (dialog box) components