Populate id/text select2 with php's array data initialized in js with json_encode

Question

i was just introduced to select2, and in order to populate it i'm trying to use a php array and json encode it, but the results now is only showing the dropdown results as value=option text, i want to show the text and use the corresponding value for other operations, snaps of my code :

  $sqlGetUserList="My query here";
    $resultGetUserList = $conn->query($sqlGetUserList);

    <div id="cid_11" class="form-input-wide">      
       <select class="js-user-basic-single"  id="user"  name="user" required onchange="getUserPlan();" style="width:250px;" data-component="dropdown">
        <option value=''></option>
     <?php while ($rowGetUserList= mysqli_fetch_array($resultGetUserList)) {  
      $arr[]=$rowGetUserList['user_Id']; 
}  ?>
</select>

Now i retrieved the id that i want to set as the value="" of the option

My JS :

 var tempArrayID = <?php echo json_encode($arr); ?>;
$(".js-user-basic-single").select2({
  data: tempArrayID
})

Is there a way i can tell select2 that the value needed should be retrieved from the ID array, and the text is to be retrieved from a second array where i retrieve the string ?

Answer 1

I've used Jquery UI autocomplete/combobox instead, and it is perfectly working for my current needs! For more info : https://jqueryui.com/autocomplete/#combobox][1]