Inline labels

Topics related to AppGini plugins/add-ons go here.
Post Reply
kanklovitch
Veteran Member
Posts: 159
Joined: 2019-02-03 17:26

Inline labels

Post by kanklovitch » 2021-05-17 13:41

Hi Guys
I mostly just use AppGini and Jan's plugins "out of the box" so I am not very good at customization. My issue is I would like to put my labels just to the left of both fields when I inline them. I have read through the threads and I couldn't figure out how to do it.

Ken
Attachments
Inline labels.jpg
Inline labels.jpg (65.39 KiB) Viewed 2663 times

pfrumkin
Veteran Member
Posts: 157
Joined: 2020-02-18 17:58
Location: Albuquerque, New Mexico USA

Re: Inline labels

Post by pfrumkin » 2021-05-17 21:16


kanklovitch
Veteran Member
Posts: 159
Joined: 2019-02-03 17:26

Re: Inline labels

Post by kanklovitch » 2021-05-17 21:45

Thanks for the link Sir
For some reason I couldn't find that information, I will check it out.

Ken

kanklovitch
Veteran Member
Posts: 159
Joined: 2019-02-03 17:26

Re: Inline labels

Post by kanklovitch » 2021-06-16 03:36

Hi Guys
I still haven't been able to figure this out. I want to put 2 or 3 fields in the same line with the labels for each field next to the field. So far I can only put the labels at the start of each line.

Ken

User avatar
lramirez
Veteran Member
Posts: 68
Joined: 2019-11-01 23:23

Re: Inline labels

Post by lramirez » 2024-05-01 20:56

Hello
There are many options here that you may find useful... :D

https://www.appgini.de/docs/Javascript- ... start.html

enjoy
Luis Ramirez R.

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

Re: Inline labels

Post by jsetzer » 2024-05-02 04:07

kanklovitch wrote:
2021-06-16 03:36
I want to put 2 or 3 fields in the same line with the labels for each field next to the field. So far I can only put the labels at the start of each line.
That's right, the .inline("...") function moves multiple fields' controls into one form-group-line which has one label.

Code: Select all

    LABEL: [CTRL1] [CTRL2] [CTRL3]
Example

Code: Select all

// file: hooks/TABLENAME-dv.js
var dv = AppGiniHelper.dv;
dv.getFields(["name", "type_id", "position"]).inline("Name, Typ, Position", [6,4,2]);
chrome_HXjpASE58U.png
chrome_HXjpASE58U.png (3.98 KiB) Viewed 833 times

Gonna post another option in a minute.
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.14 Revision 1665 + all AppGini Helper tools

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

Re: Inline labels

Post by jsetzer » 2024-05-02 04:11

kanklovitch wrote:
2021-06-16 03:36
I want to put 2 or 3 fields in the same line with the labels for each field next to the field.
As mentioned above, perhaps multi-column-rows are an option for you:

Code: Select all

// file: hooks/TABLENAME-dv.js
var dv = AppGiniHelper.dv;
dv.createLayout([6, 4, 2])
    .add(1, ["name"])
    .add(2, ["type_id"])
    .add(3, ["position"]);
chrome_CG0JZATsku.png
chrome_CG0JZATsku.png (3.96 KiB) Viewed 833 times

Due to limited page-width this may break, depending on available space.
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.14 Revision 1665 + all AppGini Helper tools

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

Re: Inline labels

Post by jsetzer » 2024-05-02 04:37

kanklovitch wrote:
2021-06-16 03:36
I want to put 2 or 3 fields in the same line with the labels for each field next to the field.
Perhaps wrapping the labels may help on the width-problem, if any:

Code: Select all

var dv = AppGiniHelper.dv;
dv.createLayout([6, 4, 2])
    .add(1, ["name"])
    .add(2, ["type_id"])
    .add(3, ["position"]);
    
dv.getFields(["name", "type_id", "position"]).wrap();
Last line places the labels above the controls.

chrome_l895ujtWHq.png
chrome_l895ujtWHq.png (3.88 KiB) Viewed 832 times

---


Small drawback
Please note: When adding lookup-/dropdown-controls to layouts and then wrapping labels, depending on your version of AppGini and AppGini Helper Javascript Library, there may be a small gap (left-padding) left of the dropdown control, due to AppGini's quite new "flex" display of dropdowns.

This is what you may see in your environment:
chrome_mMc08KE9lp.png
chrome_mMc08KE9lp.png (2.02 KiB) Viewed 832 times
I have already fixed this in next version of AppGini Helper Javascript Library. For now, you can fix this by yourself using the following javascript code*:

Code: Select all

dv.getField("type_id").getRightContainer().removeClass("col-sm-12");
* replace field name "type_id" by your field name.
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.14 Revision 1665 + all AppGini Helper tools

Post Reply