Update postcode concerns

- Change filename to postcode-concerns.js
- Refactor postcode-concerns.js implementations
- Make daerah input and select2-daerah element changed dynamically
  according to requirements (if no postcode detail found, select2-daerah
  will be renndered and vice-versa)
This commit is contained in:
afiq.hamzah
2023-03-05 16:44:16 +08:00
parent 7b79496ccc
commit c1d122139b
2 changed files with 172 additions and 32 deletions
+32 -32
View File
@@ -132,9 +132,11 @@
<div class="col-md-4">Poskod</div>
<div class="col-md-8"><input class="form-control" type="text" name="poskod" id="poskod" autocomplete="off" placeholder="Poskod"></div>
<div class="col-md-4">Daerah</div>
<div class="col-md-8" style="display: none;"><input class="form-control" type="text" name="daerah" id="daerah" autocomplete="off" readonly required></div>
<div class="col-md-8" style="display: none;">
<input class="form-control" type="text" name="daerah" id="daerah" autocomplete="off" readonly required>
</div>
<div class="col-md-8">
<select class="select2-daerah form-control" name="select-daerah" id="select-daerah" data-placeholder="Pilih daerah" style="width: 100%;" readonly disabled></select>
<select class="select2-daerah form-control" name="select-daerah" id="select-daerah" data-placeholder="Sila pilih daerah" style="width: 100%;" readonly disabled></select>
</div>
<div class="col-md-4">Negeri</div>
<div class="col-md-8"><input class="form-control" type="text" name="negeri" id="negeri" autocomplete="off" readonly required></div>
@@ -269,7 +271,12 @@
<div class="col-md-4">Poskod</div>
<div class="col-md-8"><input class="form-control" type="text" name="poskod" id="poskod" autocomplete="off" placeholder="Poskod"></div>
<div class="col-md-4">Daerah</div>
<div class="col-md-8"><input class="form-control" type="text" name="daerah" id="daerah" readonly autocomplete="off" required></div>
<div class="col-md-8">
<input class="form-control" type="text" name="daerah" id="daerah" autocomplete="off" readonly required>
</div>
<div class="col-md-8" style="display: none;">
<select class="select2-daerah form-control" name="select-daerah" id="select-daerah" data-placeholder="Pilih daerah" style="width: 100%;" readonly disabled></select>
</div>
<div class="col-md-4">Negeri</div>
<div class="col-md-8"><input class="form-control" type="text" name="negeri" id="negeri" readonly autocomplete="off" required></div>
<div class="col-md-4">Umur</div>
@@ -391,7 +398,10 @@
<div class="col-md-4">Poskod</div>
<div class="col-md-8"><input class="form-control" type="text" name="poskod" id="passport_poskod" autocomplete="off" placeholder="Poskod"></div>
<div class="col-md-4">Daerah</div>
<div class="col-md-8"><input class="form-control" type="text" name="daerah" id="passport_daerah" autocomplete="off" readonly></div>
<div class="col-md-8" style="display: none;"><input class="form-control" type="text" name="daerah" id="passport_daerah" autocomplete="off" readonly required></div>
<div class="col-md-8">
<select class="select2-daerah form-control" name="select-daerah" id="select-daerah" data-placeholder="Pilih daerah" style="width: 100%;" readonly disabled></select>
</div>
<div class="col-md-4">Negeri</div>
<div class="col-md-8"><input class="form-control" type="text" name="negeri" id="passport_negeri" autocomplete="off" readonly ></div>
<div class="col-md-4">Umur</div>
@@ -557,8 +567,8 @@
let parent_modal = document.querySelector('#daftar_pelanggan');
if(Object.keys(poskod_detail).length === 0){
handlePoskodDetail_NotFound(parent_modal);
return;
handlePoskodDetail_NotFound_MyKad(parent_modal);
return;
}
var koddaerah = poskod_detail['koddaerah'];
@@ -578,7 +588,7 @@
}
});
handlePoskodDetail_Found(parent_modal);
handlePoskodDetail_Found_MyKad(parent_modal);
}
});
});
@@ -593,10 +603,10 @@
let parent_modal = document.querySelector('#daftar_pelanggan_mykad_reader');
if(Object.keys(poskod_detail).length === 0){
handlePoskodDetail_NotFound(parent_modal);
return;
}
if(Object.keys(poskod_detail).length === 0){
handlePoskodDetail_NotFound_MyKad(parent_modal);
return;
}
var koddaerah = poskod_detail['koddaerah'];
var kodnegeri = poskod_detail['kodnegeri'];
@@ -615,31 +625,12 @@
}
});
handlePoskodDetail_Found(parent_modal);
handlePoskodDetail_Found_MyKad(parent_modal);
}
});
});
$('#daftar_pelanggan_mykad_reader textarea#alamat').change(function(){
let modal = document.querySelector('#daftar_pelanggan_mykad_reader');
let input_poskod = modal.querySelector('input#poskod');
let input_daerah = modal.querySelector('input#daerah');
let input_negeri = modal.querySelector('input#negeri');
input_negeri.value = '';
input_daerah.value = '';
input_poskod.value = '';
input_poskod.readOnly = false;
input_daerah.readOnly = true;
input_negeri.readOnly = true;
input_poskod.focus();
});
$('#passport_poskod').change(function(){
var poskod = this.value;
@@ -647,6 +638,13 @@
method:'GET',
url:api_url+'/api/poskod/'+poskod,
success:function(poskod_detail){
let parent_modal = document.querySelector('#passport_pelanggan');
if(Object.keys(poskod_detail).length === 0){
handlePoskodDetail_NotFound_Passport(parent_modal);
return;
}
var koddaerah = poskod_detail['koddaerah'];
var kodnegeri = poskod_detail['kodnegeri'];
$.ajax({
@@ -663,6 +661,8 @@
$('#passport_daerah').val(daerah['namadaerah']);
}
});
handlePoskodDetail_Found_Passport(parent_modal);
}
});
});
@@ -1274,7 +1274,7 @@
</script>
<script src="{{ asset('js/iris-mykad-websocket-client-api.js') }}"></script>
<script src="{{ asset('js/mykad-reader-customer.js') }}"></script>
<script src="{{ asset('js/poskod-concerns.js') }}"></script>
<script src="{{ asset('js/postcode-concerns.js') }}"></script>
@endpush
@endsection