I work with the framework YII2 quite recently and for this reason I don’t know and do a lot of things. There are 3 tables in the database)

A table storing the name of the S_QUIZ_TOPIC theme with fields:

integer $ID_REC string $NAME_TOPIC integer $RANDOM integer $MAX_TIME string $DT_UP integer $STATUS 

Table storing questions S_QUIZ_QUESTION with fields:

 integer $ID_REC string $NAME_QUEST string $TEXT_QUEST string $MSG_QUEST integer $RANDOM string $DT_UP integer $STATUS 

And connecting these 2 tables S_QUIZ_TQ :

 integer $ID_REC integer $ID_TOPIC integer $ID_QUESTION string $DT_UP integer $STATUS 

The task is as follows:

It is necessary to implement 2 tables, one should list all the questions ($ NAME_QUEST field) that are in the S_QUIZ_QUESTION table, the second should list the questions that are included in this topic. Implement the transfer of data between these tables and save them in the database to the link table.

Made 2 tables in which the following data is displayed:

1) The left table displays a list of all questions from the table S_QUIZ_QUESTION .

2) The right table displays a list of questions that are included in this topic.

Listed data in the table as follows:

 <!-- Навигация --> <ul class="nav nav-pills nav-justified panel panel-primary" role="tablist"> <li class="active"> <a href="#questionintopik" aria-controls="questionintopik" role="tab" data-toggle="tab">Вопросы входящие в эту тему</a> </li> <li> <a href="#questioninexam" aria-controls="questioninexam" role="tab" data-toggle="tab">Вопросы входящие в экзамен</a> </li> </ul> <div class="tab-content"> <!--Вопросы входящие в эту тему--> <div role="tabpanel" class="tab-pane active panel panel-primary" id="questionintopik"> <div class="row"> <div class="col-lg-5"> <!-- Левая таблица --> <?php Pjax::begin(); ?> <h4>Вопросы не входящие в эту тему</h4> <input id="search-avaliable"> <a href="#" id="btn-refresh"> <span class="glyphicon glyphicon-refresh"></span> </a> <br> <?= Html::activeDropDownList($model, 'ID_REC', $LeftItems, ['multiple' => true, 'size' => 20, 'style' => 'width: 100%']) ?> <?php Pjax::end(); ?> </div> <div class="col-lg-1"> <!-- Кнопки --> <br><br><br><br><br><br><br><br><br><br> <a href="#" id="btn-add" class="btn btn-success">&gt;&gt;</a><br> <a href="#" id="btn-remove" class="btn btn-danger">&lt;&lt;</a> </div> <div class="col-lg-5"> <!-- Правая таблица --> <?php Pjax::begin(); ?> <h4>Вопросы входящие в эту тему</h4> <input id="search-assigned"><br> <?= Html::activeDropDownList($model, 'ID_REC', $RightItems, ['multiple' => true, 'size' => 20, 'style' => 'width: 100%']) ?> <?php Pjax::end(); ?> </div> </div> </div> </div> 

Now the question was, how do I implement the transfer of data between these tables? I can select any topic by clicking in the left table. But what should I do now, so that when I click on the corresponding keys, the selected question is transferred from the left table to the right table and saved to the database and vice versa?

Controller code:

 public function actionView($id) { $model = $this->findModel($id); $searchModel = new SQuizQuestionSearch(); $dataProviderLeft = $searchModel->search(Yii::$app->request->queryParams); $dataProviderRight = new ActiveDataProvider([ 'query' => $model->getQuestions(), ]); $LeftItems = ArrayHelper::map($dataProviderLeft->getModels(),'ID_REC','NAME_QUEST'); $RightItems = ArrayHelper::map($dataProviderRight->getModels(), 'ID_REC', 'NAME_QUEST'); return $this->render('view', [ 'model' => $model, 'searchModel' => $searchModel, 'dataProviderLeft' => $dataProviderLeft, 'LeftItems' => $LeftItems, 'dataProviderRight' => $dataProviderRight, 'RightItems' => $RightItems, ]); } 

Model code S_QUIZ_TOPIC:

 public function getSQUIZTQs() { return $this->hasMany(SQUIZTQ::className(), ['ID_TOPIC' => 'ID_REC']); } public function getQuestions() { return $this->hasMany(SQuizQuestion::className(), ['ID_REC' => 'ID_QUESTION'])->via('sQUIZTQs'); } 

S_QUIZ_QUESTION model code:

 public function getSQUIZTQs() { return $this->hasMany(SQUIZTQ::className(), ['ID_QUESTION' => 'ID_REC']); } public function getTopic() { return $this->hasMany(SQuizTopic::className(), ['ID_REC' => 'ID_TOPIC'])->via('sQUIZTQs'); } 

Model code S_QUIZ_TQ:

 public function getIDQUESTION() { return $this->hasOne(SQuizQuestion::className(), ['ID_REC' => 'ID_QUESTION']); } public function getIDTOPIC() { return $this->hasOne(SQuizTopic::className(), ['ID_REC' => 'ID_TOPIC']); } 

Picture how it looks: tables

  • You need to javascript'om, remove all id questions, enter them into another table and update the page, or this particular block by means of pjax - madfan41k

1 answer 1

Here is a redesigned view in which data movement between these tables is implemented:

 <div role="tabpanel" class="tab-pane active panel panel-primary" id="questionintopik"> <div class="row"> <!-- Таблица №1 --> <div class="col-lg-5"> <?php Pjax::begin(); ?> <h4>Вопросы не входящие в эту тему</h4> <input id="search-avaliable"> <a href="#" id="btn-refresh"> <span class="glyphicon glyphicon-refresh"></span> </a> <br> <?= Html::activeListBox($model, 'ID_REC', $LeftItems, ['multiple' => true, 'size' => 20, 'style' => 'width: 100%', 'id' => 'first']) ?> <?php Pjax::end(); ?> </div> <!-- Кнопки --> <div class="col-lg-1"> <br><br><br><br><br><br><br><br><br><br> <a id="btn-add" class="btn btn-success">&gt;&gt;</a><br> <a id="btn-remove" class="btn btn-danger">&lt;&lt;</a> <!-- Скрипты для кнопок --> <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> <script> $(function() { $(document).on('click', '#btn-add', function(event) { event.preventDefault(); var selected = $(document).find('#first option:selected'); if (selected.length > 0) { selected.appendTo('#second'); } }); $(document).on('click', '#btn-remove', function(event) { event.preventDefault(); var selected = $(document).find('#second option:selected'); if (selected.length > 0) { selected.appendTo('#first'); } }); }); </script> </div> <!-- Таблица №2 --> <div class="col-lg-5"> <?php Pjax::begin(); ?> <h4>Вопросы входящие в эту тему</h4> <input id="search-assigned"><br> <?= Html::activeListBox($model, 'ID_REC', $RightItems, ['multiple' => true, 'size' => 20, 'style' => 'width: 100%', 'id' => 'second']) ?> <?php Pjax::end(); ?> </div> </div> </div>