programatically choose Select option in javascript

I’ve got an activeform with a select dropdown widget:


<?= $form->field($model, 'customer_id')->widget(Select2::className(), [

        'data' => ArrayHelper::merge(['' => 'none'], Customer::getFullNamesDropdown()),

        'options' => ['placeholder' => 'select customer'],

        'pluginOptions' => ['allowClear' => true],

    ]);

    ?>  

This produces the following HTML code:




<div class="form-group field-booking-customer_id">

<label class="col-sm-3 control-label" for="booking-customer_id">Customer</label>

<div class='col-sm-9'><div class="kv-plugin-loading loading-booking-customer_id">&nbsp;</div><select id="booking-customer_id" class="form-control kv-hide input-md" name="Booking[customer_id]" placeholder="select customer" style="width:100%" data-krajee-select2="select2_6789bf5d">

<option value=""></option>

<option value="1">Customer1</option>

<option value="2">Customer2</option>

</select></div>

<div class='col-sm-offset-3 col-sm-9'></div>

<div class='col-sm-offset-3 col-sm-9'><div class="help-block"></div></div>


</div>   

Now I need to set the selected value to a specific option using javascript. I tried:




document.getElementById("booking-customer_id").selectedIndex = customer_id; 



and




document.getElementById("booking-customer_id").value = event.customer_id;



Unfortunately this doesn’t work. Can anyone tell me how to fix this?

Thanks.