0

I'm having an index out of bounds issue on one of my razor pages, even though it is in a for loop ensuring it's not out of bounds. This is a page for uploading a mini that the user has created with what paints were used on what parts (i.e. body armor was painted "Blue" etc...). This is a slightly complicated model, so if I need to add more info I will, but I'm trying to keep the code as small as possible to make it easier to review. Thanks in advance for the help!

@foreach (var elem in newMini.Elements)
                {
                    <div class="@elem.Name">
                        <InputText @bind-Value="elem.Name" placeholder="Element name" />
                        @for (int i = 0; i < elem.PaintsUsed.Count; i++)
                        {
                        <div class="@elem.PaintsUsed[i]">
                            index: @i of count: @elem.PaintsUsed.Count 
                            <input type="text"
                                   list="paint-search"
                                   placeholder="Search from @allPaints.Count() paints!"
                                   @bind="@elem.PaintsUsed[i]" />
                            <datalist id="paint-search">
                                @foreach (var paint in allPaints)
                                {
                                    <option>@paint.PaintName</option>
                                }
                            </datalist>
                        </div>
                        }
                        @if (!String.IsNullOrWhiteSpace(elem.Name))
                        {
                            <button type="button" @onclick="() => AddPaintToElement(elem)">
                                Add Paint To Element
                            </button>
                        }
                    </div>
                }

EDIT: Here's a link to the file and my repo, if you need more background. https://github.com/Zami77/wargamer_showcase/blob/main/Pages/MiniUpload.razor

Zami77
  • 127
  • 8
  • Try capturing your paint into a temporary variable at the start of the loop and binding/using that.. `@for (int i = 0; i < elem.PaintsUsed.Count; i++) {` `var paintUsed = elem.PaintsUsed[i];` `
    ` (and again further down). I'm wondering if that the i is being captured and by the time it's actually used for eg render the value of it is equal to the list count so it's out of bounds.. but it's just a guess..
     – Caius Jard Sep 25 '21 at 17:21
  • So that stopped the error, but it doesn't actually register the paint that's selected on the dropdown, it's not in the input text box. I have the same dropdown on a different page and when you select a paint it remains in the input box until you submit it. This is all within an EditForm tag, not sure if that changes anything. Thanks so far though! – Zami77 Sep 25 '21 at 17:35
  • Always use a @foreach loop. The problem in the code above is that `i` is set to `elem.PaintsUsed.Count` when the component is actually rendered - which is out of bounds. – MrC aka Shaun Curtis Sep 25 '21 at 17:48
  • Note: What Caius Jard suggested you to do is wrong, though he's right about the source of the issue. See here how to do that: https://stackoverflow.com/questions/54812427/for-loop-not-returning-expected-value-c-sharp-blazor/54813295#54813295 – enet Sep 25 '21 at 17:54
  • 1
    I went back to a foreach loop and made a `var curPaintUsed = paintUsed` temp variable, however, the field in the input box still isn't holding the value. – Zami77 Sep 25 '21 at 18:35
  • @Zami77, you either use a local variable or for each loop, but not both. Modify your code accordingly, and if it still has issues, create a new question with the modified code. – enet Sep 25 '21 at 18:42
  • 1
    @enet, thanks. I'll open up a new question. – Zami77 Sep 25 '21 at 18:44

0 Answers0