We use cookies to give you the best experience on our website. If you continue to browse, then you agree to our privacy policy and cookie policy. Image for the cookie policy date

Showing "Editor" Control on Cell Focus

We are currently trying to create custom "editors" per say (we are porting software from another language/platform). They are basically controls that add extra functionality to standard cells. 

For example, one custom control consists of a textbox, a few buttons, and a whole lot of custom functionality for interacting with special objects in another application. Mainly it is used for grabbing directories or other information, holding it for use by other components, and displaying the data it retrieved in the cell.

We want to be able to put the control inside of the cell as an "editor" (i.e., only when in edit mode). Afterward, we want the cell to go back to normal and just show the data that the editor grabbed. 

Is there any simplistic way to do this?

Thanks in advance.

1 Reply

SH Shakul Hameed M Syncfusion Team December 30, 2013 07:29 AM UTC

Hi Logan,

 

Thanks for using Syncfusion products.

 

We have analyzed your query and we can achieve your requirement by using CellEditItemTemplate and CellItemTemplate.

CellEditItemTemplate is the DateTemplate type property, which is used to set the Edit DataTemplate for the cell and

CellItemTemplate is a DateTemplate type property, which is used to set the Item DataTemplate for the cell.

 

Please refer the following code snippet.

 

Code Snippet:

<syncfusion:GridDataVisibleColumn HeaderText="Ship Country" MappingName="ShipCountry">

 

      <syncfusion:GridDataVisibleColumn.CellEditItemTemplate>

           <DataTemplate>

               <Grid>

                   <Grid.ColumnDefinitions>

                          <ColumnDefinition Width="40" />

                           <ColumnDefinition Width="*" />

                   </Grid.ColumnDefinitions>

 

                   <Image Height="15" VerticalAlignment="Center"

                        Source="{Binding Path=CellBoundValue,

                        Converter={StaticResource StringToImageConverter}}" />

                

                   <TextBox Grid.Column="1" VerticalAlignment="Center"

                           Text="{ Binding CellBoundValue}"/>                                       

               </Grid>

           </DataTemplate>

       </syncfusion:GridDataVisibleColumn.CellEditItemTemplate>

 

    <syncfusion:GridDataVisibleColumn.CellItemTemplate>

          <DataTemplate>

             <Grid>

                  <Grid.ColumnDefinitions>

                      <ColumnDefinition Width="*" />

                  </Grid.ColumnDefinitions>

                  <TextBlock Grid.Column="1" VerticalAlignment="Center"

                             Text="{Binding CellBoundValue}" />

              </Grid>

          </DataTemplate>

     </syncfusion:GridDataVisibleColumn.CellItemTemplate>

 

</syncfusion:GridDataVisibleColumn>

 

Here I have loaded an image and a textbox to a cell when the cell is in edit mode, after editing, the default item template is loaded i.e., TextBlock is loaded to the same cell.

By using this, you can load any type of custom controls to a cell.

 

We have prepared a sample based on your requirement, please find the sample from the below location.

 

Sample: Loading Custom control in edit.zip

 

Here the CellEditItemTemplate and CellItemTemplate is loaded in the Ship Country Column.

 

Please let us know if you have any queries.

 

Thanks,

Shakul Hameed


Loader.
Live Chat Icon For mobile
Up arrow icon