too long

Question

how to create the 'if-else' condition with the following ajax jquery:

<script type="text/javascript">
    $(document).ready(function () {
        $('select[name="org_id"]').on('change', function () {
            var stateID = $(this).val();
            if (stateID){
                $.ajax({
                    url: '<?php base_url();?>pasien_lama/dokter/'+stateID,
                    type: "GET",
                    dataType: "json",
                    success:function (data) {
                        $('select[name="person_id"]').empty();
                        $('select[name="person_id"]').append('<option >- Pilih Dokter -</option>');
                        $.each(data, function (key, value) {
                            $('select[name="person_id"]').append('<option value="'+ value.person_id +'">'+ value.person_nm +'</option>')
                        });
                    }
                });
            } else {
                $('select[name="person_id"]').empty();
            }
        });
    });
</script>

if not selected, the select option will return empty automatically

here is html code :

<label>Poli Tujuan</label>
                                <select class="form-control select2" name="org_id" style="width: 100%;">
                                    <option selected="selected">- Pilih Poli -</option>
                                    <?php foreach ($xocp_orgs as $nama_poli): ?>
                                    <option value="<?php echo $nama_poli['org_id']; ?>"><?php echo $nama_poli['org_nm']; ?></option>
                                    <?php endforeach; ?>
                                </select>


<label>Poli Dokter Spesialis</label>
                                <select id="imageSelector" class="form-control select2" name="person_id" style="width: 100%;" required>
                                    <option>- Pilih -</option>
                                </select>

Answer 1

Set the value for the default option to a empty string

<option selected="selected" value="">- Pilih Poli -</option>

change your if statement to

  if (stateID.length) {//

demo:

$('select[name="org_id"]').on('change', function () {
            var stateID = $(this).val();
            if (stateID.length){
               console.log('has values');
            } else {
               console.log('empty');
                $('select[name="person_id"]').empty();
            }
        });

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<label>Poli Tujuan</label>
<select class="form-control select2" name="org_id" style="width: 100%;">
  <option selected="selected" value="">- Pilih Poli -</option>
  <?php foreach ($xocp_orgs as $nama_poli): ?>
  <option value="<?php echo $nama_poli['org_id']; ?>">
    <?php echo $nama_poli['org_nm']; ?>
  </option>
  <?php endforeach; ?>
</select>


<label>Poli Dokter Spesialis</label>
<select id="imageSelector" class="form-control select2" name="person_id" style="width: 100%;" required>
  <option>- Pilih -</option>
</select>

</div>