Your Privacy Matters: We use our own and third-party cookies to improve your experience on our website. By continuing to use the website we understand that you accept their use. Cookie Policy
195
Field layout
posted

Hi,

can any one post the Sample code for the customizable field layout.figure looks like field layout in the link

http://ko.infragistics.com/Control.aspx?panel=overview&id=5971#Gallery

Thanks

  • 25
    posted

    Hey timex1111,

    As I went looking for the sample for the screenshot you were mentioning, I ended up finding out that those
    screenshots were from our old 2007.1 samples. And so the sample no longer exists...
    However!!! (this is a good however!)
    I want to help you out so I have re-created the FieldLayouts for that exact sample, to demonstrate how
    it can be done!

    You can also find a great reference using the link below in case whatever I type is confusing or not correct...

    Arranging Fields to Customize your FieldLayout


    The first thing you will need to do is to set AutoArrangeCells="Never" and AutoGenerateFields="False" on your FieldLayoutSettings...

    <igDP:FieldLayoutSettings AutoArrangeCells="Never" AutoGenerateFields="False"


    This next portion of code directly emulates the exact same FieldLayout as seen in that Screenshot,
    the only difference is that I used UnboundFields rather than actual "igDP:Field"s just to see if it worked.

    <igDP:XamDataGrid.FieldLayouts>
     
    <igDP:FieldLayout>
      
    <igDP:FieldLayout.Fields>
        
    <igDP:UnboundField Name="Photo" Row="0" Column="0" RowSpan="3" />
         <igDP:UnboundField Name="Employee Name" Row="0" Column="1"/>
         <igDP:UnboundField Name="Title" Row="1" Column="1"/>
         <igDP:UnboundField Name="Department" Row="2" Column="1"/>
        
    <igDP:UnboundField Name="Street Address" Row="0" Column="2" ColumnSpan="3" />
         <igDP:UnboundField Name="Apt/Ste Number" Row="1" Column="2" ColumnSpan="3" />
         <igDP:UnboundField Name="City" Row="2" Column="2" />
         <igDP:UnboundField Name="State/Province" Row="2" Column="3" />
         <igDP:UnboundField Name="Postal Code" Row="2" Column="4" />
         <
    igDP:UnboundField Name="E-mail" Row="0" Column="5" />
        
    <igDP:UnboundField Name="Home Phone" Row="1" Column="5" />
         <igDP:UnboundField Name="Cell Phone" Row="2" Column="5" />
       </
    igDP:FieldLayout.Fields>
      </
    igDP:FieldLayout>

    </igDP:XamDataGrid.FieldLayouts>


    As you can see each igDP:UnboundField (convert it into an actual igDP:Field) belongs to a specific Row, and Column,
    and can be stretched along the rows or columns using RowSpan="" and ColumnSpan="" to achieve the desired spanning.

    Please let me know if this helps you out!

    Thanks!

    -Tim