Unit of measurement in the input field

  • Resolved spacemakerman

    (@spacemakerman)


    10 months, 1 week ago

    Hello!
    I need your help on how to add a unit of measurement to the input field after the entered value using style?
    I tried the following method but it doesn’t work:

    #fbuilder input[type=text]::after {
content: "m2";
}

    Also a question about style, how to disable the pop-up label of a slider that duplicates the value?

    https://ibb.co/tZP5kCr

Viewing 2 replies - 1 through 2 (of 2 total)
  • Plugin Author codepeople

    (@codepeople)

    Hello @spacemakerman

    You cannot use “::before” or “::after” with input tags.

    To hide the tooltip, please enter the style definition below through the “Customize Form Design” attribute in the “Form Settings” tab:

    #fbuilder .cff-slider-tooltip{display: none !important;}

    Assuming the slider field is the fieldname123, to add the suffix to the field value, please insert an “HTML Content” field in the form and enter the following piece of code as its content:

    var slider_field_name = 'fieldname123';
fbuilderjQuery(document).on('change', '[id*="'+slider_field_name+'_"]', function(){
    let f = getField(slider_field_name),
        e = f.jQueryRef().find('[type="text"]'),
        v = f.val();
    
    e.val(v+'m2');
});

    You should replace the fieldname123 field with the correct one in the previous piece of code.

    Best regards.

    Thread Starter spacemakerman

    (@spacemakerman)

    Thanks friend, it worked! ????

    <script type="text/javascript">
var slider_field_name = 'fieldname1';
fbuilderjQuery(document).on('change', '[id*="'+slider_field_name+'_"]', function(){
    let f = getField(slider_field_name),
        e = f.jQueryRef().find('[type="text"]'),
        v = f.val();
    
    e.val(v+'m2');
});
</script>
Viewing 2 replies - 1 through 2 (of 2 total)
  • The topic ‘Unit of measurement in the input field’ is closed to new replies.