Print Page - Panel Tools

General Category => EasyUI for jQuery => Topic started by: jahangir on December 25, 2020, 10:46:00 AM

Title: Panel Tools
Post by: jahangir on December 25, 2020, 10:46:00 AM

How to add panel tool on left side of panel header.

Title: Re: Panel Tools
Post by: jarry on December 27, 2020, 01:56:50 AM

Please try to set the 'header' property to custom the panel header.

Code:

<div class="easyui-panel" style="width:700px;height:200px;padding:10px;"
    data-options="header:'#hh'">
</div>
<div id="hh">
  <div class="panel-title f-row">
    <div class="panel-tool" style="position:relative">
      <a href="javascript:void(0)" class="icon-add" onclick="javascript:alert('add')"></a>
      <a href="javascript:void(0)" class="icon-edit" onclick="javascript:alert('edit')"></a>
      <a href="javascript:void(0)" class="icon-cut" onclick="javascript:alert('cut')"></a>
      <a href="javascript:void(0)" class="icon-help" onclick="javascript:alert('help')"></a>
    </div>
    <div>Panel Header</div>
  </div>
</div>

Title: Re: Panel Tools
Post by: thecyberzone on January 17, 2021, 09:26:18 AM

And what about css classes against panel-title f-row, are they readily available in jeasyui or have to define?

Title: Re: Panel Tools
Post by: jarry on January 18, 2021, 01:07:56 AM

The 'f-*' css classes are defined in 'flex.css' that has been integrated into the theme file 'easyui.css'.

EasyUI Forum

General Category => EasyUI for jQuery => Topic started by: jahangir on December 25, 2020, 10:46:00 AM