How to send multiple parameters in ajax call using post request in Yii2

Question

I have a view in which I have a detailview and a gridview. In my grid view there are check-boxes against all the columns. The detail view contains the model id. Now the case is simple, I want to select any column from the grid view and then on click of the a link button I want to send the ajax call, which includes the value of selected column and the model id, to my controller. Below is my view

<?= GridView::widget([
         'dataProvider' => $dataProvider,
          /*'filterModel' => $searchModel,*/

          'columns' => [

         ['class' => 'yii\grid\CheckboxColumn', 'checkboxOptions' => function($d) {
             return ['value' => $d['meter_id']];
         }],

         'Meter_Serial_Number',

         'Issued_To',
         'Store',
       ],
]); ?>
 <a href="<?= URL::toRoute(['ogpheader/viewsetpdf', 'id'=>$model->id])?>"  name="redirect" class="btn btn-primary" id="myid">Set PDF</a>

Now the javascript and the ajax call

<?php
$url = Url::toRoute(['/ogpheader/viewsetpdf','id'=>$model->id]);
$script = <<< JS
$(document).ready(function () {      

$('#myid').on('click',function() {


 var strValue = "";        
    $('input[name="selection[]"]:checked').each(function() {

    if(strValue!="")
        {
        strValue = strValue + " , " + this.value;

        }
    else 
        strValue = this.value;     

});
   // alert(strValue);
$.ajax({
     url: '$url',
     type: 'POST',
     data: {
           data: strValue,// also tired with {strValue:strValue id:id} but it did not worked for me as well              
     },         
     success: function(data) {
        alert(data);
     },
   });
  }) 
});
JS;
$this->registerJs($script, static::POS_END);
?>

Action Controller

public function actionViewsetpdf($id)
{
    $model = $this->findModel($id);
    print_r($_POST);
    $data = "";
    if(Yii::$app->request->isAjax)
    {
        $data = json_decode($_POST['data']);
        print_r($data);
    }
    else{
        echo 'no data';
    }
    exit();

}

The response i always got is Array ( ) no data. I have also looked into Passing two parameters in yii2 ajax request using jquery to a controller and Yii2 extra parameter ajax in controller but both seems to be helpful in my case.

Note:

As per my understanding the id is a get and strValue is post. So I am confused in both of them. May be I am wrong.

Update 1

Image quality is not that good

The response in Xhr is

array(1) {
  ["data"]=>
   array(1) {
     ["data"]=>
     string(26) "99 , 100 , 101 , 102 , 103"
    }
 }

Any help would be highly appreciated.

Answer 1

Prevent the default click event

$('#myid').on('click',function(e) {
  e.preventDefault();