src/FormField/Lookup.php
public function createFilterJsDropdown()
    {
        foreach ($this->filters as $k => $filter) {
            $f_name = $this->name.'-ac_f'.$k;
            $chain = new jQuery('#'.$f_name);
            $options = [
                'fields'       => ['name' => 'name', 'value' => 'id'],
                'match'        => 'value',
                'apiSettings'  => ['url'         => $this->getCallbackURL().'&q={query}',
                                  'cache'        => false,
                                  'data'         => array_merge($this->getFilterQuery(), ['filter' => $filter['field']]),
                                  'onResponse'   => new jsFunction(['resp'], [
                                      new jsExpression('if (!resp.success){atk.apiService.atkSuccessTest(resp);}'),
                                  ]),
                ],
                'onChange'    => new jsFunction([
                                                    (new jQuery())->trigger('filterChanged'),
                                                    $this->getJsDropdown(),
                                                ]),
            ];

            $this->js(true, $chain->dropdown($options));
        }
        //set filter value using $(this) context for onChange handler instead of filter name.
        $options['apiSettings']['data']['filter'] = (new jQuery())->find('input')->attr('name');
        $this->filterChain = $options;
    }
public function createFilterJsDropdown()
    {
        foreach ($this->filters as $k => $filter) {
            $f_name = $this->name.'-ac_f'.$k;
            $chain = new jQuery('#'.$f_name);
            $options = [
                'fields'       => ['name' => 'name', 'value' => 'id'],
                'match'        => 'value',
                'apiSettings'  => ['url'         => $this->getCallbackURL().'&q={query}',
                                  'cache'        => false,
                                  'data'         => array_merge($this->getFilterQuery(), ['filter' => $filter['field']]),
                                  'onResponse'   => new jsFunction(['resp'], [
                                      new jsExpression('if (!resp.success){atk.apiService.atkSuccessTest(resp);}'),
                                  ]),
                ],
                'onChange'    => new jsFunction([
                                                    (new jQuery())->trigger('filterChanged'),
                                                    $this->getJsDropdown(),
                                                ]),
            ];

            $this->js(true, $chain->dropdown($options));
        }
        //set filter value using $(this) context for onChange handler instead of filter name.
        $options['apiSettings']['data']['filter'] = (new jQuery())->find('input')->attr('name');
        $this->filterChain = $options;
    }
public function createFilterJsDropdown ( ) { foreach ( $ this -> filters as $ k => $ filter ) { $ f_name = $ this -> name . '-ac_f' . $ k ; $ chain = new jQuery ( '#' . $ f_name ) ; $ options = [ 'fields' => [ 'name' => 'name' , 'value' => 'id' ] , 'match' => 'value' , 'apiSettings' => [ 'url' => $ this -> getCallbackURL ( ) . '&q={query}' , 'cache' => false , 'data' => array_merge ( $ this -> getFilterQuery ( ) , [ 'filter' => $ filter [ 'field' ] ] ) , 'onResponse' => new jsFunction ( [ 'resp' ] , [ new jsExpression ( 'if (!resp.success){atk.apiService.atkSuccessTest(resp);}' ) , ] ) , ] , 'onChange' => new jsFunction ( [ ( new jQuery ( ) ) -> trigger ( 'filterChanged' ) , $ this -> getJsDropdown ( ) , ] ) , ] ; $ this -> js ( true , $ chain -> dropdown ( $ options ) ) ; } //set filter value using $(this) context for onChange handler instead of filter name. $ options [ 'apiSettings' ] [ 'data' ] [ 'filter' ] = ( new jQuery ( ) ) -> find ( 'input' ) -> attr ( 'name' ) ; $ this -> filterChain = $ options ; }
For each filters, we need to create js dropdown and setup proper api settings.

When changing value on any of the filter we need to set main dropdown
apiSettings again in order for main dropdown to send proper filter value.
This is done via the onChange function of the dropdown filter.

This function will generate js similar to this:
$("#filterName1").dropdown({
"fields":{
"name":"name",
"value":"id"
},
"apiSettings":{
"url":"autocomplete.php?atk_admin_form_generic_country2_callback=ajax\x26__atk_callback=1\x26q={query}",
"cache":false,
"data":{"filter":"city"}
},
"onChange":function() {
$("#mainDropdown").dropdown(
{"fields":{"name":"name","value":"id"},
"apiSettings":{"url":"autocomplete.php?atk_admin_form_generic_country2_callback=ajax\x26__atk_callback=1\x26q={query}",
"cache":false,
"data":{"filteName1":$("input[name=filteName1]").parent().find(".text").text(),"filteName2":$("input[name=filteName2]").parent().find(".text").text()}
}
});
}});

@throws \atk4\ui\Exception
For each filters we need to create js dropdown and setup proper api settings .