Quantcast
Channel: Active questions tagged blazor - Stack Overflow
Viewing all articles
Browse latest Browse all 4839

How to properly create an editable cell using antd table and andt Select in blazor

$
0
0

Basically i'm trying to create an antd table with an editable cell that uses a select component to edit the value of the cell, aparently my select is working and the value in the cell changes but after the function stopEdit gets triggered and prints the values of the current row the value of the field Input is actually null, which is causing a lot of problems.

@code{   int i = 0;   string? editId;   record ItemData(string Id)   {       public string? Input { get; set; }       public int? MinVal { get; set; }       public int? MaxVal { get; set; }       public int? Steps { get; set; }       public string? Method { get; set; }       public string? ParametersList { get; set; }   };   ItemData[] listOfData = { };    void addRow()    {        listOfData = listOfData.Append(new($"{i}")            {                Input = "Select a parameter...",                MinVal = 0,                MaxVal = 0,                Steps = 0,                Method            = "NONE",                ParametersList = ""            });        i++;    }   void startEdit(string id)   {        editId = id;        Console.WriteLine(editId);    }   void stopEdit()   {       var editedData = listOfData.FirstOrDefault(x => x.Id == editId);       Console.WriteLine(JsonSerializer.Serialize(editedData));       editId = null;   }}<Table DataSource="listOfData" RowClassName="@(_=>"editable-row")" Bordered><PropertyColumn Title="Description" Width="250px" Property="c=>c.Input">                        @if (editId == context.Id)                        {<Select                                  DataSource="@listOfParams"                                 @bind-Value="context.Input"                                 Placeholder="Select a parameter..."                                 ValueProperty="item=>item.InputParameter"                                LabelProperty="item=>item.InputParameter"                                 DefaultValue="@("Select a parameter...")"                                OnBlur="stopEdit"                                AutoFocus                                   Style="width:100%; height:100%; font-size:12px;"></Select>                        }                        else                        {<div class="editable-cell-value-wrap" style="padding-right:24px"                                @onclick="()=>startEdit(context.Id)">                                @context.Input</div>                        }</PropertyColumn>                    ...more columns</Table>

it seems that @bind-Value="context.Input" is not working properly but i don't really understand what's going on since i'm new with blazor, if someone can help me with this it would be great, or does anyone have built a similar behavior or component before?


Viewing all articles
Browse latest Browse all 4839

Trending Articles



<script src="https://jsc.adskeeper.com/r/s/rssing.com.1596347.js" async> </script>