Your Privacy Matters: We use our own and third-party cookies to improve your experience on our website. By continuing to use the website we understand that you accept their use. Cookie Policy
235
ASP.Net Core 3.1 Editor Helpers not all working with model
posted

Hello, I'm creating a site using ASP.Net Core 3.1, with IgniteUI 19.2.25 and Infragistics.Web.AspNetCore 6.19.22.

The MVC helpers for the more common controls (ComboFor, TextEditorFor) all work without a problem.

However, the helpers for NumericEditorFor, DatePickerFor, and MaskEditorFor are not generating the model field name for the hidden input tag associated with the control.  When I inspect the element, the name field is missing, while it is generated for the igCombo and the igTextEditor.

Any suggestions?

Parents Reply
  • 235
    Offline posted in reply to Ivaylo Ganchev

    I took this from the tutorial sample on https://docs.microsoft.com/en-gb/aspnet/core/tutorials/razor-pages/razor-pages-start?view=aspnetcore-3.1.  I modified the project to include newer versions of jquery and jquery.ui, then added the packages for igniteUI and Infragistics.Web.AspNetCore.  

    I changed the Create.cshtml page to use IgniteUI controls instead of the default input controls.

    I was using the infragistics css and js locally, but I removed them from the zipped sample to conserve space.

    @page
    @using Infragistics.Web.Mvc;
    @model RazorPagesMovie.Pages.Movies.CreateModel
    
    @{
        ViewData["Title"] = "Create";
    }
    
    <link type="text/css" href="@Url.Content("~/css/themes/infragistics/infragistics.theme.css")" rel="stylesheet" />
    <link type="text/css" href="@Url.Content("~/css/structure/infragistics.css")" rel="stylesheet" />
    
    <script type="text/javascript" src="~/lib/jquery/dist/modernizr.min.js"></script>
    <script type="text/javascript" src="~/lib/jquery/dist/jquery.min.js"></script>
    <script type="text/javascript" src="~/lib/jquery/dist/jquery-ui.min.js"></script>
    <script type="text/javascript" src="~/js/infragistics.core.js"></script>
    <script type="text/javascript" src="~/js/infragistics.lob.js"></script>
    <script type="text/javascript" src="~/js/modules/i18n/regional/infragistics.ui.regional-en.js"></script>
    
    <h1>Create</h1>
    
    <h4>Movie</h4>
    <hr />
    <div class="row">
        <div class="col-md-4">
            <form method="post">
                <div asp-validation-summary="ModelOnly" class="text-danger"></div>
                <div class="form-group">
                    <label asp-for="Movie.Title" class="control-label"></label>
                    <div>
                        @(Html.Infragistics().TextEditorFor(model => model.Movie.Title)
                           .ID("TitleEditor")
                           .InputName("TitleInput")
                           .PlaceHolder("Movie Title")
                           .Render()
                        )
                    </div>
                    <span asp-validation-for="Movie.Title" class="text-danger"></span>
                </div>
                <div class="form-group">
                    <label asp-for="Movie.ReleaseDate" class="control-label"></label>
                    <div>
                        @(Html.Infragistics().DatePickerFor(model => model.Movie.ReleaseDate)
                                     .ID("datePicker")
                                     .Render())
                    </div>
                    <span asp-validation-for="Movie.ReleaseDate" class="text-danger"></span>
                </div>
                <div class="form-group">
                    <label asp-for="Movie.Genre" class="control-label"></label>
                    <div>
                        @(Html.Infragistics().TextEditorFor(model => model.Movie.Genre)
                           .ID("GenreEditor")
                           .InputName("GenreInput")
                           .PlaceHolder("Genre")
                           .Render()
                        )
                    </div>
                    <span asp-validation-for="Movie.Genre" class="text-danger"></span>
                </div>
                <div class="form-group">
                    <label asp-for="Movie.Price" class="control-label"></label>
                    <div>
                        @(Html.Infragistics().NumericEditorFor(model => model.Movie.Price)
                              .ID("priceEditor")
                              .DataMode(NumericEditorDataMode.Double)
                              .MinValue(0)
                              .MaxDecimals(2)
                              .Value(0)
                              .Width(120)
                              .Render())
                    </div>
                    <span asp-validation-for="Movie.Price" class="text-danger"></span>
                </div>
                <div class="form-group">
                    <label asp-for="Movie.Rating" class="control-label"></label>
                    <div>
                        @(Html.Infragistics().TextEditorFor(model => model.Movie.Rating)
                              .ID("ratingEditor")
                              .Render())
                    </div>
                    <span asp-validation-for="Movie.Rating" class="text-danger"></span>
                </div>
                <div class="form-group">
                    <input type="submit" value="Create" class="btn btn-primary" />
                </div>
            </form>
        </div>
    </div>
    
    <div>
        <a asp-page="Index">Back to List</a>
    </div>
    
    @section Scripts {
        @{await Html.RenderPartialAsync("_ValidationScriptsPartial");}
    }
    

    Please let me know if you're able to run, and to reproduce my problem.  In this case, the first four items generated by the helpers did not bind properly to the model.

    The zipped solution is at the following link.  The LocalDB may need to be recreated with Update-Database in the package manager console.

    Onedrive zipfile link

Children