I'm able to load custom options into the select but I don't know how to pre-select some of these options at page load

My UI field:

<field name="products">
    <argument name="data" xsi:type="array">
        <item name="options" xsi:type="object">vendor\Module\Model\Attribute\Source\SourceName</item>
          <item name="config" xsi:type="array">
          <item name="label" xsi:type="string" translate="true">Products</item>
          <item name="componentType" xsi:type="string">field</item>
          <item name="formElement" xsi:type="string">select</item>
          <item name="component" xsi:type="string">Magento_Ui/js/form/element/ui-select</item>
          <item name="elementTmpl" xsi:type="string">ui/grid/filters/elements/ui-select</item>
          <item name="dataScope" xsi:type="string">products</item>
          <item name="filterOptions" xsi:type="boolean">true</item>
          <item name="showCheckbox" xsi:type="boolean">true</item>
          <item name="disableLabel" xsi:type="boolean">true</item>
          <item name="chipsEnabled" xsi:type="boolean">true</item>
          <item name="multiple" xsi:type="boolean">true</item>
          <item name="levelsVisibility" xsi:type="number">1</item>
          <item name="sortOrder" xsi:type="number">10</item>
          <item name="required" xsi:type="boolean">true</item>

My options source class:

namespace vendor\Module\Model\Attribute\Source;

class SourceName implements \Magento\Framework\Option\ArrayInterface
  protected $productCollection;

    public function __construct(
    \Magento\Catalog\Model\ResourceModel\Product\Collection $productCollection
  ) {
    $this->productCollection = $productCollection;

  public function toOptionArray()

    // Load the products as options
    $products = $this->productCollection->load();
    $options = [];

    /* @todo: add query to load selected options */

    foreach ($products as $product){
      $options[] = [
        "value" => $product->getId(),
        "label" => $product->getSku()

    return $options;


enter image description here

Maybe using dataProviders? Can you provide some example to help me pre-select options ? Thanks

  • How you achieve dropdown with select in product edit page? – chirag dodia Sep 14 '18 at 7:54
  • @chiragdodia it's the ui-select component of Magento, my above code shows how to achieve it. showCheckbox = true will show the checkboxes – Manuel Di Iorio Sep 14 '18 at 16:51

enter image description here
Your loop working like this
public function toOptionArray() { $options = []; $options[] =
[ 'label' => 'New Tab', 'value' => '_blank' ];
$options[] = [ 'label' => 'Same Tab', 'value' => '_self' ]; $options[] = [ 'label' => 'test', 'value' => 'test' ] };

And Please add component like below
<field name="urltarget"> <argument name="data" xsi:type="array"> <item name="options" xsi:type="object">Vendor\Module\Model\Targetoptions</item> <item name="config" xsi:type="array"> <item name="dataType" xsi:type="string">text</item> <item name="label" xsi:type="string" translate="true">Slide Url Open In</item> <item name="formElement" xsi:type="string">select</item> <item name="source" xsi:type="string">sliders</item> <item name="sortOrder" xsi:type="number">5</item> <item name="dataScope" xsi:type="string">urltarget</item> </item> </argument> </field>


Solved by injecting the data into the form dataProvider:

$this->loadedData[$model->getId()]["products"] = ["1", "3"]; // array of ID strings

Use default argument in config

<item name="default" xsi:type="string">1</item>

Final Code:

<field name="storeview">
    <argument name="data" xsi:type="array">
        <item name="config" xsi:type="array">
            <item name="default" xsi:type="string">1</item>
  • I need to dinamically preselect multiple values of this multi-select – Manuel Di Iorio May 25 '18 at 12:01

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service, privacy policy and cookie policy

Not the answer you're looking for? Browse other questions tagged or ask your own question.