Zend Framework 3 dependent dropdown using AJAX, JQuery, JSON

Previous Topic Next Topic
classic Classic list List threaded Threaded
1 message Options
Reply | Threaded
Open this post in threaded view

Zend Framework 3 dependent dropdown using AJAX, JQuery, JSON

This post has NOT been accepted by the mailing list yet.
I have two dynamically created form element select.
I want to send first dropdown selected id from View to Server, and server should return an array ['id' => 'models'] that should fill second dropdown

class quickSearchCarForm extends Form{
$makerSelect = new Element\Select('maker');
$makerSelect->setLabel('Maker and Model');
$list = $this->vehiclesManager->getArrayMakers(1);
$makerSelect->setAttributes(['onchange' =>
'FillSelectModels(this.value)','id' => 'makerfield']);
$makerSelect->setEmptyOption('Select Maker..');

----on My Action

public function indexAction()
$formCar =new quickSearchCarForm($this->vehiclesManager);
$request = $this->getRequest();  
$response = $this->getResponse();
    if ($request->isXmlHttpRequest()) {
        $idMarca = $this->params()->fromRoute('id');
        $arrayModels = $this->vehiclesManager->getArrayModelos($idMarca,
        return $response->setContent(json_encode($arrayModels));
----On My View I've Tried with JQuery but with no success

function getModelos(id) {
                dataType: 'json',
                data: data,
                success: function(data){
I've tried with AJAX, but the only thing that happens is: the values of other form elements goes to my #modelfield (ex: makers, year, fuel..)

function getModels(id) {
            var xhttp = new XMLHttpRequest();
            xhttp.onreadystatechange = function() {
              if (this.readyState === 4 && this.status === 200) {
              document.getElementById("modelfield").innerHTML =
            xhttp.open("POST", "index/" + id, true);
Could you please give some help?