Insert without refresh in yii2

Question

i am developing a web application using yii2 .i did a thumbs up and thumbs down buttons. it just insert the user and what the person choose up /down into a table . but i don't think i am going about it the right way because after the user clicks up or down it refreshes. i want it to insert without refreshing.

this is the view

       <?php $form = ActiveForm::begin(['id' => "contact-form",
            'enableClientValidation' => false,
            ]); 
          ?>
     <input type="hidden"  class="form-control"  value="up" required="true" name="Thumbs[rate]" id="topic" placeholder="topic">
     <?= Html::submitButton('Save', ['class' => 'btn btn-primary', 'name' => 'login-button']) ?>   
     <button type="submit" id="save" name="save">enter</button>  
     <?php ActiveForm::end(); ?>   

                 <?php $form = ActiveForm::begin(['id' => "contact-form",
        'enableClientValidation' => false,
        ]); 
      ?>
 <input  type="hidden" class="form-control" hidden="true" value="down" required="true" name="Thumbs[rate]" id="topic" placeholder="topic">
 <?= Html::submitButton('Save', ['class' => 'btn btn-primary', 'name' => 'login-button']) ?> 
     <?php ActiveForm::end(); ?>   

if you notice i seem to have kept the value of up and down in a input with type hidden. just want to know of a better way to do it.

this is my controller function

 public function actionBlog()
    { 
     $thumbs= new Thumbs(); 
       $thumbs->user=Yii::$app->user->identity->email;
          $thumbs->topic_id = '1';

        if ($thumbs->load(Yii::$app->request->post()) && $thumbs->validate()) {
        $thumbs->load($_POST);

         $thumbs->save();
          return $this->refresh();
     }

         return $this->render('blog');

    }  

i also tried to used ajax but it seems not to be working well

Answer 1

You can use Pjax for this.

Here is a simple example that you should be able to apply to your problem. I have included some comments for clarity, but I would heavily advise checking out this tutorial for further information and some extended examples.

View (vote.php):

<?php
use yii\widgets\Pjax;
use yii\helpers\Html;
use common\models\Thumbs;
?>

<?php Pjax::begin(['enablePushState' => false]); ?>
<?= Html::a('', ['site/upvote'], ['class' => 'btn btn-lg btn-warning glyphicon glyphicon-arrow-up']) ?>
<?= Html::a('', ['site/downvote'], ['class' => 'btn btn-lg btn-primary glyphicon glyphicon-arrow-down']) ?>
<h1><?= Thumbs::find()->where(['=', 'post_id', '1'])->one()->votes ?></h1>
<?php Pjax::end(); ?>

SiteController:

public function actionVote()
{
    return $this->render('vote');
}

public function actionUpvote()
{
    // find the thumbs record for the related post
    $thumbsRecord = Thumbs::find()->where(['=', 'post_id', '1'])->one();

    // increment the thumbs count
    $thumbsRecord->votes += 1;

    // ensure change persists to db
    $thumbsRecord->save();

    // return value to the view
    return $this->render('vote', [
        'votes' => $thumbsRecord->votes,
    ]);
}

/**
 * Similar functionality to actionUpvote
 */
public function actionDownvote()
{
    $thumbsRecord = Thumbs::find()->where(['=', 'post_id', '1'])->one();
    $thumbsRecord->votes -= 1;
    $thumbsRecord->save();
    return $this->render('vote', [
        'votes' => $thumbsRecord->votes,
    ]);
}

The model is just a table that contains the following fields:

• id (int, primary key)
• post_id (int)
• votes (int, default 0)