Combo box

[GoogleCodeExporter]

Let's copy combobox feature from Mage to core ZP interface.

Any <SELECT> element with class='combobox' should have the same functionality 
as the combobox on magento.

Combobox is available on Mage w2p in from the latest beta version onwards.
http://code.google.com/p/magento-w2p/issues/detail?id=461
http://code.google.com/p/magento-w2p/issues/detail?id=598
http://code.google.com/p/magento-w2p/issues/detail?id=557

Install the extension and use cname.zetaprints.com to get templates.
See the issues above for the template ID with combobox flag enabled.

-----
In mage it relies on the flag to make the decision.
In ZP core you get the layout with the class name.

The goal is to have the same JS code working on both platforms. Give your 
opinion if this is possible and if it's actually a good idea.

Original issue reported on code.google.com by ad...@zetaprints.com on 29 Jun 2011 at 2:34

[GoogleCodeExporter]

You need following files:

* 
http://magento-w2p.googlecode.com/svn/trunk/js/zetaprints/zp-combobox-field.css
* http://magento-w2p.googlecode.com/svn/trunk/js/zetaprints/zp-combobox-field.js
* 
http://code.google.com/p/magento-w2p/source/browse/trunk/js/zetaprints/images/zp
-combobox-field/sprites.gif

Dependencies:

* jQuery
* Autocomplete component from jQuery UI

How to use combobox

Just invoke combobox() function on any select element

$('select.combobox').combobox()

All that you need is just to add additional CSS definitions. And point to a 
bugs if you find them.

Original comment by Anatoly....@gmail.com on 29 Jun 2011 at 4:07

[GoogleCodeExporter]

please test on this page 
http://realestate.zetaprints.com/Sample-Stationery/Dataset.htm

Original comment by hanl...@gmail.com on 30 Jun 2011 at 2:59

[GoogleCodeExporter]

1. remove external dependencies, upload them all to the dev site and list here 
so we can deploy them after testing.

2. Have you checked if it works with and without the skin?

3. The font in the dropdown is for some reason different from the font used in 
text boxes.

Original comment by ad...@zetaprints.com on 30 Jun 2011 at 6:21

[GoogleCodeExporter]

js files:
http://ec2-50-19-214-66.compute-1.amazonaws.com/js/jquery/jquery-ui-custom-min.j
s 
http://ec2-50-19-214-66.compute-1.amazonaws.com/js/jquery/jquery-qtip-min.js
http://ec2-50-19-214-66.compute-1.amazonaws.com/js/zetaprints/zp-combobox-field.
js
The above three files are combobox control and its dependencies.
http://ec2-50-19-214-66.compute-1.amazonaws.com/workspace/62/zp-combobox.js
This js file convert select control to combobox control
css files:
http://ec2-50-19-214-66.compute-1.amazonaws.com/js/zetaprints/zp-combobox-field.
css
This is css file used by combobox control
http://ec2-50-19-214-66.compute-1.amazonaws.com/workspace/62/zp-combobox.css
The above css itself does not format the control well, so we need this 
additional css

The font in the dropdown is formatted to use Verdana font by G-Skin, so it is 
different from the arial font in text box which is  formated by main.css. I do 
not set any font rules.

Original comment by hanl...@gmail.com on 30 Jun 2011 at 7:50

[GoogleCodeExporter]

tested without the skin, works

Original comment by hanl...@gmail.com on 30 Jun 2011 at 8:06

[GoogleCodeExporter]

Original comment by hanl...@gmail.com on 30 Jun 2011 at 9:17

• Changed state: ToTest

[GoogleCodeExporter]

1. Caching issue. Need to refresh the page to get it to appear. 
Printers/designers need to be informed otherwise they will scratch their heads 
wondering why the field is a drop-down and not a combobox.

2. The combobox field width should be same as the rest of the fields 
(combo_01.png).

Original comment by agur...@gmail.com on 30 Jun 2011 at 5:05

• Changed state: MoreWork

Attachments:

• combo_01.png

[GoogleCodeExporter]

Original comment by ad...@zetaprints.com on 1 Jul 2011 at 8:47

• Added labels: Period-201106

[GoogleCodeExporter]

+ 0.5U

Original comment by ad...@zetaprints.com on 4 Jul 2011 at 5:12

[GoogleCodeExporter]

1. No caching issue here. What browser has this issue?
2. fixed

Original comment by hanl...@gmail.com on 5 Jul 2011 at 2:06

[GoogleCodeExporter]

1. All browsers. Try assigning a combobox toa  field without refreshing the 
page (combobox_assign.png).

2. Test OK

4. The hint shows on top of the field (combo_hint_01.png) making it difficult 
to input the text. Make it show above it, just like it is in Magento 
(combo_hint_02.png).

Original comment by agur...@gmail.com on 5 Jul 2011 at 12:28

Attachments:

• combobox_assign.png
• combo_hint_01.png
• combo_hint_02.png

[GoogleCodeExporter]

1. fixed
4. fixed

Original comment by hanl...@gmail.com on 6 Jul 2011 at 1:48

[GoogleCodeExporter]

Original comment by hanl...@gmail.com on 6 Jul 2011 at 1:48

• Changed state: ToTest

[GoogleCodeExporter]

Original comment by agur...@gmail.com on 6 Jul 2011 at 6:57

• Changed state: TestOK