Not able to display fields in new line while designing form?

[former_member182426]

Hi,

I am trying to desing a form in webdynpro. like this...

Label1    InputField
Label2    InputField
Label3    InputField

     Button

But i am not able to desing like wat i said above. instead of this it's showing in single ine only. I tried changing properties but not worked.

Field1 InputField Field2 InputField Field3 InputField Button

It's showing in single line....

How to display i

[Former Member · Accepted solution]

Hi,

U can use RowLayout for that. Just have a transparent container of row layout type for that and insert all the elements in that.

Label1 Rowheaddata InputField RowData

Label2 Rowheaddata InputField RowData

Label3 Rowheaddata InputField RowData

Now for button have rowheaddata and now change the hAlign property to centre.

Now adjust the container width accordingly as per the total width required.

regards,

Pankaj Aggarwal

[former_member182426 · Accepted solution]

Hi Pankaj,

I tried as you suggested. It's worked. But the InputFiled is displaying immediate of Label like this...

Label1 InputField

But i want display littile bit gap like this...

Label1        InputField

Hi Saurav & Amit,

I tried your solution also, it reduced littile bit gap. It's not coming as i said above. It's showing like this.

Label1                                               InputField

Regards,

Shankar.

[Former Member · Accepted solution]

Hi

In pankaj's Solution

between label and input field , insert text view element , its layout as Row Data

and in the Text property of the element press ALT + 0160 , u can give the space as required

u can alternatively use the INVISIBLE UI element of Row Data

this way u can give sm space .I hope it wud surely help

rgds,

amit

[Former Member · Accepted solution]

hi,

Insert some invisible UI Elements for Rowlayout so as to increase the GAP

[former_member182426 · Accepted solution]

Hi Amit,

It's worked perfectly.

Hi Saurav,

I tried like u said but it's remain same gap.

But we cant directly give some space between UI Elements aa in designing layout like VB.
If we want give space some thing like this while designing layout it is little bit time taken task.
I dont know why this Webdynpro like this....

For every body Thanks A Lot.

Regards,

Shankar.

[Former Member]

hi Shankar ,

try referring to steps in my earlier post , transparent container , group , input fields , labels are all UI elements

insert ur input field and label in transparent container and try to follow these steps , u wud surely get it

rgds,

amit

[Former Member]

hi,

Are you talking about forms(Adobe ) or webdynpro layout ?

If you want your layout in webdynpro as :

Label 1 Input 1

Label 2 Input 2

Label 3 Input 3

Then please use matrix layout for RootUI Container.

Label1 - Matrixhead Data INput 1 Matrix Data

Label2 - Matrixhead Data INput 2 Matrix Data

Label3 - Matrixhead Data INput 3 Matrix Data

Button - Matrixhead Data.

I hope it would help.

Edited by: Saurav Mago on Oct 7, 2009 5:51 PM

[former_member182426]

Hi Saurav,

Thanks for your solution. Its worked. But the gap between Label and InputField is too much it's showing.

Label1                                                           InputField

Like this its showing, How can i reduce the gap between Label and InputFiled. I want only one Tab gap between Label and InputField. Like this i want to display.

Label1        InputField

Hi Pankaj,

You said Transparent Containel, Whats it is. I didnt find it. Can you tell little bit more information about it.

Regards,

Shankar.

[Former Member]

Transparent container is a UI elment like other UI elements Label , Inputfield.

Inside Transparent container also you can place your elements.

You could also you RowLayout like Pankaj suggested and between two Elements you can put Invisible ui elements to have proper spacing.

Like :

Label1 Invisibleelement1 Inputfiedl

Edited by: Saurav Mago on Oct 8, 2009 1:27 PM

[Former Member]

Hi,

Transparent container is a Ui element used to have the other ui elments collectively.

[former_member182426]

Hi Saurav,

I inserted UI element InvisibleElement as you suggested. But even though it is showing same gap. It's not reduced the gap.

Regards,

Shankar.

[Former Member]

Try this :

It will work .

Take one Transparent Container UI element.

Property : Layout - MatrixLayout

LayoutData - Matrix Head Data.

Insert your Label1, Input1, label2 , input 2 , label3 , input3 inside this transparent container.

Property : label1 - Layout- MatrixHeadData.

Input1 - Layout- MatrixData.

label2 - Layout- MatrixHeadData.

Input2 - Layout- MatrixData.

label3 - Layout- MatrixHeadData.

Input3 - Layout- MatrixData.

[Former Member]

Hi Shankar,

if u r talking about the layout design of ur view ,it is simple to do

try doing this ..

1 Insert all ur UI elements in transparent Container. Change its layout to matrix

2 MAke sure the layout data is Matrix head data for Label1 , LAbel2 and Label3

3 For the iput fields, continue with MAtrix LAyout data

4 Matrix Head layout for ur BUtton UI element

for the button , if u wish to give sm space , u can try this

1 u cn insert text view element , its layout as Matrix Head LAyout

and in the Text property of the element press ALT + 0160.

2 u can thn give layout as Matrix for button , if u r inserting text view before ur Button UI

also , try to play with the hAlign property of ur button UI element

rgds,

amit

Edited by: amit saini on Oct 8, 2009 6:56 AM