Плагин select2 js не работает должным образом на HTML-странице

Question

Я хотел бы загрузить данные при выборе раскрывающегося списка, для этого я использовал плагин select2 jQuery, но когда я использовал его на своей html-странице, он не работал, хотя в модальных режимах он работал нормально.

Мой кодэто:

HTML

<select class="form-control locationSelect select2-hidden-accessible" 
  id="locationid" name="locationid" style="width: 100%;">
                <?php if($asset['locationid'] != 0) { ?>
                    <option value="<?php echo $asset['locationid']; ?>">
                        <?php echo 
 getSingleValue("locations","name",$asset['locationid']) ; ?></option>
                 <?php } else { ?>
                    <option value="0"><?php _e('None'); ?></option>
                <?php } ?>
  </select>

AJAX

<script>
$('.locationSelect').select2({

        ajax: {
            url: "index.php",
            dataType: 'json',
            data: function (params) {
              return {
                q: params.term, // search term
                qa: 'locationSelect',
                filterid: clientid
              };
            },
            processResults: function (data,params) {
                return {
                    results: $.map(data, function(obj) {
                        return { id: obj.id, text: obj.text };
                    })
                };
            },
            //cache: true,
        },
        minimumInputLength: 0,
        placeholder: "<?php _e('Please Select'); ?>",
    });
</script>

Мне нужно руководство, есть ли другой способ использовать это в HTML-странице