Print Page - add custom-button to pagination-bar?

Title: add custom-button to pagination-bar?
Post by: digo on July 22, 2013, 01:21:52 AM

Hi!

I would like to add some text and a button after the refresh-button in the pagination-bar.
Is this possible?

Thank!

Digo

Title: Re: add custom-button to pagination-bar?
Post by: stworthy on July 22, 2013, 07:04:54 PM

You are allowed to append the existing element to pagination bar. Before using this feature please download the updated pagination plugin from http://www.jeasyui.com/easyui/plugins/jquery.pagination.js and include it to your page.

Code:

<div class="easyui-pagination" data-options="total:114,buttons:'#bb'" style="border:1px solid #ddd;"></div>
<div id="#bb">
  <span>Your Label</span>
  <a href="#" class="easyui-linkbutton" ...>Your Button</a>
</div>

Title: Re: add custom-button to pagination-bar?
Post by: digo on July 24, 2013, 01:14:02 AM

Hi!

Thanks for your reply!

I added http://www.jeasyui.com/easyui/plugins/jquery.pagination.js and the easyui-pagination-div, but there is no change within the pagination-bar. By using Firebug I can see, that there is an invisible additional pagination-bar blow the grid.

Any suggestions?

Thanks!
Digo

Code:

<div class="easyui-layout" fit="true">
			<div region="north" split="true" border="false" style="height:340px">
				     				<table id="dg"
						url="ajax_GetList.php?TicketTyp=<?php echo($TicketTyp); ?>" border="false"
						fit="true" fitColumns="true" singleSelect="true"

						loadmsg="Daten werden geladen..."
						pagination="true" pageSize="10" pageList="[5,10,20,30,40,50,100]"
						toolbar="#tb_dg" >
					<thead>
						<tr>
						   <th data-options="field:'itemid', sortable:false" width="25">ID</th>
						   <th data-options="field:'ProduktBez', hidden:false" width="150">Produkt</th>
							<th data-options="field:'Subject', sortable:true" width="300">Thema</th>
							<th field="InfoIcons" width="60">Info</th>
							<th field="ErstellDatumOut" width="60">Datum</th>
							<th field="User" width="65">Erfasser</th>
				         <th field="statusBez" width="100" align="center" formatter="formatStatusUser">Status</th>
						</tr>
					</thead>
				</table>

<div class="easyui-pagination" data-options="total:114,buttons:'#digobb'" style="border:1px solid #ddd;">xxxxxxxxx</div>
<div id="digobb">
  <span>Your Label</span>
</div>

		<div id="tb_dg" style="padding:5px;height:auto">
		   <div style="margin-bottom:5px">

Title: Re: add custom-button to pagination-bar?
Post by: stworthy on July 24, 2013, 06:55:46 AM

The code below works well. Please refer to this example http://jsfiddle.net/GTUCZ/

Code:

<div class="easyui-pagination" data-options="buttons:'#bb'" style="width:800px;border:1px solid #ccc"></div>
<div id="bb">
    <span>Your Label</span>
</div>

Title: Re: add custom-button to pagination-bar?
Post by: digo on July 24, 2013, 07:29:13 AM

Thanks.

Yes, the code works well, but I expected another output ;-)

I don´t want to add a new pagination-bar - I would like to add some text/some buttons to an existing pagination-bar of a datagrid.

In this example: http://jsfiddle.net/H7QDt/ (http://jsfiddle.net/H7QDt/) I get 2 pagination-bars - but I would like to see "Your Label" in the first (grey background) pagination-bar.

Any suggestions?

Thanks!
Digo

Title: Re: add custom-button to pagination-bar?
Post by: stworthy on July 24, 2013, 08:15:37 AM

Please refer to this updated example http://jsfiddle.net/H7QDt/1/.

Title: Re: add custom-button to pagination-bar?
Post by: digo on July 25, 2013, 05:46:08 AM

Thanks for your support!

It works fine!

Ciao
Digo

EasyUI Forum

General Category => EasyUI for jQuery => Topic started by: digo on July 22, 2013, 01:21:52 AM