Search code examples
c#razorblazorbind

Update a field in Blazor from another component immediately


I have an object (element) created on the parent component. And I pass a reference to it on child ViewComponent and child EditComponent.

When I change the element's properties in the EditComponent

<input type=text @[email protected]/>

they change, but changes are shown on the ViewComponent only if I change focus.

I tried <input type=text @[email protected] @bind:event="oninput"/> but nothing happened.

On the ViewComponent I show the result simply <p>@Element.Placeholder

I was wondering if I can get the ViewComponent to "listen" to changes, not hard rendering the values or something like that. No sure I'm using correct terms here hope you understood what I'm trying to do. Thanks
*Edited for clearer question


Solution

  • This works for me ViewComponent.razor

    <p>@Value</p>
    
    @code
    {
        [Parameter]
        public string Value { get; set; }
    }
    
    

    Index.razor

    @page "/"
    
    <ViewComponent Value="@_value" />
    <input @bind="_value" @bind:event="oninput">
    
    @code
    {
        private string _value = "";
    }
    
    

    This should word with in a an EditForm. You can try it out here in fiddle.