Reload Table Withour Refresh (Ajax Call)

In on of my views I have a dropdownlist with some value, depending on each value I want to load a different table without the need of reload the entire page.

In my view I have something like this:





$js='

		function loadPublisher(e){

			var dataString = "id="+e.val();

			$.ajax

			({

				type: "GET",

				url: "",

				data: dataString,

			});

		}

		';	

		$this->registerJs($js, View::POS_READY);


<div id="main">

	<?= Html::dropDownList('dropPublishers', NULL, ArrayHelper::map($publishers, 'id', 'name'), ['class' => 'form-control col-md-3', 'style'=>'width:auto;', 'onchange'=>'loadPublisher($(this));' ]) : '';  ?>

</div>

<div id="tableToUpload">

<?= $this->renderAjax('_socialTable', [

     'publishers' => $publishers, 

]) ?>

</div>




In my controller I have this:




if(Yii::$app->request->isAjax){		

        return $this->renderAjax('_socialTable', [

			'publishers' => $publishers, 


        ]);

}else{

 return $this->render('index', [

			'publishers' => $publishers, 


        ]);

}



This doens’t work, I’m not understanting the implementation of renderAjax and how to update a portion of the page without refresh the entire page.

Your Ajax call needs the ‘success’ parameter (and a URL) to load the data where you want it:




    success: function(data){

                jQuery("#content").html(data);

	     }