Search code examples
c#blazorblazor-webassembly

Blazor EditForm InputText


Hello I am new to blazor webassembly and I am trying to build a simple shop with some basic functionalities.

I was trying to make my form for adding products and as you know each product must be linked to a user, in my case I am storing the username of the user in the product as its the simplest method I can think of now.

But I have reached a bottleneck as I am not sure how to include the user's username into my form, my method of getting the username is using <AuthorizeView> context and then get the username from there. However, I have no idea how to place the username into <InputText>.

Below is the code for my EditForm and the InputText for username is the first one.

Currently, the user needs to type in his own username to create the product.

So is there any method of automatically assigning the username to the InputText ?

        <EditForm Model="@newproduct" OnValidSubmit="AddProduct">
            <DataAnnotationsValidator />
            <CustomFormValidator @ref="customFormValidator" />
            <div class="form-group row">
                <label class="control-label col-md-12">Username</label>
                <div class="col">
                    <InputText class="form-control" @bind-Value="newproduct.username" />
                    <ValidationMessage For="@(() => newproduct.username)" />
                </div>
            </div>

            <div class="form-group row">
                <label class="control-label col-md-12">Product Name</label>
                <div class="col">
                    <InputText class="form-control" @bind-Value="newproduct.Name" />
                    <ValidationMessage For="@(() => newproduct.Name)" />
                </div>
            </div>

            <div class="form-group row">
                <label class="control-label col-md-12">Product Description</label>
                <div class="col">
                    <InputText class="form-control" @bind-Value="newproduct.Description" />
                    <ValidationMessage For="@(() => newproduct.Description)" />
                </div>
            </div>

            <div class="form-group row">
                <label class="control-label col-md-12">Image</label>
                <div class="col">
                    <InputText class="form-control" @bind-Value="newproduct.Image" />
                    <ValidationMessage For="@(() => newproduct.Image)" />
                </div>
            </div>

            <div class="form-group row">
                <label class="control-label col-md-12">Stock</label>
                <div class="col">
                    <InputNumber class="form-control" @bind-Value=newproduct.Stock />
                    <ValidationMessage For="@(() => newproduct.Stock)" />
                </div>
            </div>

            <div class="form-group row">
                <label class="control-label col-md-12">Price(no decimal)</label>
                <div class="col">
                    <InputNumber class="form-control" @bind-Value=newproduct.Price />
                    <ValidationMessage For="@(() => newproduct.Price)" />
                </div>
            </div>

            <div class="form-group row">
                <label class="control-label col-md-12">Category</label>
                <div class="col">
                    <InputSelect class="form-control" @bind-Value="newproduct.P_Category">
                        <option value="">--Select--</option>
                        @foreach (var category in Categories)
                            {
                            <option value="@category.Name">@category.Name</option>
                            }
                    </InputSelect>
                    <ValidationMessage For="@(() => newproduct.P_Category)" />
                </div>
            </div>
            <div class="form-group" align="right">
                <button type="submit" class="btn btn-success">Add</button>
            </div>
        </EditForm>

Test


Solution

  • You can try something like this:

    <AuthorizeView>
        <Authorized>
            @ { newproduct.username = @context.User.Identity.Name; }
    
            <EditForm Model="@newproduct" OnValidSubmit="AddProduct">
             ///////////
            </EditForm>
        </Authorized>
        <NotAuthorized>
            <a href="Identity/Account/Register">Register</a>
            <a href="Identity/Account/Login">Log in</a>
        </NotAuthorized>
    </AuthorizeView>
    
    
    @code
    {
       private Product newproduct = new Product();
    
       
    }
    

    Note: In a real world's scenarios, the Customer should be associated with an Order (you may call it Cart, if you wish), and an Order may be associated with Order's details, which is an entity (OrderDetails) that contains the details of an Order. And an OrderDetails entity may be associated with a given product (Product entity)