wms-app/app/inventory/manage_storage.php

<?php 
  session_start();
  require '../config.php';
  require '../include_header.php';

?>

<body>
  <?php require '../include_topbar.php';?>
  <?php require '../include_sidebar.php';?>


  <!-- MAIN CONTENT -->
  <main id="content" class="content py-15">
    <div class="container-fluid">
      <div class="row">
        <div class="col-12">
          <div class="d-flex flex-column flex-md-row justify-content-between align-items-md-center mb-5 gap-3">
            <div class="">
              <h1 class="fs-3 mb-1">Manage Storage</h1>
              <p class="mb-0">Manage your Storage items</p>
            </div>

          </div>
        </div>
      </div>
      <div class="row" id="storageForm">
        <div class="col-12">
          <div class="card">
            <div class="card-body p-6">
              <div class="row">
                <div class="col-md-6 mb-3">
                  <label for="warehouse" class="form-label">Warehouse</label>
                  <select class="form-select" id="warehouse" required> </select>
                </div>
                <div class="col-md-6 mb-3">
                  <label for="zone" class="form-label">Zone</label>
                  <input type="text" class="form-control" id="zone" placeholder="Enter zone" required>
                </div>
              </div>
              <div class="row">
                <div class="col-md-3 mb-3">
                  <label for="aisle_from" class="form-label">Aisle From</label>
                  <input type="text" class="form-control" id="aisle_from" placeholder="e.g. 1 or A" required
                    pattern="^([0-9]+|[A-Za-z])$" title="Enter a number (e.g. 1) or a single letter (e.g. A)">
                  <div class="form-text">Number (1–99) or letter (A–Z)</div>
                </div>
                <div class="col-md-3 mb-3">
                  <label for="aisle_to" class="form-label">Aisle To</label>
                  <input type="text" class="form-control" id="aisle_to" placeholder="e.g. 5 or E" required
                    pattern="^([0-9]+|[A-Za-z])$" title="Enter a number (e.g. 5) or a single letter (e.g. E)">
                  <div class="form-text">Must be same type as Aisle From</div>
                </div>
                <div class="col-md-3 mb-3">
                  <label for="rack_from" class="form-label">Rack From</label>
                  <input type="text" class="form-control" id="rack_from" placeholder="e.g. 1 or A" required
                    pattern="^([0-9]+|[A-Za-z])$" title="Enter a number (e.g. 1) or a single letter (e.g. A)">
                  <div class="form-text">Number (1–99) or letter (A–Z)</div>
                </div>
                <div class="col-md-3 mb-3">
                  <label for="rack_to" class="form-label">Rack To</label>
                  <input type="text" class="form-control" id="rack_to" placeholder="e.g. 10 or J" required
                    pattern="^([0-9]+|[A-Za-z])$" title="Enter a number (e.g. 10) or a single letter (e.g. J)">
                  <div class="form-text">Must be same type as Rack From</div>
                </div>
              </div>


              <div class="mb-3">
                <label for="description" class="form-label">Description</label>
                <textarea class="form-control" id="description" rows="4"
                  placeholder="Enter warehouse description"></textarea>
              </div>
              <div class="d-flex gap-2">
                <button type="submit" class="btn btn-primary" onclick="manage_storage();">Add Storage</button>
                <button type="reset" class="btn btn-secondary" onclick="reset_input('#storageForm')">Clear</button>
              </div>
            </div>
          </div>


        </div>

      </div>

    </div>

    </div>
  </main>

  <?php require "../include_ending.php";?>

  <script>
  function manage_storage() {

    // Validate that aisle from/to and rack from/to are same type
    var af = $('#aisle_from').val().trim().toUpperCase();
    var at = $('#aisle_to').val().trim().toUpperCase();
    var rf = $('#rack_from').val().trim().toUpperCase();
    var rt = $('#rack_to').val().trim().toUpperCase();

    var isNumeric = function(v) { return /^[0-9]+$/.test(v); };
    var isAlpha   = function(v) { return /^[A-Z]$/.test(v); };

    if (af && at) {
      if (isNumeric(af) !== isNumeric(at)) {
        alert('Aisle From and Aisle To must both be numbers or both be letters.');
        return;
      }
      if (isAlpha(af) && isAlpha(at) && af.charCodeAt(0) > at.charCodeAt(0)) {
        alert('Aisle From must be less than or equal to Aisle To.');
        return;
      }
      if (isNumeric(af) && isNumeric(at) && parseInt(af) > parseInt(at)) {
        alert('Aisle From must be less than or equal to Aisle To.');
        return;
      }
    }

    if (rf && rt) {
      if (isNumeric(rf) !== isNumeric(rt)) {
        alert('Rack From and Rack To must both be numbers or both be letters.');
        return;
      }
      if (isAlpha(rf) && isAlpha(rt) && rf.charCodeAt(0) > rt.charCodeAt(0)) {
        alert('Rack From must be less than or equal to Rack To.');
        return;
      }
      if (isNumeric(rf) && isNumeric(rt) && parseInt(rf) > parseInt(rt)) {
        alert('Rack From must be less than or equal to Rack To.');
        return;
      }
    }

    return ajax_request({
      url: "<?php echo $server_url?>inventory/api/engine/manage_storage.php",
      autoPrepare: true,
      checkRequired: 0,
      debugMode: 0,
      action: 'manage',
      onSuccess: function(res) {

        window.location.href = "<?php echo $server_url?>inventory/warehouse.php";

      }
    });

  }


  function retrieve_warehouse() {

    return ajax_request({
      url: "<?php echo $server_url?>inventory/api/engine/warehouse.php",
      autoPrepare: true,
      checkRequired: 0,
      action: 'read',
      onSuccess: function(res) {
        var option = ``;
        $.each(res.output, function(key, item) {
          option += `<option value='${item.id}'>${item.warehouse_name}</option>`;
        })
        $(`select#warehouse`).html(option);
      }
    });

  }


  function retrieve_for_edit() {

    return ajax_request({
      url: "<?php echo $server_url?>inventory/api/engine/retrieve_storage.php",
      autoPrepare: true,
      checkRequired: 0,
      action: 'read',
      onSuccess: function(res) {

        $.each(res.output, function(key, item) {
          $(`#${key}`).val(item);
        });

        $(`button[type=submit]`).text('Update Storage');

        $(`button[type=reset]`).hide();

      }
    });

  }



  $(async function() {
    try {
      await retrieve_warehouse();
      <?php if(!empty($_GET["id"])){ ?>
      await retrieve_for_edit();
      <?php } ?>
    } catch (e) {
      console.log(e);
    }
  });
  </script>


</body>

</html>