TextBox in row GridColumn Template

[Jacek]

Hi guys

I'm trying this code

<GridColumn HeaderText="#">

            <Template>

                <SfTextBox Placeholder="Amount"></SfTextBox>

            </Template>

</GridColumn>

As you can see, I'd like to have TextBox in GridColumn Template to edit some value.

It shows textboxes in rows but only last TextBox is editable.

Is it correct behavior?

Full code

@page "/catalog/index2"

<span>Produkty</span>

<SfGrid DataSource="@articles">

    <GridColumns>

        <GridColumn HeaderText="#" Width="60">

            <Template>

                @{

                    var keyField = (context as ArticleModel).Id;

                    <i class="material-icons md-36" @onclick="@(() => { ProdGridOnShowDescriptionClick(keyField); })" title="Pokaż opis produktu">pageview</i>

                }

            </Template>

        </GridColumn>

        <GridColumn HeaderText="Nazwa" Field="@nameof(ArticleModel.Name)" />

        <GridColumn HeaderText="Kod" Field="@nameof(ArticleModel.Code)" />

        <GridColumn HeaderText="Cena" Field="@nameof(ArticleModel.BasePriceNetto)" />

        <GridColumn HeaderText="#">

            <Template>

                <SfTextBox Placeholder="Amount"></SfTextBox>

            </Template>

        </GridColumn>

    </GridColumns>

</SfGrid>

@code{

    List<ArticleModel> articles = new List<ArticleModel>();

    protected override async Task OnInitializedAsync()

    {

        articles.Add(new ArticleModel { Id = 1, Code = "Art1", Name = "Art1", IsOwnProduct = true, BasePriceNetto = 12, BasePriceBrutto = 14 });

        articles.Add(new ArticleModel { Id = 2, Code = "Art2", Name = "Art2", IsOwnProduct = true, BasePriceNetto = 12, BasePriceBrutto = 14 });

        articles.Add(new ArticleModel { Id = 11, Code = "Art11", Name = "Art11", IsOwnProduct = false, BasePriceNetto = 12, BasePriceBrutto = 14 });

        articles.Add(new ArticleModel { Id = 12, Code = "Art12", Name = "Art12", IsOwnProduct = false, BasePriceNetto = 12, BasePriceBrutto = 14 });

    }

    void ProdGridOnShowDescriptionClick(object oid)

    {

        //View product description

        int id = (int)oid;

    }

    public class ArticleModel

    {

        public int Id { get; set; }

        public string Name { get; set; }

        public string Code { get; set; }

        public bool IsOwnProduct { get; set; }

        public decimal BasePriceNetto { get; set; }

        public decimal BasePriceBrutto { get; set; }

        public string AmountS { get; set; } = "0,00";

    }

}

[Renjith Singh Rajendran]

Hi Jacek, 

Greetings from Syncfusion support. 

We suggest you to set onkey:stoppropagation as true to resolve the reported problem. Please refer and add the below codes in your application to overcome the reported problem. 

 

<GridColumn HeaderText="#"> 

    <Template> 

        <div @onkeydown:stopPropagation="true"> 

            <SfTextBox Placeholder="Amount"></SfTextBox> 

        </div> 

    </Template> 

</GridColumn> 

 

Please get back to us if you need further assistance. 

Regards, 

Renjith Singh Rajendran 

[Jacek]

Thanks, it's working fine.

[Renjith Singh Rajendran]

Hi Jacek, 

Thanks for your update. 

We are glad to hear that the provided suggestion helped you in achieving this requirement. 

Please get back to us if you need further assistance. 

Regards, 

Renjith Singh Rajendran