Problem updating dynamically ActiveForm values with Ajax + RenderPartial/Ajax

Question

Solution

Since the php is not going to be re-executed someone told me to use a return value from the controller as a parameter of the "success" function into ajax's request.
**CONTROLLER**

if(Yii::$app->request->isAjax){
        $query = new \yii\db\Query();
        $rows = $query->select([])
            ->from('task')
            ->where('date(start) <= date(\'' . $this->request->getBodyParam('start_date') . '\')')
            ->all();
        $items = "";

        foreach (ArrayHelper::map($rows,'id','name') as $key => $value)
            $items .= '<option value="'. $key .'">'. $value .'</option>\n';
        //<option value="16">test</option> example output
        echo $items;
    }

VIEW

$this->registerJs("$('#task-start').on('change',function(){
            $(\".btn, .btn-success\").prop(\"disabled\",true);
            var date = $(this).val();
            $.ajax({
                url: \"".Yii::$app->request->baseUrl."/task/create\",
                data: {start_date: date},
                type: \"post\",
                success: function(dependency_options){ 
                //dependency_options contains what's returned with 'echo' from the controller  
                $('#task-dependencies').find('option:not(:first)').remove();
                    $('#task-dependencies').append(dependency_options);
                    $(\".btn, .btn-success\").prop(\"disabled\",false);
                },
                error: function () {
                console.log('ERROR')
                $(\".btn, .btn-success\").prop(\"disabled\",false);
                }
            });
    });",View::POS_READY);

Hoping this might help someone.

My problem

I have a DropDownList with no elements and I want to update the list with elements coming from a Query whenever the user changes the datepicker without refreshing the page.

An example of something similar to this would be those forms in which you type your region and it changes the dropdownlist based on what you choose on the field before.

Maybe I'm using a wrong approach to this cause I'm still new to the MVC model and the Yii2 framework so any idea on how to change it's well appreciated.

What I've tried

With this code below as is I had issues cause after the form was created the first time I could not change it later, I've tried to change the html, as you can see from the script in the success ajax function of the View but the script was executed only the first time the view was loaded.

Controller calling the render

public function actionCreate()
    {
        $model = new Task();
        if(Yii::$app->request->isAjax){
            $query = new \yii\db\Query();
            $rows = $query->select([])
                ->from('task')
                ->where('date(start) <= date(\'' . $this->request->getBodyParam('start_date') . '\')')
                ->all();
            $items = ArrayHelper::map($rows,'id','name');
            $model->setItems($items);

            return $this->renderPartial('_form',[
                'partial' => true,
                'model' => $model
            ]);
        }
        else if ($this->request->isPost) {
            ..unnecessary code..
        return $this->render('create', [
            'model' => $model,
        ]);
    }

The view "create" basically renders the view _form (autogenerated by Gii)

View _form

<?php
//Here it takes the items in the model
//(which will contain the new items to append after ajax call)
$objects = json_encode($model->getItems() ?? []); 
var_dump($model->getItems() ?? []);

//Here whenever the datepicker is change will fire ajax request
$this->registerJs("$('#task-start').on('change',function(){
        var date = $(this).val();
        var items = ". json_encode($model->getItems() ?? []) .";
        alert(items);
        $.ajax({
            url: \"".Yii::$app->request->baseUrl."/task/create\",
            data: {start_date: date},
            type: \"post\",
            success: function(){
                //$('#task-dependencies').find('option:not(:first)').remove();
                $.each(items, function(key, value) {
                    $('#task-dependencies')
                      .append($('<option>', { value : key })
                      .text(value));
                });
            },
            error: function () {
            console.log('ERROR')
            }
        });
});",View::POS_READY);
?>

<?php $form = ActiveForm::begin(); ?>

    <?= $form->field($model, 'start')->widget(\kartik\date\DatePicker::className(), [
        ...datepicker that triggers onChange...
    ]) ?>

    //The dropdownlist that should dynamically change
    <?= $form->field($model, 'dependencies')->dropDownList(
            $model->getItems(),
            ['prompt' => 'Seleziona una o più dipendenze', 'multiple' => true, 'selected' => 'selected']    // options
        );
    ?>

    <?php ActiveForm::end(); ?>

</div>

<script src="https://cdn.jsdelivr.net/npm/[email protected]/dist/jquery.min.js" integrity="sha256-/xUj+3OJU5yExlq6GSYGSHk7tPXikynS7ogEvDej/m4=" crossorigin="anonymous"></script>
<link rel="stylesheet" href="https://use.fontawesome.com/releases/v5.3.1/css/all.css">

Answer 1

That seems that this approach is similar. https://docs.microsoft.com/en-us/microsoft-365/education/deploy/design-multi-tenant-architecture. I'm studding for create a similar architecture, but i will use the "silo" model or "physical database". I think that at first you need to create a internal database called "catalog" that will contains the information of the user (this user already have a login? if true select this information) where have to contains a previous credentials how tenant-id. About the Sequelize, i guess that is necessary to use RAW queries for create ROLE|GRANT|DATA BASE etc and the MIGRATIONS to create the same DB for each new clients.