Autocomplete insida GridTemplateColumn get focus

Hi,

I'm trying to find out a way to do this but the help i found hasn't yet worked for me.
I got a SfDataGrid with a GridTemplateColumn and the EditTemplate for it contains a Syncfusion Autocomplete control. What I want is that it works like a TextBoxColumn, so when i'm in such cell and press a key to write it start the edit mode and write in the autocomplete control.

This is my XAML for such column:

<Syncfusion:GridTemplateColumn HeaderText="Envasador" MaximumWidth="90">
                            <Syncfusion:GridTemplateColumn.EditTemplate>
                                <DataTemplate>
                                    <Syncfusion:AutoComplete CustomSource="{Binding Path=DataContext.Envasadores, RelativeSource={RelativeSource FindAncestor, AncestorType=UserControl}}"
                                                     StringMode="AnyChar" SelectedItem="{Binding Path=Envasador}" Name="Provincia" DisplayMemberPath="NombreCompleto"
                                                             Syncfusion:FocusManagerHelper.FocusedElement="True"/>
                                </DataTemplate>
                            </Syncfusion:GridTemplateColumn.EditTemplate>
                            <Syncfusion:GridTemplateColumn.CellTemplate>
                                <DataTemplate>
                                    <TextBlock Text="{Binding Path=Envasador.NombreCompleto}"/>
                                </DataTemplate>
                            </Syncfusion:GridTemplateColumn.CellTemplate>
                        </Syncfusion:GridTemplateColumn>

As can be seen I'm using the Syncfusion:FocusManagerHelper.FocusedElement="True" property to achieve that following the documentation, but seems it doesn't work as i need still to double click the cell to enter the edit mode.

How can I do that, or there is something I'm doing wrong?

Thanks in advance.

17 Replies

DG David García June 26, 2016 11:28 AM UTC

Hi again,

I add more informatión. I have tries this with the SfTextBoxExt control for autocomplete too and still can't get that when I'm on the cell when press a key it start editing (only if I press F2).
I have added this to the control inside the GridTemplateColumn.EditTemplate (Syncfusion:FocusManagerHelper.FocusedElement="True") but still nothing.

Thanks.


JG Jai Ganesh S Syncfusion Team June 27, 2016 10:29 AM UTC

Hi David, 
You can achieve your requirement to go to edit mode when pressing a single click on AutoComplete control by setting a Focusable as true, 
 
  <Syncfusion:GridTemplateColumn HeaderText="Envasador" MaximumWidth="90"> 
         <Syncfusion:GridTemplateColumn.EditTemplate> 
                        <DataTemplate> 
                            <Syncfusion:AutoComplete Focusable="True"   CustomSource="{Binding Path=DataContext.Envasadores, RelativeSource={RelativeSource FindAncestor, AncestorType=UserControl}}" 
                                                     StringMode="AnyChar" SelectedItem="{Binding Path=Envasador}" Name="Provincia" DisplayMemberPath="NombreCompleto" 
                                                             Syncfusion:FocusManagerHelper.FocusedElement="True"/> 
                        </DataTemplate> 
          </Syncfusion:GridTemplateColumn.EditTemplate> 
          <Syncfusion:GridTemplateColumn.CellTemplate> 
                        <DataTemplate> 
                            <TextBlock Text="{Binding Path=Envasador.NombreCompleto}"/> 
                        </DataTemplate> 
          </Syncfusion:GridTemplateColumn.CellTemplate> 
 </Syncfusion:GridTemplateColumn> 

Regards, 
Jai Ganesh S 



DG David García June 27, 2016 11:19 AM UTC

Hi again,

Thanks for your reply but I couldn't make it work. Whenever I'm on the cell I press any key to start writting and enter the edit mode it doesn't enter the edit mode. I have to double click on the cell to enter the edit mode.
I would like that just with pressing a letter or number it enter the edit mode like the GridTextBoxColumn work.

Thanks again.


JG Jai Ganesh S Syncfusion Team June 28, 2016 01:15 PM UTC

Hi David, 
 
You can achieve your requirement to go to edit mode on the TemplateColumn when typing any letter by wiring PreviewKeyDown event like below, 
 
this.dataGrid.PreviewKeyDown+=dataGrid_PreviewKeyDown; 
 
void dataGrid_PreviewKeyDown(object sender, KeyEventArgs e) 
   { 
         if (!this.dataGrid.SelectionController.CurrentCellManager.HasCurrentCell) 
                return; 
 
         if(this.dataGrid.SelectionController.CurrentCellManager.CurrentCell.IsEditing) 
          return; 
 
         this.dataGrid.SelectionController.CurrentCellManager.BeginEdit();             
   } 
 
 
 
Regards, 
Jai Ganesh S 



DG David García June 28, 2016 03:19 PM UTC

Thanks so much for the help!!

It works perfectly.


JG Jai Ganesh S Syncfusion Team June 29, 2016 03:45 AM UTC

Hi David, 
 
Thank you for the update. 
 
Please let us know if you need further assistance on this. 
 
Regards, 
Jai Ganesh S 
 



RS Ranjeet Singh September 27, 2017 10:10 AM UTC

hi im trying to use syncfusion autocomplete text in my project i want to change the color of a label while i focus on the autocomplete 

can u please help me how to achieve it i even  tried  Focusable="True" but it is throwing an error saying no know element Focusable

and i generated focused event but break point is not hitting the events and it is not working

how to achieve this in xamarin forms


here is the code

               

               

               



SK Selva Kumar  Veerakrishnan Syncfusion Team September 28, 2017 12:16 PM UTC

Hi Ranjeeth, 

Thank you for contacting Syncfusion Support. 

We have implemented the FocusChanged event in AutoComplete. It has been included in our Volume 3 service pack 2, which has been expected to be rolled out by end of September 2017. 

Please let us know if you have any concern on this. 

Regards,
Selva Kumar V. 



SK Selva Kumar  Veerakrishnan Syncfusion Team October 4, 2017 05:23 AM UTC

Hi All,

We are glad to announce that our Essential Studio Volume 3 Service Pack 2, 2017 (Version 15.3.0.33) is rolled out and is available for download under the following link.

https://www.syncfusion.com/forums/132941/essential-studio-2017-volume-3-service-pack-release-v15-3-0-33-available-for-download

We thank you for your support and appreciate your patience in waiting for this release. Please get in touch with us if you would require any further assistance.

Regards,
Selva Kumar V.


DG David García replied to Jai Ganesh S February 13, 2018 12:39 PM UTC

Hi David, 
 
You can achieve your requirement to go to edit mode on the TemplateColumn when typing any letter by wiring PreviewKeyDown event like below, 
 
this.dataGrid.PreviewKeyDown+=dataGrid_PreviewKeyDown; 
 
void dataGrid_PreviewKeyDown(object sender, KeyEventArgs e) 
   { 
         if (!this.dataGrid.SelectionController.CurrentCellManager.HasCurrentCell) 
                return; 
 
         if(this.dataGrid.SelectionController.CurrentCellManager.CurrentCell.IsEditing) 
          return; 
 
         this.dataGrid.SelectionController.CurrentCellManager.BeginEdit();             
   } 
 
 
 
Regards, 
Jai Ganesh S 


Hi again,

How can that be achieved in the AddNewRow? I explain: when I finish with a row and it commit with the tab key in the last cell it moves to the first cell of the AddNewRow, but at this point I have to press a key twice (one to BeginEdit in the cell/row and the 2nd one that really accepts the key). How can be possible to do that when I press a key once and both works to BeginEdit but also accept as the first value of the cell? The cell is a GridTemplateColumn.

Thanks in advance.


GT Gnanasownthari Thirugnanam Syncfusion Team February 14, 2018 01:14 PM UTC

Hi David, 

You can achieve your requirement while press any key in cell (GridTemplateColumn) it should goes to edit mode and pressed values are entered at single key press by override the PreviewTextInput method and PreviewKeyDown event in SfDataGrid. 

void AssociatedObject_PreviewKeyDown(object sender, System.Windows.Input.KeyEventArgs e) 
{ 
    if (!this.AssociatedObject.SelectionController.CurrentCellManager.HasCurrentCell) 
        return; 
 
    if (this.AssociatedObject.SelectionController.CurrentCellManager.CurrentCell.IsEditing) 
        return; 
    //Here need to call the Beginedit method for GridTempaletColumn 
    if (this.AssociatedObject.Columns[this.AssociatedObject.SelectionController.CurrentCellManager.CurrentRowColumnIndex.ColumnIndex - 1] is GridTemplateColumn) 
        this.AssociatedObject.SelectionController.CurrentCellManager.BeginEdit();    
} 
 
protected override void OnTextInput(TextCompositionEventArgs e) 
{ 
    if (!SelectionController.CurrentCellManager.HasCurrentCell) 
    { 
        base.OnTextInput(e); 
        return; 
    } 
    //Get the Current Row and Column index from the CurrentCellManager 
    var rowColumnIndex = SelectionController.CurrentCellManager.CurrentRowColumnIndex; 
    var dataGrid = e.OriginalSource as SfDataGridExt; 
    RowGenerator rowGenerator = dataGrid.RowGenerator; 
    var dataRow = rowGenerator.Items.FirstOrDefault(item => item.RowIndex == rowColumnIndex.RowIndex); 
    List<DataColumnBase> visiblecolumn = dataRow.VisibleColumns; 
    if (dataRow != null && dataRow is DataRow) 
    { 
        //Get the column from the VisibleColumn collection based on the column index 
        var dataColumn = visiblecolumn.FirstOrDefault(column => column.ColumnIndex == rowColumnIndex.ColumnIndex); 
        //Convert the input text to char type  
        char text; 
        char.TryParse(e.Text, out text); 
        //Skip if the column is GridTemplateColumn and the column is not already in editing  
        //Allow Editing only pressed letters digits and Minus sign key  
        if (dataColumn != null && !(dataColumn.GridColumn is GridTemplateColumn) && !dataColumn.IsEditing && 
            SelectionController.CurrentCellManager.BeginEdit() && 
            (e.Text.Equals(".") || char.IsLetterOrDigit(text))) 
            dataColumn.Renderer.PreviewTextInput(e); 
    } 
    base.OnTextInput(e); 
} 

We have modified the sample based on your requirement, you can download it from below mentioned location. 


Please refer the below UG and KB article for more details. 

If provided solution does not meet your requirement kindly revert to us with modified sample based on your application scenario that will be helpful to provide appropriate solution at the earliest. 

Regards, 
Gnanasownthari T. 



DG David García February 14, 2018 05:18 PM UTC

Hi again

Thanks for the example provided. I have cheched and it works as I want it to work, but the problem is when I change the Syncfusion Autocomplete control with the one I use (from an old WPFToolkit nuget package) then it starts to give problems (I attached the modified example).

I think could be the Autocomplete control I use issue that has some defect so my question is if for the Syncfusion Autocomplete control can be set a custom filter to search in the underlying collection. I don't want to search on the text displayed but 2 of the attached object collection properties.

In the example given I should be able to filter the autocomplete by both the Code and the Name properties (on the Area object).

Thanks in advance.

Attachment: TemplateColumnEditing942269875_f43d54c4.zip


KJ Keerthana Jegannathan Syncfusion Team February 16, 2018 09:17 AM UTC

  
Hi David,

Thanks for your update.

We understand that you want to filter the items in drop down based on two different properties(in your case “Name” and “Code”) in our AutoComplete. If so, in our control filtering can be made based on the “DisplayMemberPath” property. As DisplayMemberPath holds the value of a property in a class, filtering cannot be done using multiple properties of the same class. This is the default behavior of AutoComplete control.

Please let us know, if we misunderstood your query.

Regards,

Keerthana J


DG David García February 16, 2018 11:16 AM UTC

Hi,

That's exactly my purpose. I know the filters for the Autocomplete control from Synfusion doesn't allow that but I was wondering if there is a way to create a custom filter.

As showed in my example the control I use right now doesn't allow me to start editing and getting the first character probably because is an old control and is not in development anymore so I was looking for an alternative.

Thanks again.


KJ Keerthana Jegannathan Syncfusion Team February 19, 2018 09:41 AM UTC

Hi David, 
 
We have analyzed your requirement for “Filtering items based on the properties present in collection without depending on DisplayMemberPath”. As this feature is not available in our product, we will consider this a feature request. If you could confirm some specific details, it would help us to implement the feature in line with your requirement. 
 
Please review the following description of the feature and let us know if it conforms to your requirement. 
 
Need to provide support to search the item based on one of the property present in the collections. This search property name need be maintain as string property  in AutoComplete. 
 
If our definition of this feature is different from your requirement, then let us know the specific details, so that we can work towards fulfilling your requirement. 
 
Regards, 
Keerthana J 



DG David García March 6, 2018 04:05 PM UTC

Sorry for the delay in the reply back.

Would be great to add a custom filter operation for the Autocomplete that is based in any property (or a mix of properties). Has to be independent of the display text in the autocompletebox.

That filter operation can be based on a method similar to this:

public bool Search(string filter)
{
     // Do something with the properties of the ItemsSource object collection and matches the filter return true or return false if doesn't matches the filter
}

Hope that helps to improve the Autocomplete control and make it more flexable.


GS Gokul Sainarayanan Syncfusion Team March 7, 2018 12:46 PM UTC

Hi David,

We understand that you want to filter the items in the search based on all properties present in the collection but we have planned to filter the items based on one of the properties present in the collection. This is because filtering with multiple properties will display all elements which is not the behavior of the AutoComplete control.

Regards,
Gokul S 


Loader.
Up arrow icon