title: Blazor data-bind dynamically generated elements
body: <p>I want to dynamically create and bind some <code>select</code> elements from a list of &quot;AdditionalFields&quot; on my Blazor web page.</p>
  <p>I need to bind each element to the <code>CheckoutData</code> variable.</p>
  <p>But I don't know how I can create a variable / Array, or something like it, that is correctly updated via bind-value.</p>
  <p>For more details you can view my attached (<a href="https://ibb.co/DDf8HjX" rel="nofollow noreferrer">Image</a>) and this source code:</p>
  <pre><code>@if (StoreData.StoreContainer?.AdditionalFields != null)
      @foreach (var additionalField in     StoreData.StoreContainer.AdditionalFields)
      {
          &lt;div class=&quot;col-sm-6&quot;&gt;
              &lt;div class=&quot;page_input&quot;&gt;
                  &lt;label&gt; @additionalField.Caption &lt;/label&gt;
                  &lt;InputSelect class=&quot;checkout-control pristine untouched&quot; @bind-Value=&quot;@CheckoutData.OrderTimeType&quot;&gt;
                      @foreach (var keyValue in additionalField.ValueList)
                      {
                          &lt;option value=&quot;@keyValue.Sort&quot; selected=&quot;@(keyValue == additionalField.ValueList[0] ? &quot;selected&quot; : &quot;&quot;)&quot;&gt;@keyValue.SelectionText&lt;/option&gt;
                      }
                  &lt;/InputSelect&gt;
              &lt;/div&gt;
          &lt;/div&gt;
      }
  </code></pre>