<!-- Village modal -->
<div class="modal fade" id="modal-village" tabindex="-1" aria-labelledby="exampleModalLabel" aria-hidden="true">
  <div class="modal-dialog">
    <div class="modal-content">
        <div class="modal-header">
            <h4 class="modal-title">Manage Village</h4>
            <button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button>
        </div>
        <div class="modal-body">
            <div id="village-ajax-result"></div>
        <form action="#" id="form-village">
            
            <input type="hidden" value="" name="village_id"/>
            <div class="mb-3">
                <label class="form-label">Name</label>
                <input class="form-control form-control-lg" type="text" name="village_name"  required />
            </div>
            <div class="mb-3">
                <label class="form-label">District</label>
                <select class="form-control select2" data-placeholder="Select a district" id="district-select" name="district_id" >
                <option value="">Select District</option>
                <?php if($districts): ?>
                    <?php foreach($districts as $district): ?>
                    <option value="<?= $district['district_id'] ?>"><?= $district['district_name'] ?></option>
                    <?php endforeach; ?>
                    
                    <?php endif; ?>
                </select>
            </div>

            <div class="mb-3">
                <label class="form-label">County</label>
                <select class="form-control select2" data-placeholder="Select a county" id="county-select" name="county_id" required>
                    <option value="">Select a County</option>
                </select>
            </div>

            <div class="mb-3">
                <label class="form-label">Sub-County</label>
                <select class="form-control select2" data-placeholder="Select a subcounty" id="subcounty-select" name="subcounty_id" required>
                    <option value="">Select a SubCounty</option>
                </select>
            </div>

            <div class="mb-3">
                <label class="form-label">Parish</label>
                <select class="form-control select2" data-placeholder="Select a parish" id="parish-select" name="parish_id" required>
                    <option value="">Select a Parish</option>
                </select>
            </div>
        </form>
        </div>
        <div class="modal-footer">
            <button type="button" class="btn btn-secondary" data-bs-dismiss="modal">Close</button>
            <button type="button" class="btn btn-primary" onclick="save_village()">Save</button>
        </div>
        </div>
        <!-- /.modal-content -->
    </div>
    <!-- /.modal-dialog -->
</div>
<!-- /Village modal -->