Autocompletar trunca los espacios entre palabras en el menú desplegable

I'm loading items as an array of variables for the auto complete to work. In source the items look like this:

'.12L    2 LB RYE', 
'.16G    6 GRAIN', 
'.16GR   6 grain roll', 
'.199    1-1\\2 LB WHITE', 
'.1BP    black pump', 
'.1CB    CLUB BREAD', 
'.1CL    CLUB fer.', 
'.1CLN   CLUB NEW', 
'.1CM    CLUB MEZONOS', 
'.1CRB   CORN BREAD',

Notice the first characters are the item code followed by the item description.

There is always the same amount of characters (including spaces) from the beginning of the the string until the first character of the item description. When I select an item, the text in the input shows up exactly the way it is in the array, but the drop down list only shows one space between the item code and item description. It appears jquery ui truncates the spaces between words to a maximum of one.

enter image description here

Is there a way for the drop down to show the exact amount of spaces that the original string has. I need to accomplish this so that the items look like they're in a table for readability. Any solutions or workaround would be much appreciated.

preguntado el 01 de febrero de 12 a las 04:02

2 Respuestas

Solved by adding this:

$('.ui-autocomplete').wrap(function() {
                    return '<pre class="spacing">' + $(this).text() + '</pre>';
                    });

The only problem is with letter spacing. Not all characters take up the same space so it looks a little off. But hey, one problem at a time.

Respondido 01 Feb 12, 09:02

Try replacing each space in each result to a non breaking space:

&nbsp;

Respondido 01 Feb 12, 08:02

tried that, but it shows it like this ".16GR&nbsp;&nbsp;&nbsp;6 grain roll" - boruchsiper

No es la respuesta que estás buscando? Examinar otras preguntas etiquetadas or haz tu propia pregunta.