Easy Tutorial
Plugins Window Messager Jeasyui Tree Treegrid2 Jeasyui App Rssreader Plugins Form Combotree Jqueryeasyui Intro Jeasyui Layout Panel Plugins Window Dialog Jeasyui Win Win1 Plugins Form Numberspinner Jeasyui Form Form3 Plugins Base Draggable Jeasyui Datagrid Datagrid12 Jeasyui Win Dlg2 Plugins Base Pagination Plugins Layout Accordion Jeasyui Datagrid Datagrid23 Jeasyui Dd Shopping Plugins Form Numberbox Jeasyui Datagrid Datagrid3 Ext Etree Jeasyui Tree Tree4 Plugins Form Spinner Jeasyui Datagrid Datagrid27 Plugins Base Parser Jeasyui Datagrid Datagrid16 Jeasyui Datagrid Datagrid7 Jeasyui Layout Tabs2 Plugins Layout Layout Jeasyui App Crud3 Jeasyui Layout Layout Jeasyui Mb Splitbutton Plugins Dt Treegrid Jeasyui Datagrid Datagrid13 Plugins Form Timespinner Jeasyui Datagrid Datagrid22 Jeasyui Datagrid Datagrid2 Jeasyui Tree Tree5 Jeasyui Datagrid Datagrid17 Jeasyui Ref Plugins Plugins Form Validatebox Jeasyui App Crud2 Jeasyui Layout Tabs3 Jeasyui Datagrid Datagrid6 Jeasyui Ref Extension Jeasyui Tree Tree1 Ext Rtl Plugins Base Easyloader Jeasyui Tree Treegrid3 Plugins Layout Panel Jeasyui Layout Accordion Plugins Mb Splitbutton Ext Datagridview Ext Treegrid Dnd Jeasyui Form Form2 Plugins Form Calendar Jeasyui Win Dlg1 Jeasyui Datagrid Datagrid11 Plugins Base Tooltip Jeasyui Datagrid Datagrid20 Ext Dwrloader Jeasyui Datagrid Datagrid24 Jeasyui Datagrid Datagrid15 Jeasyui Mb Menu Jeasyui Tree Tree3 Jeasyui Datagrid Datagrid4 Jeasyui Layout Tabs1 Jeasyui Dd Basic Plugins Form Combobox Jeasyui Form Form4 Jeasyui Tree Treegrid1 Jeasyui Datagrid Datagrid8 Jeasyui Datagrid Datagrid19 Plugins Base Droppable Ext Datagrid Filter Jeasyui Win Win2 Jeasyui Tree Treegrid5 Plugins Form Form Plugins Base Resizable Jeasyui Form Form5 Plugins Form Combogrid Jeasyui Datagrid Datagrid9 Plugins Dt Propertygrid Jeasyui Layout Xp Jeasyui Datagrid Datagrid18 Jeasyui Win Win3 Jeasyui Tree Treegrid4 Plugins Mb Linkbutton Plugins Form Datebox Jeasyui Dd Timetable Ext Ribbon Jeasyui Mb Linkbutton Jeasyui Form Form1 Plugins Layout Tabs Plugins Mb Menu Jeasyui Datagrid Datagrid10 Plugins Base Progressbar Plugins Form Datetimebox Jeasyui Datagrid Datagrid21 Ext Edatagrid Plugins Dt Tree Plugins Dt Datagrid Jeasyui Tree Tree6 Jeasyui Datagrid Datagrid1 Jqueryeasyui Tutorial Plugins Base Searchbox Plugins Window Window Plugins Form Slider Plugins Form Combo Jeasyui Datagrid Datagrid14 Jeasyui Tree Tree2 Plugins Mb Menubutton Jeasyui App Crud1 Ext Datagrid Dnd Jeasyui Datagrid Datagrid5 Jeasyui Mb Menubutton Ext Themes Ext Portal
❮ Ext Ribbon Jeasyui Form Form1 ❯

jQuery EasyUI Menus and Buttons - Creating Link Buttons

Typically, buttons are created using the <button> element, while link buttons are created using the <a> element. So, essentially, a link button is an <a> element styled to look like a button.

To create a link button, all you need to do is add a class attribute named 'easyui-linkbutton' to the <a> element:

<div style="padding:5px;background:#fafafa;width:500px;border:1px solid #ccc">
        <a href="#" class="easyui-linkbutton" iconCls="icon-cancel">Cancel</a>
        <a href="#" class="easyui-linkbutton" iconCls="icon-reload">Refresh</a>
        <a href="#" class="easyui-linkbutton" iconCls="icon-search">Query</a>
        <a href="#" class="easyui-linkbutton">text button</a>
        <a href="#" class="easyui-linkbutton" iconCls="icon-print">Print</a>
    </div>

    <div style="padding:5px;background:#fafafa;width:500px;border:1px solid #ccc">
        <a href="#" class="easyui-linkbutton" plain="true" iconCls="icon-cancel">Cancel</a>
        <a href="#" class="easyui-linkbutton" plain="true" iconCls="icon-reload">Refresh</a>
        <a href="#" class="easyui-linkbutton" plain="true" iconCls="icon-search">Query</a>
        <a href="#" class="easyui-linkbutton" plain="true">text button</a>
        <a href="#" class="easyui-linkbutton" plain="true" iconCls="icon-print">Print</a>
        <a href="#" class="easyui-linkbutton" plain="true" iconCls="icon-help"></a>
        <a href="#" class="easyui-linkbutton" plain="true" iconCls="icon-save"></a>
        <a href="#" class="easyui-linkbutton" plain="true" iconCls="icon-back"></a>
    </div>

As you can see, the iconCls attribute is a CSS class style for an icon, which displays an icon image on the button.

Sometimes you need to disable or enable a link button. The following code demonstrates how to disable a link button:

$(selector).linkbutton('disable');    // call the 'disable' method
❮ Ext Ribbon Jeasyui Form Form1 ❯