Two columns layout on the same row

E

elmarra

Member
Hi everyone, I need your help.
I created a new list, and created a group of it with two items, one date and one tab number.
I have set the two column view in the group setting.
in the desktop view it is displayed side by side.
The problem is in the print and in the pdf.
It is not displayed in the same row but one above and one below.
I tried to fix with css and also in the template file but I couldn't.
I've been trying to fix this for days.
Can you help me please?
Thank you
Here the link with the site and active pdf debug
Link

vVjpssS

https://ibb.co/vVjpssS
 
I have read it well not as many times, and in other situations it has been very helpful to me. But this time I just can't understand

Code: 
#{$form} .fabrikElementContainer.span12 {position:relative;margin-bottom:10px}
#{$form} .fabrikElementContainer .span4 {display:inline-block;width:30%}
#{$form} .fabrikElementContainer .span8 {display:inline-block;left:31%;width:68%}

#{$form} what would it correspond to?

Unfortunately, English is not my mother tongue and therefore I cannot understand well!


I was able to set a flex display using row-fluid, but this changes the view to the whole page.
How can I set up a class for the group so that I can apply my css without it modifying the rest of the page?
 
Create a a custom PDF template
The standard templates can be used, but is recommended to create custom PDF templates.
To create a custom template, copy the templates folder and rename it. Template locations are as follows:
  • Joomla 3+: Details: components/com_fabrik/views/details/tmpl/ (PDF template is always a details template)
Click to expand...
http://www.fabrikar.com/forums/index.php?wiki/form-and-details-templates/

#{$form} is exactly like this (for use in your custom_css.php), it's replaced on runtime with your form id, view (= details) and row number
 
Ok maybe I got there.
Can you please confirm that I am on the correct path and doing well?
I created a new print and pdf template.
I edited the default_group.php file
and at the staff where "row-fluid" was I changed to "row-fluid1"
in the file "custom_css.php" I added a new rule
"
.row-fluid1{display:flex;}
}
"
and now it works the two columns are aligned to the row both in print and in pdf (I have set the same template at the moment)
Am I "working correctly"?
Obviously I will have to fix it better but I just wanted to understand if I am on the right path.
Heartfelt thanks again
 
You should not modify the the default (bootstrap) Fabrik template (your changes will be overridden with the next update) but create a copy, add your changes and select this template as PDF template.

It is up to you what you want to modify (e.g. adding CSS classes or inline style in default_group.php or/and modifying existing CSS classes in the CSS file), usually there are multiple ways to get what you want.
 
troester said:
You should not modify the the default (bootstrap) Fabrik template (your changes will be overridden with the next update) but create a copy, add your changes and select this template as PDF template.

It is up to you what you want to modify (e.g. adding CSS classes or inline style in default_group.php or/and modifying existing CSS classes in the CSS file), usually there are multiple ways to get what you want.
Click to expand...
Hello and thanks again. Maybe I explained myself wrong. In fact, I created a copy of the default bootstrap template and copied it to a new "My template" folder and selected that so that it was a template only for that type of module.
I am happy then to be on the right path.
Thanks to you for your invaluable help
 
Hi, I'm still here, because unfortunately everything works correctly in print, but in the pdf it seems not to follow the rule.
IN debug it displays correctly, but when i believe the pdf file true and it loses the settings.
Come to solve this problem?
 
I don't know what you mean with "print", did you activate the "Print" icon in form/details view?
"Print" is going to show the details view with the selected details template, nothing to do with PDF.

PDF debug mode is showing the HTML code generated from your PDF template on screen, so you can see the general layout
and you can check with your browser dev tools which CSS classes are used for Fabrik element containers etc, which CSS is generated, but you won't see exactly what the PDF libs are doing finally.

You can't see PDF specific stuff on the screen, e.g. the PDF libs don't support float and I assume (didn't test) they also don't support flex.
That's why in the example
#{$form} .fabrikElementContainer .span4 {display:inline-block;width:30%}
.span4 (which is something like {float:left;width:32%} in bootstrap2) is re-defined with "display:inline-block;...", because this IS supported by the PDF libs.
 
troester said:
I don't know what you mean with "print", did you activate the "Print" icon in form/details view?
"Print" is going to show the details view with the selected details template, nothing to do with PDF.
Click to expand...

Yes, I have activated the print button.
because as I said before I had the alignment problem both in print and in pdf.
I have created two different models. one to use for the details, one for the pdf.
Printing works


PDF debug mode is showing the HTML code generated from your PDF template on screen, so you can see the general layout
and you can check with your browser dev tools which CSS classes are used for Fabrik element containers etc, which CSS is generated, but you won't see exactly what the PDF libs are doing finally.

You can't see PDF specific stuff on the screen, e.g. the PDF libs don't support float and I assume (didn't test) they also don't support flex.
That's why in the example
#{$form} .fabrikElementContainer .span4 {display:inline-block;width:30%}
.span4 (which is something like {float:left;width:32%} in bootstrap2) is re-defined with "display:inline-block;...", because this IS supported by the PDF libs.
Click to expand...

I know that debug mode is for general layout only.
And that what happens on the pdf is not visible
But precisely with the code of the example above I continue to fail to align the two columns to the same row.
Could you check if it works for you?[/QUOTE]
 
If anyone has found themselves in the same situation as me please,
and has some code examples to make sure that the two columns are aligned on the same row would be of great help to me please.
I'm trying in every way and within the limits of my abilities but I can't align the two columns.
Thank you in advance
 
troester said:
It seems the examples are for an older domPDF version.
I just updated the WIKI https://fabrikar.com/forums/index.php?wiki/pdf-output/#css-example-details-view
Click to expand...
Great news! Just tested on my web space and it works perfectly.
Thanks again.
Last question in localhost I get this error, and pagination doesn't work.
What can this be due to?
The localhost is the identical copy of the online site. (online it works and on localhost not)
Code: 
Notice: Undefined property: FabrikViewForm::$table in
C:\xampp\htdocs\gestionale\components\com_fabrik\views\details\tmpl\foglio\default.php on line 16
Notice: Trying to get property 'label' of non-object in
C:\xampp\htdocs\gestionale\components\com_fabrik\views\details\tmpl\foglio\default.php on line 16
Pagina
Notice: Undefined property: FabrikViewForm::$table in
C:\xampp\htdocs\gestionale\components\com_fabrik\views\details\tmpl\foglio\default.php on line 20
Notice: Trying to get property 'label' of non-object in
C:\xampp\htdocs\gestionale\components\com_fabrik\views\details\tmpl\foglio\default.php on line 20

I am using xamp version php 7.4.25

Thanks again for your invaluable help
 
What is the code in your foglio\default.php line 16 and 20?

Notices are displayed depending on your Joomla error level settings, maybe you have different ones on your servers? Or different php versions?

Pagination is on list view, not sure where details view messages are coming from. Did you mix up details and list templates?

But if your list is ajaxfied such notices, warnings etc. will break the expected JSON response and list actions will not work.
 
I copied the template from a working site, and that error doesn't show up anymore.
The only problem I have left is that in localhost the pdf is not displayed with the custom layout.
as if it didn't take the styles
 
You must log in or register to reply here.

Useful links

  • Create a Fabrik Account (Downloads)
  • Create a Forum Account
  • Fabrik Wiki
  • Fabrik 4 Changelog /Install /Upgrade
    • We are in need of some funding.
    More details.

    Thank you.

    Members online

    Total: 52 (members: 1, guests: 51)
    Back
    Top