Add button on table view page

Discussions related to customizing hooks. Hooks are documented at http://bigprof.com/appgini/help/advanced-topics/hooks/
Post Reply
Moh Youba
Veteran Member
Posts: 228
Joined: 2017-03-12 09:31

Add button on table view page

Post by Moh Youba » 2019-08-28 23:04

Hello

Is it possible to add new button in table view to print custom page? if yes, please how?
button.jpg
button.jpg (62.57 KiB) Viewed 8897 times
Thank you

peebee
AppGini Super Hero
AppGini Super Hero
Posts: 352
Joined: 2013-03-21 04:37

Re: Add button on table view page

Post by peebee » 2019-08-28 23:48

Create (or use existing if you already have one) a new yourtablename-tv.js in your hooks folder (where of course yourtablename is the actual name of your table)

Example to add a new Filter button next to existing buttons. Edit the function/style to suit your purpose:

Code: Select all

jQuery(function(){
   jQuery('#Filter').after('<button class="btn btn-default" type="button" id="filter-button"><i class="glyphicon glyphicon glyphicon-filter"></i> Button Label</button>');
        jQuery('button[id=filter-button]').click(function(){
              window.location = 'yourtablename_view.php?SortField=&SortDirection=&FilterAnd%5B1%5D=etc........';
        });
});
Hopefully that is a good starting point, depending on what you want your button to do?

Ref: viewtopic.php?t=1034

pbottcher
AppGini Super Hero
AppGini Super Hero
Posts: 1635
Joined: 2018-04-01 10:12

Re: Add button on table view page

Post by pbottcher » 2019-08-29 06:46

Hi,

just to add, you may want to append to the last button of the section (and this may be different depending on your settings).
You can use

Code: Select all

jQuery('#top_buttons .btn-group:first .btn:last') 
to catch the last button in the row.
Any help offered comes with the best of intentions. Use it at your own risk. In any case, please make a backup of your existing environment before applying any changes.

Moh Youba
Veteran Member
Posts: 228
Joined: 2017-03-12 09:31

Re: Add button on table view page

Post by Moh Youba » 2019-08-29 10:38

thank you for support, I added code to show button but, unfortunately nothing no button show !

button-2.jpg
button-2.jpg (38.13 KiB) Viewed 8877 times

peebee
AppGini Super Hero
AppGini Super Hero
Posts: 352
Joined: 2013-03-21 04:37

Re: Add button on table view page

Post by peebee » 2019-08-29 11:20

File name should be dossier_individuel-tv.js (for table view) - not dossier_individuel-dv.js

Moh Youba
Veteran Member
Posts: 228
Joined: 2017-03-12 09:31

Re: Add button on table view page

Post by Moh Youba » 2019-08-29 11:26

my bad !
thank you, really appreciate the support. I usually use dv and did not see the that there is new file called tv.
Thank you for your support, button now show correctly.
Regards

Moh Youba
Veteran Member
Posts: 228
Joined: 2017-03-12 09:31

Re: Add button on table view page

Post by Moh Youba » 2019-08-29 11:31

hummm !!!
I want now to link to a printable page, I use this code

"window.location = 'decomptes_invoice.php?iddecompte=' + selectedID;"
but seems not the one, any help please
print-page.jpg
print-page.jpg (33.38 KiB) Viewed 8871 times

User avatar
jsetzer
AppGini Super Hero
AppGini Super Hero
Posts: 1807
Joined: 2018-07-06 06:03
Location: Kiel, Germany
Contact:

Re: Add button on table view page

Post by jsetzer » 2019-08-29 12:16

According to the url-documentation here...
https://bigprof.com/appgini/help/advanc ... parameters
...there is the Print_x parameter

Code: Select all

TABLENAME_view.php?SelectedID=...&Print_x=1
Just in case you only need to open the print-preview:
Instead of adding a <button> with a click-handler you could add a simple <a href="...">...</a>
Kind regards,
<js />

My AppGini Blog:
https://appgini.bizzworxx.de/blog

You can help us helping you:
Please always put code fragments inside [code]...[/code] blocks for better readability

AppGini 24.10 Revision 1579 + all AppGini Helper tools

Moh Youba
Veteran Member
Posts: 228
Joined: 2017-03-12 09:31

Re: Add button on table view page

Post by Moh Youba » 2019-08-29 13:44

tryied different option but cannot find the right way to add the code, please help. the file I want to print "decomptes.invoice.php" is not in the hooks file.

jQuery(function(){
jQuery('#Filter').after('<button class="btn btn-default" type="button" id="foebar"><i class="glyphicon glyphicon-ok"></i> PRINT</button>');
jQuery('button[id=foebar]').click(function(){
"window.location = 'decomptes_invoice.php?SelectedID=&Print_x=1';"
});
});

mdspine
Veteran Member
Posts: 34
Joined: 2020-06-06 12:38

Print Table view as a report not Detail view

Post by mdspine » 2020-06-19 02:23

Hi
Thanks for all those who have helped me so far!!!

I took the print invoice lesson from Udemy it was great lesson,
I was able to print the detail view no problem!!!
This was the link to create the Print Invoice
https://gist.github.com/AppGiniCourse/7 ... 8822f02133


Now I want to print the Table not Detail view. I was able to add some buttons to the table view see below
Can any one advise the script for one of the buttons to as to get a print preview of the table on the New Button
(rather than the default Print Preview button- The first grey button)
(The reason, I want to customize what field I want to show and hide what I don't want)
Thanks
Samm
Attachments
Capture.PNG
Capture.PNG (19 KiB) Viewed 7770 times

mdspine
Veteran Member
Posts: 34
Joined: 2020-06-06 12:38

Re: Add button on table view page

Post by mdspine » 2020-06-19 04:00

This is my code for the button sofar in the Billing-dv.js.
I also made a copy of the Billing_view.php and named it NewBiling_view.php
I want to use that to get a new print preview of the table.

jQuery(function(){
jQuery('#Filter').after('<button class="btn btn-success btn-lg"" type="button" id="filter-button"><i class="glyphicon glyphicon glyphicon-print"></i> New Button 1</button>');
jQuery('button[id=filter-button]').click(function(){
window.location = 'NewBilling_view.php?';
});
});

pbottcher
AppGini Super Hero
AppGini Super Hero
Posts: 1635
Joined: 2018-04-01 10:12

Re: Add button on table view page

Post by pbottcher » 2020-06-20 07:20

Hi,

you need to add the parameters to your target so that you call the print page directly.
Any help offered comes with the best of intentions. Use it at your own risk. In any case, please make a backup of your existing environment before applying any changes.

mdspine
Veteran Member
Posts: 34
Joined: 2020-06-06 12:38

Custom Table Print

Post by mdspine » 2020-06-20 11:56

Thanks for your response
Thanks for taking your time

If I were to filter it by all the clients seen today is this the right syntax?
window.location = 'NewBilling_view.php?GETDATE()';
Thanks
Sam

pbottcher
AppGini Super Hero
AppGini Super Hero
Posts: 1635
Joined: 2018-04-01 10:12

Re: Add button on table view page

Post by pbottcher » 2020-06-20 17:34

Hi,

maybe you can explain what exactly you try to achieve. It is not clear for me right now.
Any help offered comes with the best of intentions. Use it at your own risk. In any case, please make a backup of your existing environment before applying any changes.

mdspine
Veteran Member
Posts: 34
Joined: 2020-06-06 12:38

Re: Add button on table view page

Post by mdspine » 2020-06-20 18:21

Hi
I have a table named
Billing.
See below
Capture.PNG
Capture.PNG (19 KiB) Viewed 7653 times
I was able to add a bunch of buttons
My Goal:
When I press New Button 4 I want to filter all the clients seen today in a print preview mode
The field is the second one "Date of Service" (DOS)

I know my formula is wrong but help me

jQuery(function(){
jQuery('#Filter').after('<button class="btn btn-info btn-lg"" type="button" id="filter-button4"><i class="glyphicon glyphicon glyphicon-print"></i>4</button>');
jQuery('button[id=filter-button4]').click(function(){
window.location = 'Billing_view.php? SortField2,DATE(NOW())Print_x=1;
});
});


Thanks

pbottcher
AppGini Super Hero
AppGini Super Hero
Posts: 1635
Joined: 2018-04-01 10:12

Re: Add button on table view page

Post by pbottcher » 2020-06-20 19:14

Hi,

thanks, that helps.

Try

Code: Select all

var date=new Date().toLocaleDateString('en-GB');
window.location = 'Billing_view.php?Print_x=1&current_view=TV&FilterAnd[1]=and&FilterField[1]=2&FilterOperator[1]=equal-to&FilterValue[1]='+date
Maybe you need to adjust the FilterField[1]=2 to match your field
Any help offered comes with the best of intentions. Use it at your own risk. In any case, please make a backup of your existing environment before applying any changes.

mdspine
Veteran Member
Posts: 34
Joined: 2020-06-06 12:38

Re: Add button on table view page

Post by mdspine » 2020-06-20 19:45

Thanks for the code
Appreciate it
Appreciate your time!!!
It needs to be tweaked a bit at the end

in date format

Right now this is what the URL is
https://MyDomain.com/Project/Billing_vi ... 20/06/2020

But if I manually change the URL to the formatted date it works!!!
https://MyDomain.com/Project/Billing_vi ... 06/20/2020

Kindly give the syntax for the correct date format in month/date/year like this 06/02/2020 not 20/06/2020
Thanks

pbottcher
AppGini Super Hero
AppGini Super Hero
Posts: 1635
Joined: 2018-04-01 10:12

Re: Add button on table view page

Post by pbottcher » 2020-06-20 20:02

change

var date=new Date().toLocaleDateString('en-GB');

to

var date=new Date().toLocaleDateString('de-DE');
Any help offered comes with the best of intentions. Use it at your own risk. In any case, please make a backup of your existing environment before applying any changes.

mdspine
Veteran Member
Posts: 34
Joined: 2020-06-06 12:38

Re: Add button on table view page

Post by mdspine » 2020-06-20 20:14

Thank you very much!!!!!!
Thanks again for the time
BTW it had to be ('en-US')

So here is the final code to filter clients seen today

var date=new Date().toLocaleDateString('en-US');
window.location = 'Billing_view.php?Print_x=1&current_view=TV&FilterAnd[1]=and&FilterField[1]=2&FilterOperator[1]=equal-to&FilterValue[1]='+date

dge
Posts: 25
Joined: 2013-12-05 02:54

Re: Add button on table view page

Post by dge » 2020-06-23 17:14

I'm trying to add buttons to the table view, using the button code Peebee posted,

Code: Select all

jQuery(function(){
   jQuery('#Filter').after('<button class="btn btn-default" type="button" id="filter-button"><i class="glyphicon glyphicon glyphicon-filter"></i> Button Label</button>');
        jQuery('button[id=filter-button]').click(function(){
              window.location = 'yourtablename_view.php?SortField=&SortDirection=&FilterAnd%5B1%5D=etc........';
        });
});
My button appears, but only when the screen is full width..

My button disappears when the screen is narrower, such as mobile view.

It seems the mobile-view (vertically-aligned) buttons are different buttons entirely from the regular buttons.
However, the button IDs for the full width buttons and the mobile (stacked) buttons are the same, meaning the selector only picks up the full width buttons, but the div classes are different.

I've found a workaround using the code

Code: Select all

jQuery(function(){
   jQuery('.clearfix').after(
 
using '.clearfix' as the selector, which creates a small button on the row below the buttons that shows on both the mobile view and the regular view.
Is there a way to make the buttons show on the mobile view without using this workaround?

User avatar
bruceholt
Veteran Member
Posts: 100
Joined: 2016-07-30 20:16
Location: Australia

Re: Add button on table view page

Post by bruceholt » 2020-06-27 20:04

jQuery(function(){
jQuery('.clearfix').after(
I was trying to add a new button also but when the above is added, at least in my case, it adds 3 of the new buttons on the detail view page.

I there any way of having the buttons show only on the table view page?

pbottcher
AppGini Super Hero
AppGini Super Hero
Posts: 1635
Joined: 2018-04-01 10:12

Re: Add button on table view page

Post by pbottcher » 2020-06-28 08:17

Hi,

try

jQuery(function(){
jQuery('.clearfix:first').after(
Any help offered comes with the best of intentions. Use it at your own risk. In any case, please make a backup of your existing environment before applying any changes.

User avatar
bruceholt
Veteran Member
Posts: 100
Joined: 2016-07-30 20:16
Location: Australia

Re: Add button on table view page

Post by bruceholt » 2020-06-29 09:27

Hi pböttcher ,

You are a champion! That worked great. Thank you very much.

User avatar
jmcgov
Veteran Member
Posts: 79
Joined: 2018-12-19 01:31
Location: Northern Ireland

Re: Add button on table view page

Post by jmcgov » 2022-02-07 11:10

I added in the On Order Button next to the Filter button, with this code in the hooks tablename_header function, under case tableview - hope that helps

SEE IMAGE
https://drive.google.com/file/d/1D7zY5- ... sp=sharing

Code: Select all

							header="<%%HEADER%%>
							<script>
								\$j(function(){ 
									var BUTTON_Filter = document.getElementById('Filter').outerHTML;
									
									BUTTON_Filter_Plus = BUTTON_Filter+'<a class=\"btn btn-warning\" id=\"filter_on_order\" href=\"https://app.fuelround.co.uk/p02_ord3r_view.php?SortField=31+asc%2C20&SortDirection=asc&FilterAnd%5B1%5D=and&FilterField%5B1%5D=47&FilterOperator%5B1%5D=equal-to&FilterValue%5B1%5D=current+%28ordering%29&FilterAnd%5B2%5D=and&FilterField%5B2%5D=20&FilterOperator%5B2%5D=is-not-empty&FilterValue%5B2%5D=\">On Order</a>';
									
									document.getElementById('Filter').outerHTML = BUTTON_Filter_Plus;
								})
							</script>";
							

Post Reply