• Global community
    • Language:
      • Deutsch
      • English
      • Español
      • Français
      • Português
  • 日本語コミュニティ
    Dedicated community for Japanese speakers
  • 한국 커뮤니티
    Dedicated community for Korean speakers
Exit
0

Float Label in pdf

New Here ,
Dec 06, 2018 Dec 06, 2018

Copy link to clipboard

Copied

I am trying to make a float label in an iterative pdf form. I currently have this and its not working. Any ideas?

if (!event.value) {

event.value = "For Translated French";

event.target.display = display.noPrint;

} else {

event.target.display = display.visible;

}

// On Focus script:

if (event.target.value==event.target.defaultValue) {

   event.target.value = "";

   event.target.textColor = color.black;

}

// On Blur script:

if (event.target.value=="") {

   event.target.value = event.target.defaultValue;

   event.target.textColor = color.ltGray;

}

TOPICS
Acrobat SDK and JavaScript

Views

462

Translate

Translate

Report

Report
Community guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines
Community Expert ,
Dec 06, 2018 Dec 06, 2018

Copy link to clipboard

Copied

Please explain what you mean by "float label". And how this code is being used.

Thom Parker - Software Developer at PDFScripting
Use the Acrobat JavaScript Reference early and often

Votes

Translate

Translate

Report

Report
Community guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines
New Here ,
Dec 06, 2018 Dec 06, 2018

Copy link to clipboard

Copied

A float label is a label that is in the form field that goes away once the field is fill out. ex: Float Labels with CSS | CSS-Tricks

The code is being used in acrobat for to create the float label.

Votes

Translate

Translate

Report

Report
Community guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines
LEGEND ,
Dec 06, 2018 Dec 06, 2018

Copy link to clipboard

Copied

People don't use float labels with PDF forms. That's not to say that you can't make something like this work, but it means you can't assume we know what you are trying and what you expect.

One key problem may be that from your incomplete example I think you may be trying to overlap visible form fields (the label and the main field). Never do that, it just won't work reliably because it is unpredictable which of the two fields gets an event.

If that ISN'T what you are doing please explain what you want to happen, how you plan to make it happen, and what actually happens. If you ARE overlapping visible fields, DON'T.

Votes

Translate

Translate

Report

Report
Community guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines
New Here ,
Dec 06, 2018 Dec 06, 2018

Copy link to clipboard

Copied

I just want to do a float label, I'm not sure how to do it, or how to properly code it. If you know a better way I would greatly appreciate it. 

Votes

Translate

Translate

Report

Report
Community guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines
Community Expert ,
Dec 06, 2018 Dec 06, 2018

Copy link to clipboard

Copied

CSS Tricks don't translate to PDF... not even a little. There are ways to approximate the effect you link to but you cannot duplicate it. Additionally, the authoring process is going to be quite onerous. Also, the script you have is useless for this task.

My suggestion is that you either rethink your user experience to conform with what Acrobat is natively capable of or hire an expert to approximate the experience of float labels.

Votes

Translate

Translate

Report

Report
Community guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines
Community Expert ,
Dec 06, 2018 Dec 06, 2018

Copy link to clipboard

Copied

Try this.

Add only this code to Custom Format script for the field. It places light gray text in the field when it is empty, but does not affect the value of the field.

if(event.value == "")

{

    event.target.textColor = ["G",.6];

    event.value = "Enter something here"

}

else

{

   // put additional formatting here

    event.target.textColor = color.black;

}

Thom Parker - Software Developer at PDFScripting
Use the Acrobat JavaScript Reference early and often

Votes

Translate

Translate

Report

Report
Community guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines
Community Expert ,
Dec 06, 2018 Dec 06, 2018

Copy link to clipboard

Copied

LATEST

Follow my instructions in that thread I linked to and it will work just fine. You need to set the field's default value to the text you want to show when the field is "empty", of course.

Votes

Translate

Translate

Report

Report
Community guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines
Community Expert ,
Dec 06, 2018 Dec 06, 2018

Copy link to clipboard

Copied

I recognize the second part of the code from my post on this thread (Is there a way to add instructional text to my text field that will disappear when clicked? (PDF For... ), but what's the first part for?

Votes

Translate

Translate

Report

Report
Community guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines
New Here ,
Dec 06, 2018 Dec 06, 2018

Copy link to clipboard

Copied

The first part is for what will fill the float label

Votes

Translate

Translate

Report

Report
Community guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines