EVOLUTION-NINJA

Edit File: adddealer.php

<?php echo view('includes/sidebar'); ?>

<div class="row m-0">
        <div class="col-sm-12">
            <h1 class="crt-pjt">Add Dealer</h1>
        </div>
    </div>

<div id="successPopup" class="success-popup">
        <div class="popup-box">
            <div class="tick">✔</div>
            <p id="popupMessage">Success</p>
        </div>
    </div>

.fieldsbox {
            border-radius: 23px !important;
            padding: 5px 10px !important;
            height: 45px;
            width: 85%
        }

.projdetail {
            margin-inline: auto;
            margin-top: 15px;
        }

.textfields {
            border-radius: 14px;
        }

.projectinputs {
            width: 93% !important;
        }

@media (max-width:620px) {
            .fieldsbox {
                width: 100%
            }
            .projectinputs {
                width: 100% !important;
            }
        }

/* POPUP STYLE */
        .success-popup{
            display:none;
            position:fixed;
            top:0;
            left:0;
            width:100%;
            height:100%;
            background:rgba(0,0,0,0.5);
            justify-content:center;
            align-items:center;
            z-index:9999;
        }

.popup-box{
            background:#fff;
            padding:30px 40px;
            border-radius:12px;
            text-align:center;
        }

.tick{
            font-size:50px;
            color:green;
            margin-bottom:10px;
        }
    </style>

<form action="<?= base_url('add-dealer'); ?>" method="post">
        <div class="createproject">

<div class="row projdetail">

<div class="col-sm-4">
<label class="form-label inpfieldname">
    Dealer Name <span style="color:red">*</span>
</label>

</div>

<div class="col-sm-4">
   <label class="form-label inpfieldname">
    Mobile <span style="color:red">*</span>
</label>

</div>

<div class="col-sm-4">
       
<label class="form-label inpfieldname">
    Email <span style="color:red">*</span>
</label>
        <input type="email" name="email" class="form-control fieldsbox"
            placeholder="Enter Email" required>
    </div>

</div>

<div class="row projdetail">

<div class="col-sm-4" style="position:relative;">
   <label class="form-label inpfieldname">
    District <span style="color:red">*</span>
</label>

</div>

</div>

<div class="row projdetail">

</div>
    
    <div class="col-sm-4">

<label class="form-label inpfieldname">
    Contact Person <span style="color:red">*</span>
</label>

</div>

<label class="form-label inpfieldname">
    Contact Person Mobile <span style="color:red">*</span>
</label>

</div>
    
</div>

<div class="row projdetail">

<div class="col-sm-4">
        <label class="form-label inpfieldname">
            Address <span style="color:red">*</span>
        </label>

</div>

<div class="row projdetail">

<button type="button"
            class="cancel"
            onclick="this.form.reset();">
            Cancel
        </button>

</div>

</div>
    </form>

</section>

<script src="https://cdn.jsdelivr.net/npm/sweetalert2@11"></script>

<?php if(session()->getFlashdata('msg')): ?>
<script>
document.addEventListener("DOMContentLoaded", function () {

Swal.fire({
        icon: 'success',
        title: "<?= session()->getFlashdata('msg'); ?>",
        showConfirmButton: false,
        timer: 2000
    });

});
</script>
<?php endif; ?>

// All 31 Karnataka Districts
    let districts = [
        "Bagalkot",
        "Ballari",
        "Belagavi",
        "Bangalore Rural",
        "Bangalore Urban",
        "Bidar",
        "Chamarajanagar",
        "Chikballapur",
        "Chikkamagaluru",
        "Chitradurga",
        "Dakshina Kannada",
        "Davanagere",
        "Dharwad",
        "Gadag",
        "Kalaburagi",
        "Hassan",
        "Haveri",
        "Kodagu",
        "Kolar",
        "Koppal",
        "Mandya",
        "Mysuru",
        "Raichur",
        "Ramanagara",
        "Shivamogga",
        "Tumakuru",
        "Udupi",
        "Uttara Kannada",
        "Vijayapura",
        "Vijayanagara",
        "Yadgir"
    ];

$('#district').on('keyup', function () {

let value = $(this).val().toLowerCase();

let filtered = districts.filter(function(item) {
            return item.toLowerCase().startsWith(value);
        });

let suggestionBox = $('#districtSuggestions');

suggestionBox.empty();

if (value == '' || filtered.length == 0) {
            suggestionBox.hide();
            return;
        }

filtered.forEach(function(item) {

suggestionBox.append(
                '<div class="district-item" style="padding:8px; cursor:pointer;">'
                + item +
                '</div>'
            );

});

suggestionBox.show();

});

$(document).on('click', '.district-item', function () {

$('#district').val($(this).text());
        $('#districtSuggestions').hide();

});

$(document).click(function(e){

if(!$(e.target).closest('#district, #districtSuggestions').length){

$('#districtSuggestions').hide();

}

});

});
</script>

<?php echo view('includes/footer'); ?>