Expand my Community achievements bar.

Changing width of a numeric field

Avatar

Level 4

Hi,

I have a table with numeric fields in the table cells.

I want it to look like this:

Item1 (numeric field box) %

Item2 (numeric field box) %

Item3 (numeric field box) %

Item4 (numeric field box) %

I can't seem to limit the lenght of the field from the right small enough to fit 2 characters, it snaps to the width of the table cell.  Then I want to put the % symbol after the field.

You can move the field smaller from the left though.

I tried to split the table cell, but when I select in the table cell, it just selects the numeric field and the options for splitting the table cell are grayed out under the table menu?

Thanks!

18 Replies

Avatar

Level 4

Umm... I am not totally sure if I got you right.

But can't you achieve (whatever you want, I am not sure about this) better with a Decimalfield and patterns?

(With a decimalfield you can choose how many pre and aftercomma digits you allow and with patterns you can set it to let a % appear at the end of the value.)

Avatar

Level 4

I posted an example of what i'm working with.

The first field is a decimal field, the second is a numeric field, i'm trying it both ways to see which is easier.

For the decimal field, I tried a pattern of num.percent{} but if the user enters 5 the field turns to 500%.

If they enter 5 I want it to say 5%

I just want the field to only be 2 characters wide and I want the percentage symbol after the field in the table cell if I

do the numeric field.

Any ideas...?

Avatar

Level 4

Take this pattern: num{zz.zz%}

Write additionally into the exit event (javascript): this.rawValue = this.rawValue / 100;
(take the lower script it is actually better when the user enters twice)

ATTENTION: This one doesn't provide aftercommadigits. If you want it to provide then correct your pattern in the way you'd like it to have. If the user writes aftercommadigits though, they will be rounded.

Also: If you use it and in the field is written 44% then the actual value is 0,44!

Edit: if you think a user might write 0,44 instead of 44 you can also use the following script:

if (this.rawValue > 1) {this.rawValue = this.rawValue / 100;}

(Though I think they'll get after the field gets 0% what they should enter ^^)

Avatar

Level 4

Ok, but if I want to have a % symbol after the field, how do I reduce the size of the decimal or numeric field to allow for that? I can't resize it in the table cell...

Avatar

Level 4

I also want to reduce the field size to 2 characters, but I can only make it smaller from the left.

Avatar

Level 4

> I also want to reduce the field size to 2 characters, but I can only make it smaller from the left.

For this one check out your menue on the right side under layout. There is an option you can set the borders.

For the other one... you could set a field at the same menuepoint to a specific place... so you can avoid adding the field to the table but plugging it into it though. Otherwise... just make one more row and put the %age in there... ^^

PS.: If you want you can also add the following script in enter: if (this.rawValue != null) {this.rawValue = this.rawValue * 100;}

(to avoid the user sees the 0,33 real value)

PS.: The pattern will prohibit every number that is > 99,99 .

It will also round if there are aftercommadigits. So in the end, no matter what the user enters, there will be a two digit number without aftercommas in it.

Avatar

Level 4

Ok, I used the margins in the layout and got the field smaller from the right but 2 things left I need to do:

1.  I need to limit the field to 2 characters, now I can enter in 3 characters

2.  I need to put a % symbol after the field.

Is this possible?

See my attached example...

Avatar

Level 4

Somehow on your form it worked in another way than in mine.

Put this javascript on exit:

if (this.rawValue > 100 || this.rawValue < 1)
{this.rawValue = null;}
if (this.rawValue <= 100 && this.rawValue >= 1)
{this.rawValue = this.rawValue / 100;}

this one on enter:

if (this.rawValue != null && this.rawValue <= 1)
this.rawValue = this.rawValue * 100;

this pattern on the first heading (or whatever it is called):

num{z9%}

and this pattern on the second:

num{zz}

If the user enters anything that is no integer between 1 and 100 it will delte the value. (You won't need to prohibit anything with the lenghts of the field.)

Edit: If you want you can also add a error message which tells the user that the number he has to write into it has to be between 1-100.

Avatar

Level 4

I think I would rather just limit the field to 2 characters and have a % sign after the field.

Is that possible?

Avatar

Level 4

Easiest way you can do is make a table with one more row.

Then put the headers together.


After that you don't have any more problems making a %age in the table.

I am not sure what you want to write in the text of the decimalfield... if there is nothing in there you could set the text to the right (layout) and make it "%".

Avatar

Level 4

I really just need to be able to split the cell into 2. Is that possible? It's always grayed out when I try to do that. I can't make another column because these % boxes only apply to the bottom of the table.

The way the field needs to look is:

Description of field, field, %

Does that make sense?

Avatar

Level 4

It will be available if you have put the fields together before. (Somehow like returning to the old thing.)

I think you already have a table? Just add one row and put them everywhere together expcept in the last line.

Or another solution would be to seperate the last lign from the table...

PS.: This field is a field the user enters right? A calculated one would be easier to handle with...

Avatar

Level 4

Attached is my example table.  I need text on both sides of the numeric field.

So:

Title, Box, %

But it has to stay in that cell so it doesn't disrupt the rest of the table.

Yes, it's a field the user has to enter, unfortunately!

Can you show me in the example I provided?

Avatar

Level 10

I think your best bet is changing the field to a text field, limiting the length to 2, and using a display pattern like this: text{99'%'}

Avatar

Level 4

Can you insert numbers only and do calculations with text fields though?

I also want to have the % symbol outside of the text field to the right?

Avatar

Level 10

Yes.

You can set up more validation patterns for Edit and Validate, text{99} for both, and on the Value tab of the Object pallete you can put a message in the Validation Pattern Message box asking users to only enter numbers (and put a tooltip asking for numbers).

Other than that you could have a script that checks the value on exit and gives the user a message and returns them into the field.

Other than adding another column, I think you're out of luck. As Lisa mentioned, you can add another column and make it small for the percent sign and merge other rows that don't want the extra column.

Avatar

Level 10

Javascript sample for checking value of the field:

if (isNaN(this.rawValue)){
app.alert("Entry needs to be a number!");
this.rawValue="";
xfa.host.setFocus(this);
}

Put it in the exit event.