CheckBox Multiple Selector Asp.net.core RazorPages

Question

I'm working in entityframework 6. I have a problem with my Checkbox. I'm trying to select multiple of choices then save these choices to a List, save them to my PostModel which holds an ICollection<TagLogs>. Like any other i scoured the net for a solution, and followed some, but to no answer. I am getting this error: InvalidOperationException: Unexpected 'asp-for' expression result type 'System.Collections.Generic.List`1[[System.Int32, System.Private.CoreLib, Version=6.0.0.0, Culture=neutral, PublicKeyToken=7cec85d7bea7798e]]' for . 'asp-for' must be of type 'System.Boolean' or 'System.String' that can be parsed as a 'System.Boolean' if 'type' is 'checkbox'. I understand i need to change the SelectedChanges and make it to a Boolean or a string, then change few other things, but i still got more errors.

    [BindProperty]
    public List<int> SelectedChanges { get; set; } = new List<int>();
    public IEnumerable<TagLog> TagLogs { get; set; }

      public async Task OnGet()
     {
        //ChangeLogs = changeLogRepository.GetAllModels();
        TagLogs = await context.TagLogs.ToListAsync();
        //SelectedChanges = new List<int>();
    }  


    public async Task<IActionResult> OnPostAsync()
    {
        if (ModelState.IsValid)
        {
            var newPost = context.PostModels.FirstOrDefault(p => p.Title == PostViewModel.Title);
            if (newPost == null)
            {
             

                if (TagLogs != null)
                {
                    var selectedType = TagLogs.Where(x => SelectedChanges.Contains(x.TagLogId)).ToList();
               

                    PostModel postModel = new PostModel
                    {
                        Title = PostViewModel.Title,
                    
                        ChangeLogs = selectedType,
               
                    };
                 
               
                }
               
                    postRepository.Add(postModel);

                    TagLogs = changeLogRepository.GetAllModels();
                }

                return RedirectToPage("/Index");
            }
            return RedirectToPage("/Index");
        }
        FailedToPost = "Failed to Post, try again.";
        return Page();
    }
 public class TagLog
  {
    [Key]
    public int TagLogId { get; set; }
    public string TagLogName { get; set; }
    public bool IsChecked { get; set; }
    public virtual ICollection<PostModel>? PostModels { get; set; }
   }

Front End

       @foreach (var change in Model.TagLogs)
                {
                    <div class="form-check">
                        <!-- Set the value of the input to the change ID -->
                        <input class="form-check-input" type="checkbox" asp-for="SelectedChanges" value="@change.TagLogId" />
                        <label class="form-check-label">@change.TagLogName</label>
                    </div>
                }
                </div>

Best regards.

You cannot use asp-for for Lists. You have to use a boolean or a string property. There is a way to populate a list of checkboxes. But you need to create a separate viewmodel or a additional property in your existing models. Please see this post for more details: stackoverflow.com/questions/40555543/… — Sebastian Siemens
– Sebastian Siemens, Commented Feb 9, 2023 at 12:21
From my understanding, is that i'm using the asp-for wrong, and i should change my IEnumreble to Something else. — Rojhat
– Rojhat, Commented Feb 9, 2023 at 13:25
you can add a Property Checked (if it is entity model you can add attribute NotMapped) on the model TagLog and in your frontend you have to use for loop and then you can use asp-for="change[i].Checked" — Sebastian Siemens
– Sebastian Siemens, Commented Feb 9, 2023 at 13:42
I'm unsure what your referring to, Never used the "Checked property, so i'm not fully on what that would look like, but i'll search for it. "'asp-for="change[i].Checked' " Could you clarify it? — Rojhat
– Rojhat, Commented Feb 9, 2023 at 13:48

Rojhat · Accepted Answer · 2023-02-09 20:50:53Z

With the Help of a little ChatGPT and some skills of my own i managed to fix it. Ofcourse tons of stackoverflows. I hope my answer will help others. Also want to thank @Sebastian Siemens for pointing out things. What i was missing was loading the Taglogs before i compared where SelectedTaglos and SelectedChanged contained same id. Now this might be some bad and rookie mistake, but it took more time than i would like to admit.

          <div class="form-group">
                <h4>Select Multiple Logs</h4>
                @foreach (var change in Model._tagLogs)
                {
                    <div class="form-check">
                        <input class="form-check-input" type="checkbox" name="SelectedChanges" value="@change.TagId"
                           @(Model.SelectedChanges.Contains(change.TagId) ? "checked" : "") />
                        <label class="form-check-label">@change.TagTyp</label>
                    </div>
                }
            </div>

       public async Task<IActionResult> OnPostAsync()
    {
        if (ModelState.IsValid)
        {
            var newPost = context.PostModels.FirstOrDefault(p => p.Title == PostViewModel.Title);
            if (newPost == null)
            {
                _tagLogs = await context._TagLogs.ToListAsync();
                // takes multiple checkbox values
                var selectedTagLogs = _tagLogs.Where(x => SelectedChanges.Contains(x.TagId)).ToList();
                if (selectedTagLogs != null)
                {


                    PostModel postModel = new PostModel
                    {
                        Title = PostViewModel.Title,

                        _TagLogs = selectedTagLogs,

                    };
                    postRepository.Add(postModel);

                    _tagLogs = changeLogRepository.GetAllModels();
                }
            
                

                    _tagLogs = changeLogRepository.GetAllModels();
                }

      
            }
        }

        return Page();
    }

Collectives™ on Stack Overflow

CheckBox Multiple Selector Asp.net.core RazorPages

1 Answer 1

Comments

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

Comments

Your Answer

Sign up or log in

Post as a guest

Linked

Related