<div class="row">
  <div class="col-md-12 mt-2">
    <form id="cmsForm" method="post" action="/products/update" enctype="multipart/form-data" novalidate>
      <div class="card card-info">
        <div class="card-header">
          <h4 class="card-title"><%= sectionTitle %></h4>
        </div>
        <div class="card-body">

          <div class="form-row">
            <!-- Produktname -->
            <div class="form-group col-md-6">
              <label class="required" for="model_name">Produktname</label>
              <input
                type="text"
                id="model_name"
                name="model_name"
                class="form-control"
                placeholder="Enter Produktname"
                required
                value="<%= dataInfo.model_name %>"
                onkeypress="return /[a-zA-Z0-9 ]/i.test(event.key)"
  oninput="this.value = this.value.replace(/[^a-zA-Z0-9 ]/g, '')"
              />
            </div>

            <!-- Kategorie -->
            <div class="form-group col-md-6">
              <label class="required" for="category_id">Kategorie</label>
              <select
                id="category_id"
                name="category_id"
                class="form-control"
                required
              >
                <option selected disabled>Wähle Kategorie</option>
                <% categories.forEach(function(category) { %>
                  <option value="<%= category.id %>" <%= category.id === dataInfo.category_id ? 'selected' : '' %>>
                    <%= category.category_name %>
                  </option>
                <% }) %>
              </select>
            </div>

            <!-- Hidden field for ID -->
            <input type="hidden" id="page_id" name="page_id" value="<%= dataInfo.id %>" />
          </div>

          <!-- <div class="form-row mt-2">
            <div class="form-group col-md-6">
              <label for="item_number">Artikelnummer</label>
              <input
                type="text"
                id="item_number"
                name="item_number"
                class="form-control"
                placeholder="Enter Item Number"
                value="<%= dataInfo.item_number || '' %>"
              />
            </div>
            <div class="form-group col-md-6">
              <label for="supplier">Lieferant</label>
              <input
                type="text"
                id="supplier"
                name="supplier"
                class="form-control"
                placeholder="Enter Supplier"
                value="<%= dataInfo.supplier || '' %>"
              />
            </div>
          </div> -->

        </div>

        <div class="card-footer">
          <button type="submit" id="savebtn" class="btn btn-info">Speichern</button>
          <button type="button" class="btn btn-default">
            <a href="/products/list">Zurück</a>
          </button>
        </div>
      </div>
    </form>
  </div>
</div>

<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.6.1/jquery.min.js"></script>
<%- contentFor('pageStyleSection') %>
<link rel="stylesheet" href="/stylesheets/style.css" />
