diff --git a/app/Views/job_card_form.php b/app/Views/job_card_form.php
index 965c709..02118e6 100755
--- a/app/Views/job_card_form.php
+++ b/app/Views/job_card_form.php
@@ -88,7 +88,7 @@
                     <div class="form-row">
                         <div class="form-group col-md-6">
                             <label for="inputEmail4" class="col-form-label">Type<span class="text-danger">*</span></label> 
-                                <select class="form-control type-select SelExample" name="type" id="type" data-toggle="select2" required>
+                                <select class="form-control type-select " name="type" id="type" data-toggle="select2" required>
                                     <option value="" <?= (isset($jobs['type']) && $jobs['type'] == '') ? 'selected' : '' ?>>Select Type</option>
                                     <option value="General" <?= (isset($jobs['type']) && $jobs['type'] == "General") ?'selected' : '' ?>>General</option>
                                     <option value="Complaints" <?= (isset($jobs['type']) && $jobs['type'] == "Complaints") ? 'selected' : '' ?>>Complaints</option>
@@ -833,12 +833,15 @@ $(document).ready(function() {
             var jc_id = "<?php echo $jobs['job_card_id'] ?? 0 ?>";
             console.log("Job Card ID:", jc_id);
             
-            if(jc_id == 0) {
-                $('.type-select').prop('disabled', false);
+            if (jc_id == 0) {
+                $('.type-select').prop('readonly', false).off('mousedown'); // Enable
             } else {
-                $('.type-select').prop('disabled', true);
+                $('.type-select').prop('readonly', true).on('mousedown', function (e) {
+                    e.preventDefault(); // Prevent opening the dropdown
+                });
             }
 
+
         $('.type-select').change(function() {
             $('#productItemTable tbody').empty();
             $('.vehicle-select').val('').select2();