Cjuiautocomplete

Hi there everybody.

This is my first post in this forum. I am in the process of learning this framework and am busy building a sample project just to get some insight into the functionality of this brilliant framework.

I do have a problem though that I’ve been trying to figure out for the last seven days but can’t seem to figure it out and I think I’m just being stupid.

What I want to achieve:

Search field with autocomplete dropdown function. I want to be able to type something into the search field and a dropdown should show with possible values. These values will be retrieved from table attribute fields in a MYSQL table. I would also like to have a dropdown-list next to the field which allows me to choose the category to search in. Once a value has been selected by mouse click the field should be populated with this value and upon a click of a search button the MYSQL database table should be queried and the browser redirected to the specific entry’s URL. The search will be done according to the autocompleted value as well as the category from the dropdown list

An example of what I’m trying to build is exactly similar to Amazon.com’s search field.

I have literally gone trough every tutorial and discussion I could find but could not even get the autocomplete from database working and I haven’t even considered the dropdown (category) menu or the search button. I really don’t know where to go next so I thought I would come look for some help here. The attributes that I need to use is breed(values represented in normal html dropdown menu with default set as All) and name(autocomplete field with autocomplete values retrieved from this database). A search button will then be clicked and a search would be executed in on the id associated with the name entered, thus search will not be done on the value itself. Thus needing a key and value combination (I guess using a hidden field).

Please help will really be appreciated. As I’ve indicated I have tried every tutorial and discussion available and couldn’t achieve success and I couldn’t even find one that would achieve exactly what I want to do.

Thank you in advance!!

Thank you very much for the reply. I have tried and failed the entire day (from South Africa so its nighttime over here already ). I have however found an extension that basically does what I want but I’m struggling with its implementation.

I have found a possible extension that I might use (maybe). This is the select2 extension.Please see the "Loading Remote Data" section in the demo to get an idea of what I want to do.

Now this is exactly what I want to do. With the images also in dropdown etc. I just want to add a search button that would allow users to navigate to a specific unit or category.

According to Documentation this code needs to be entered into view file in order to use data from model:

// Working with model

<?php $this->widget(‘ext.select2.ESelect2’,array(

‘model’=>$model,

‘attribute’=>‘attrName’,

‘data’=>array(

0=&gt;'Nol',


1=&gt;'Satu',


2=&gt;'Dua',

),

);

The problem is (as mentioned earlier) My AJAX skills aren’t on standard at all. I would thus really appreciate some help on executing an AJAX request whilst user is typing into the specific field i.e. returning key:value array to above data parameter via AJAX.

I assume this will be done in the specific controller?

I also thought that it would be more useful to have a categories dropdown limiting these AJAX requests to only a certain category with the default value being all. Thus a search possible values will only come from one attribute but it will be limited by values indicated in another attribute.

In effect this is what I want to do:

Ex.

1)Table (named dog) with Attributes: id, name, size and image (which is a path to image file)

  1. model, and CRUD functionality generated via gii

3)User of site should be able to select between small, medium and large in the categories dropdown or all sizes will be scanned as a default

4)User of site will search via name and autocomplete will dropdown as in example in previous post (all the possible names with picture on the left)

  1. User mouse-clicks on the item he wants and field gets filled with the name value.

  2. User now mouse-clicks search and a table search is done with the key array value (this value should be the id attribute from the table represented by the specific name chosen)

I hope this is a clear enough explanation. I have been able to achieve most of the other functionality of my practice site using Yii but this seems to be above my skill level. My next project would definetely be to maste jQuery and AJAX etc thus enhancing my Yii experience.