Page 1 of 1

Form lable on top and below text

Posted: Mon Jul 23, 2018 4:48 pm
by sandeepgumudelli
Hi,

I was thinking about label and textfield, can we get label on top and below to it text ??

for referrence i have included screenshot.

Regards,
Sandeep

Re: Form lable on top and below text

Posted: Mon Jul 23, 2018 6:41 pm
by toms
Hi,

I created a function custFieldLabelsOnTop() to position a label on top of a field.

Usage:

Example 1: Place the labels of all fields above the input fields:

Code: Select all

	
if (nuFormType() == 'edit') {
    var f = nuSubformObject("").fields; // include all fields on your form
    custFieldLabelsOnTop(f, []);
}
Example 2: Place the labels of all fields above the input fields, but exclude some

Code: Select all

	
if (nuFormType() == 'edit') {
    var f = nuSubformObject("").fields; // include all fields of your form
    var e = ["customer_firstname", "customer_lastname"]; // but exclude these fields
    custFieldLabelsOnTop(f, e);
}
Example 3: Place the labels of some fields above the input fields

Code: Select all

	
if (nuFormType() == 'edit') {
    var f = ["customer_firstname", "customer_lastname"]; // include just these two fields
    custFieldLabelsOnTop(f, []);
}

Code: Select all

function custFieldLabelsOnTop(f, e) {

    for (var i = 0; i < f.length; i++) {
        if (jQuery.inArray(f[i], e) == -1) {

            var t = $('#' + f[i]).cssNumber("top");
            var l = $('#' + f[i]).cssNumber("left");
            $('#' + 'label_' + f[i]).css({
                'top': t - 18,
                'left': l - 15
            })
        }
    }
}

jQuery.fn.cssNumber = function(prop){
    var v = parseInt(this.css(prop),10);
    return isNaN(v) ? 0 : v;
};


Re: Form lable on top and below text

Posted: Tue Jul 24, 2018 5:08 pm
by sandeepgumudelli
Thank you very much tom. It is working exactly the way it shoud be. thank you very much for your support.

Re: Form lable on top and below text

Posted: Tue Jul 24, 2018 10:11 pm
by admin
.