locked
How to create the dynamic tabular Entry Form on Blazor ? RRS feed

  • Question

  • User970350993 posted

    Hi All,

    I m trying to create the tabular dynamic entry form in Blazor, But when ever i m giving value for one text box, It is showing every where. How can read all the unique value at save time ?

    @page "/AddInspection"
    @inject ICategoryService CategoryService
    @inject IComponentService ComponentService
    @inject ICategoryService CategoryService
    @inject NavigationManager objNavigationManager
    <h4>Inspection Form</h4>
    
    <EditForm Model="@objIns" OnValidSubmit="CreateInspection">
        <div class="container">
            @foreach (var item in objServiceCateList)
            {
                if (item.IsVisible)
                {
                    flag = "block";
                }
                else
                {
                    flag = "none";
                }
                <div style="display:@flag">
    
                    <table class="table table-bordered">
    
                        <thead>
    
                            <tr>
                                <th>@item.ServiceCategoryName</th>
                                <th>@item.ServiceCategoryCol2</th>
                                <th>@item.ServiceCategoryCol3</th>
                                <th>OK</th>
                                <th>S</th>
                                <th>R</th>
                                <th>Reason</th>
                            </tr>
    
                        </thead>
                        <tbody>
                            @foreach (var item1 in componentVM)
                            {
                                @if (item.ServiceCategoryId == item1.ServiceCategogyId)
                                {
                                    <tr>
    
                                        @*@foreach (var InspItem in InspModel)
                                            {*@
                                        <td> <SfTextBox ID="txtLeftFront" Readonly="true" @bind-Value="item1.ComponentName"></SfTextBox></td>
                                        <td><SfTextBox ID="txtThirtyTwoNds" @bind-Value="objIns.ThirtyTwoNds"></SfTextBox></td>
                                        <td><SfTextBox ID="txtPsi" @bind-Value="objIns.Psi"></SfTextBox></td>
                                        <td><SfTextBox ID="txtOk" @bind-Value="objIns.Ok"></SfTextBox></td>
                                        <td><SfTextBox ID="txtS" @bind-Value="objIns.S"></SfTextBox></td>
                                        <td><SfTextBox ID="txtRepair" @bind-Value="objIns.Repair"></SfTextBox></td>
                                        <td><SfTextBox ID="txtReasons" @bind-Value="objIns.Reasons"></SfTextBox></td>
                                        <td><SfTextBox ID="txtNote" @bind-Value="objIns.Note"></SfTextBox></td>
    
                                    </tr>
                                }
                            }
    
                        </tbody>
                    </table>
                </div>
    
            }
        </div>
        <div class="row">
            <div class="col-md-4">
                <div class="form-group">
                    <button type="submit" class="btn btn-primary">Save</button>
                    <button type="submit" class="btn btn-primary" @onclick="@(() => Cancel())">Cancel</button>
                </div>
            </div>
        </div>
    </EditForm>
    
        @code {
            public string flag { get; set; }
            public List<ServiceCategory> objServiceCateList { get; set; }
            public List<ComponentVM> componentVM { get; set; }
    
            // public InspModel objIns = new InspModel();
            public InspectionForm objIns = new InspectionForm();
    
    
            protected override void OnInitialized()
            {
                objServiceCateList = CategoryService.GetAllCategory();
                componentVM = ComponentService.GetComponents();
            }
    
            public class InspModel
            {
                public List<InspectionForm> InspList { get; set; }
            }
    
            protected void CreateInspection()
            {
    
            }
    
            void Cancel()
            {
    
            }
    
        }
    

    Friday, November 20, 2020 3:48 PM

All replies

  • User-474980206 posted

    there is only one objIns and all the rows are binding to the same object, so if you change one. you change them all.

    other bugs:

    • duplicate ids
    • event binding to a foreach variable 

    Friday, November 20, 2020 11:20 PM
  • User970350993 posted

    Thanks for reply. Yes it is becoming same object, so i m getting problem. How can i create unique object on each iteration ?

    Saturday, November 21, 2020 1:21 AM
  • User-474980206 posted

    Use an array or or a collection.

    Saturday, November 21, 2020 4:03 PM