yii2 html a ajax,javascript - Yii2 Ajax DropDownList change content of div - Stack Overflow

I'm developing a application with Yii2 and I don't have to much knowledge of ajax. So I tried to use an example of W3Schools (http://www.w3schools.com/php/php_ajax_database.asp)

I want to make sort of a filter and I want to change the content of a div using a value from a DropDownList, here is the code of the view:

...

function showUser(str) {

if (str==="") {

document.getElementById("transactions").innerHTML="";

return;

}

if (window.XMLHttpRequest) {

// code for IE7+, Firefox, Chrome, Opera, Safari

xmlhttp=new XMLHttpRequest();

} else { // code for IE6, IE5

xmlhttp=new ActiveXObject("Microsoft.XMLHTTP");

}

xmlhttp.onreadystatechange=function() {

if (xmlhttp.readyState==4 && xmlhttp.status==200) {

document.getElementById("transactions").innerHTML=xmlhttp.responseText;

}

};

xmlhttp.open("GET",document.location.href="filter?by="+str,true);

xmlhttp.send();

}

<?php $this->head() ?>

Now the DropDownList:

=Html::dropDownList(

'test', //name

'b', //select

['' => 'Select Filter...', '1' => 'Exchanging Now', '2' => 'Last Exchanged', '3' => 'Last Offered', '4' => 'Last Discounted', '5' => 'Last Recieved', '6' => 'View All'],

['onchange'=> 'showUser(this.value)'])

?>

Well, the content of the div "transactions" it changes but, the it redirects to localhost/.../filter?by=x

How can I stop this redirect? In my controller I'm returning a string. Is that a problem?

--- EDIT ---

After some research I read about Pjax, I tried some tests and with a simple link and with works but can't do with the dropdownlist. Here is the changes on my code.

View:

=Html::a('TEST LINK', Url::to(['filter', 'by' => 1]), ['data-pjax' => 'transactions'])

?>

= Html::dropDownList(

'test', //name

'b', //select

['' => 'Select Filter...', '1' => 'Exchanging Now', '2' => 'Last Exchanged', '3' => 'Last Offered', '4' => 'Last Discounted', '5' => 'Last Recieved', '6' => 'View All'], //items

['onchange' => 'this.form.submit()'], ['data-pjax' => 'transactions']

)

?>

PjaxCode

StackOverflow dont let me put the code of Pjax, so I uploaded an image through a link

Controller - Just to show an example of what i'm returning:

public function actionFilter() {

$by= $_POST['test'];

$string = "";

if ($by == 1) {

return $string = self::searchPendingEvent();

}}

public function searchPendingEvent() {

$query = Event::findBySql("Select * from dot_events where (dot_event_to_user =" . Yii::$app->user->id . " "

. "and dot_event_type = 1 and dot_event_completed = 0) or ("

. "dot_event_type = 4 and dot_event_to_user =" . Yii::$app->user->id . " and dot_event_completed = 0)"

. " order by dot_datecreate DESC")->asArray()->all();

$string = "";

if ($query == null) {

$string .="Nothing to show :(";

} else {

for ($i = 0; $i < sizeof($query); $i++) {

$string.= self::formatEvent($query[$i]['dot_event_id']);

}

}

return $string;

}

public function formatEvent($id) {

if ($model['dot_event_type'] == 1 && $model['dot_event_to_user'] == Yii::$app->user->id) {

$string .= "

" . Functions::xTimeAgo($model['dot_datecreate'], date("c", time())) . "

";

$string .="

";

$string .="

";

$string .= "";

$string .=Html::a("You", ['user/profile']);

$string .="

";

$string .="

requested " . Html::a($profile[0]['full_name']);

$string .="to trade " . Html::a($tradeE['dot_cr_dots'] . " pts", ['dashboard/index']) . " from company ";

$string .=$company['dot_com_name'] . " for company" . $companyE['dot_com_name'];

$string .="

";

$string .="

";

}