Pass text from textbox to a method from clicking a button

Radzen.Blazor Components
1

I'm trying to figure out how to get the text I type in a textbox set as a parameter value to be passed to an update function when I click a button.

In the documentation for TextBox I see ‘textbox’ + index suffix but I don't understand how to interpret that to the actual markup in this scenario. For now I'm just passing a hard-coded string "Text" as the 3rd parameter sent to the 'UpdateIgnoreRadzen' function.

       <RadzenGridColumn TItem="@AgentSurveyDisplay" Property="Comment" Title="Comment" Visible="true" Width="200px">
            <Template Context="AgentSurveys">
                <RadzenTextBox Placeholder="Enter Comment..." Visible="true" MaxLength="8000"></RadzenTextBox>
            </Template>
        </RadzenGridColumn>
        <RadzenGridColumn TItem="@AgentSurveyDisplay" Title="Save" Visible="true" Width="200px">
            <Template Context="AgentSurveys">
                <RadzenButton Text="Save" Click="@(args => UpdateIgnoreRadzen(AgentSurveys.Ignore, AgentSurveys.Id, "TextBox"))"></RadzenButton>
            </Template>
        </RadzenGridColumn>
2

You should use @bind-Value to "attach" an input component (RadzenTextBox) to a property of your model (AgentSurveys). So if you want the RadzenTextBox to update the Comment property you need to use @bind-Value=@AgentSurveys.Comment.

Something like this:

<RadzenGridColumn TItem="@AgentSurveyDisplay" Property="Comment" 
     Title="Comment" Width="200px">
  <Template Context="AgentSurveys">
    <RadzenTextBox Placeholder="Enter Comment..." 
      @bind-Value=@AgentSurveys.Comment 
      MaxLength="8000"></RadzenTextBox>
  </Template>
</RadzenGridColumn>

Then use the model property in the event handler:

<RadzenGridColumn TItem="@AgentSurveyDisplay" Title="Save" Width="200px">
   <Template Context="AgentSurveys">
      <RadzenButton Text="Save" 
        Click="@(args => UpdateIgnoreRadzen(
            AgentSurveys.Ignore, AgentSurveys.Id, AgentSurveys.Comment))">
      </RadzenButton>
   </Template>
</RadzenGridColumn>
1 Like
3

That approach worked, thank you.