[jQuery] autocomplete

[rhythmicde...@gmail.com]

Hi all new to the group and jQuery in general.

I just installed the very cool autocomplete plugin yesterday and have
it working in the following scenarios:

$("#example").autocomplete(data);
Where data is a local string as shown in the examples.

$("#example").autocomplete('get_data.php');
Where the data is retrieved from a PHP page that calls a mysql
database.

Now I am trying to get it to work inside of an app built in CakePHP. I
have data as a JSON object with the following structure:

var data = {"17":"angel hair","16":"basmati
rice","21":"black beans"}

I thought that I could just pass this to autocomplete but nothing
happens. Meaning the autocomplete field does do anything at all on the
UI.

My question is: what is the correct way to handle a JSON object with
autocomplete? Do I need to enumerate the values into a string? That
seems a little hacky. Just looking for the correct methodology.

Thanks.

[jQuery] Noob

[rhythmicde...@gmail.com]

Hello,
 I have a table that has some form inputs in a single row. One of the
text inputs is an autocomplete that gets its data from a PHP variable.
I have all that working.

I have a button that clones this row and all its inputs incrementing
the IDs and then appending it to the table. That works fine.

The problem I am having is that I dont know how to attach the
autocomplete to the input in the new row.

I have pasted my code below. If you read it you can probably tell that
I ran into the same issue with the delete row button, but I got around
by using straight Javascript. But if I can solve how to attach to a
new element I can fix both problems.


Thanks in advance.
Steve



$(document).ready(function()
{
$('#add_recipe_row').click(function()
{
add_row('recipe_list', 'row_');
});

$('#add_ingredient_row').click(function()
{
add_row('ingredient_list', 'row_');
}
);

}); // ends document.ready


function add_row(tableID, rowIDprefix)
{

// Clone the last row of the table.
var clonedRow = $('#'+ tableID + ' tr:last').clone();

// Generate an incremented index for the new row. -1 because there is
a table header row
var newIndex = (document.getElementById(tableID).rows.length -1);

// Set the ID of the row with the new index
clonedRow[0].id = rowIDprefix + newIndex;

//console.log('ingredient_' + newIndex);
// Loop through all of the inputs and select in the cloned row
// Find the name and ID of the input/select element and find the
number in it abd replace it with the
// new index.
$.each($('input, select', clonedRow), function(i, val)
{
//console.log(val);

//console.log('Index -1: ' + (newIndex -1) + '. Index: ' +
newIndex);
val.name = val.name.replace((newIndex - 1), newIndex);
val.id = val.id.replace((newIndex - 1), newIndex);
val.value = '';

});

//alert($('td.delete_col', clonedRow).parent().get(0).id);

$('td.delete_col', clonedRow).html('delete');

// put the row into the table
$('#' + tableID).append(clonedRow);
}

function delete_row(rowID)
{
//alert(obj.parent().parent().get(0).id);
//var rowID = obj.parent().parent().get(0).id;

if(rowID == 'row_0')
{
alert('You cannot delete this row');
}
else
{
$("#"+rowID).remove();
}
}