Welcome to the nuBuilder Forums!

Register and log in to access exclusive forums and content available only to registered users.

Add kg or g unit in field

Questions related to using nuBuilder Forte.
Post Reply
Olikun
Posts: 68
Joined: Tue Mar 09, 2021 6:45 pm

Add kg or g unit in field

Unread post by Olikun »

Hello,

how can I add kg or g in a field with numbers?

Under formats I can add several things, but not kg or g.
It is also in the front of the format, it should be in the back


Image
kev1n
nuBuilder Team
Posts: 4297
Joined: Sun Oct 14, 2018 6:43 pm
Has thanked: 71 times
Been thanked: 444 times
Contact:

Re: Add kg or g unit in field

Unread post by kev1n »

Which object type (Calc, Number etc.) is the field ?
Olikun
Posts: 68
Joined: Tue Mar 09, 2021 6:45 pm

Re: Add kg or g unit in field

Unread post by Olikun »

a couple of fields are "nuNumber" and a couple of "Calc" fields
kev1n
nuBuilder Team
Posts: 4297
Joined: Sun Oct 14, 2018 6:43 pm
Has thanked: 71 times
Been thanked: 444 times
Contact:

Re: Add kg or g unit in field

Unread post by kev1n »

For calc fields, there's now a possiblity to modify their values (like adding "kg" or change the formatting like color etc.) after a calculation. You will have to pull the updated nuform.js file from Github.

Then, in your form's Custom Code, add:

Code: Select all

if (nuFormType() == 'edit' && !nuIsNewRecord()) {
    nuCalculateForm(false);
}

function nuCalculated(t, v, fixed) {
    // Replace you_calc_object_id with the object Id of "Gewicht nach Trocknung"
    if (v.id = 'you_calc_object_id') t.value = v + ' kg';
}

kev1n
nuBuilder Team
Posts: 4297
Joined: Sun Oct 14, 2018 6:43 pm
Has thanked: 71 times
Been thanked: 444 times
Contact:

Re: Add kg or g unit in field

Unread post by kev1n »

To show a unit (like kg) next to an input, add this css in the Setup -> Header field between the <style> tags.
add_unit_to_input.png

Code: Select all

.input_with_appended_unit input {
  padding-right: 22px;
  text-align: right
}
.input_with_appended_unit span {
  position: absolute;
  font-family:"Helvetica Neue",Helvetica,Arial,sans-serif
}
Then add this function in your form's Custom Code (or in the header, if it's used in more than one form):

Code: Select all

function nuAddUnitToInput(id, unit, top = 3, left = 8) {
    let obj = $("#" + id);
    obj.wrapAll('<div class="input_with_appended_unit"></div>');
    let objUnitId = id + '_' + unit;
    obj.after('<span id =' + objUnitId + '>' + unit + '</span>');

    $('#' + objUnitId).css({
        "top": obj.cssNumber("top") + top,
        "left": obj.cssNumber("left") + obj.cssNumber("width") + left,
        "font-size": obj.cssNumber("font-size")
    });
}
To add kg to an Input, call this JS when the form is loaded:

Code: Select all

nuAddUnitToInput('Replace_with_your_Input_object_ID', 'kg')
You do not have the required permissions to view the files attached to this post.
Post Reply