jQuery autocomplete mysql zend no response from action/controller?

Question

Were using jquery autocomplete in zend and setup our action like this

public function ajaxautocompleteAction()
{
    $postData = $this->_request->getParams();
    $term = $postData['term'];
    $categoryObj = new Categories();
    $result = $categoryObj->searchCategory($term);
    $this->view->result = $result;
}

The javascript in the view file is this

    $(function() {
        var url = "http://www.domain.com/account/ajaxautocomplete?format=json";
        $( "#autotest" ).autocomplete({
            minLength: 2,
            source: function(request, response){
                var iterm = request.term;
                var url = "http://www.domain.com/account/ajaxautocomplete?format=json";
                $.post( url, {term: iterm},
                function( data ) {
            response(data); });
            }
    });
});

In chrome console i get this error

XMLHttpRequest cannot load http://www.domain.com/account/ajaxautocomplete?format=json. Origin http://domain.com is not allowed by Access-Control-Allow-Origin.

Any ideas why were not getting results from the ajax request?

Editing our url's to non wwww which is how their set in zend started to work, I see in chrome console "XHR finished loading:...." but no select list — Anagio
– Anagio, Commented Oct 12, 2011 at 17:38
chrome console shows XHR finished loading: "domain.com/account/ajaxautocomplete?format=json" it should have ?term=asdf being the letters I started to type but it's not picking that up, any ideas? — Anagio
– Anagio, Commented Oct 13, 2011 at 0:40

Phil · Accepted Answer · 2011-10-13 02:27:40Z

2

This is how I've used jQueryUI's autocomplete and ZF before...

Create your action

public function ajaxautocompleteAction()
{
    $term = $this->getRequest()->getParam('term');
    $categoryObj = new Categories();
    $result = $categoryObj->searchCategory($term);
    $this->view->result = $result;
}

Add an AjaxContext to your action, disabling automatic JSON serialisation. I'm skipping the auto serialisation as it's not common for your models to represent the usual "label" / "value" pairs jQueryUI's automcomplete looks for
```
public function init()
{
    $this->_helper->ajaxContext->addActionContext('ajaxautocomplete', 'json')
                               ->setAutoJsonSerialization(false)
                               ->initContext('json');
}
```

Create your JSON view (views/scripts/account/ajaxautocomplete.json.phtml)

<?php
$data = array();
foreach ($this->results as $category) {
    // format each result for jQueryUI autocomplete
    $data[] = array(
        'label' => $category->getName(),
        'value' => $category->getName()
    );            
}
echo Zend_Json::encode($data);

Add the URL for your autocomplete action as a JavaScript variable to the view that needs to use it (assuming you use the HeadScript helper in your layout)

$this->headScript()->prependScript(sprintf('var searchUrl = "%s";',
    $this->url(array(
        'action'     => 'ajaxautocomplete',
        'controller' => 'account'
    ), null, true)));

Setup your JavaScript like this

$("#autotest").autocomplete({
    source: searchUrl,
    minLength: 2
});

answered Oct 13, 2011 at 2:27

Phil

166k25 gold badges265 silver badges269 bronze badges

Sign up to request clarification or add additional context in comments.

2 Comments

Anagio Over a year ago

Thanks, are you able to get the row ID from your database and have the input set with that name/ID? And are you validating it with any code so users dont enter some value that's not coming from your db table?

Phil Over a year ago

In that case, I'd recommend using a standard Zend Form with select element and enhance it with the [Chosen plugin]( harvesthq.github.com/chosen)

TarasB · Accepted Answer · 2011-10-12 17:25:02Z

-1

looks like domain.com does not allow cross-domain calls.

Try chrome.exe --disable-web-security

edited Oct 12, 2011 at 17:25

answered Oct 12, 2011 at 17:17

TarasB

2,4381 gold badge25 silver badges32 bronze badges

2 Comments

Anagio Over a year ago

I don't think this is the answer there's no way all our website visitors are going to be doing this in chrome. And I don't see what file:// has to do with this? We're getting a list of categories from our mysql table, trying to turn it into an autocomplete through a zend action.

TarasB Over a year ago

please forget about 'file://', I edited answer earlier :) Of course you visitors will not setup chrome. It is your web server that does not allow this type of requests. Try adding in response header something like header("Access-Control-Allow-Origin: http://domain.com")

Collectives™ on Stack Overflow

jQuery autocomplete mysql zend no response from action/controller?

2 Answers 2

2 Comments

2 Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

2 Comments

2 Comments

Your Answer

Sign up or log in

Post as a guest

Related