[jQuery] Add items to list, is this a proper approach?

2009-06-19 Thread maubau

I'm trying to create a list, to which you can:

1. add and remove items.
2. according to what's in this list, there should be dynamic content
loaded on to the page.

I've accomplished 1 with the code below. I'm not sure about how to
accomplish 2. If anyone could point me in the right direction (and
give comments on my approach on 1 - I'm new to jQuery) it would be
greatly appreciated


script language=javascript

var listItems = new Array();
var currentList = new String();

function listManager(task, id, name) {
//$(#debug).append(p # List manager. (+listItems.length+
items) # br);

if(task == add) {
refreshList(); // refresh the list
listItems.push(name); // add to array first, new item to 
listItems
array
//$(#debug).append(pAdded item: +name+. List has now:
+listItems.length+ items./p);
newItem = getHTMLitem(id, i, name); // the new item to add - 
make it
html
currentList = oldList + newItem; // add the string to current 
list
}

if(task == delete) {
listItems.splice(id, 1); // delete from array
//$(#debug).append('Delete nr: '+id+'br');
refreshList(); // refresh the list
}

$(#list).html(currentList); // output the list
//$(#debug).append(-- Done. (+listItems.length+ items) /
p);
}

function refreshList() {
oldList = ;
for(i=0; ilistItems.length; i++) { // iterate through existing
listItems to give them new nr
listItem = getHTMLitem(id, i, name);
oldList += listItem; // add items to list string
}
currentList = oldList;
}

function getHTMLitem(id, i, name) {
return lia href=\#\ id=\+id+\ onClick=\listManager
('delete', '+i+')\+name+/a/li; // the string to add
}


$(function() {

$(#input).keyup(function(event){
$.get(test.php, { search: this.value },
function(data){
$(#suggest).html(data);
});
});

});

/script

input name=input id=input type=text autocomplete=off /
input type=submit /

br /
div id=suggest/div

h2Added/h2
ul id=list/ul

hr /
div id=debug/div

hr /



My test.php contains:

if($_GET['search']) {
$result = $db-query(SELECT * FROM table WHERE name LIKE '%.$_GET
['search'].%');
if(DB::isError($result)) die($result-getMessage());

echo ul;
while($row = $result-fetchRow(DB_FETCHMODE_ASSOC)) {
echo lia href=\#\ onclick=\listManager('add', '.$row
['id'].', '.$row['name'].');\ . $row['name'] . /a/li \n;
}
echo /ul;
}


[jQuery] Re: Add items to list, is this a proper approach?

2009-06-19 Thread maubau

On 19 Juni, 17:23, Charlie charlie...@gmail.com wrote:
 according to what's in this list.
 no way to see from here what's in your list, what you want to look for or 
 what you want to do once you find( or don't find) what you are looking for


I'll try to explain it a bit better.

On the input field, as you type something a list appears with
suggestions which are gotten from a database (via test.php). It's like
a simple autosuggest. You add these items/suggestions to a list (from
where you also can remove them by clicking on them). This works in the
code above, althought I'm not sure I have a good approach.

Now, the rest of the code isn't written since I'm not sure on how to
do this yet. What I want to do with the list is to be able to get
different data from the database, displayed on the same page,
depending on what items that are on this list.

Although it is not what this is, it could be thought of a add to
cart, with the product info showing in the cart. All on the same
page.

The function listManager() is what adds and removes the items from the
list. It puts a list item to the ul id=list. The list becomes
something like this:

h2Added/h2
ul id=list
lia href=# id=1 onClick=listManager('delete', '1')Item 1/
a/li
lia href=# id=2 onClick=listManager('delete', '2')Item 2/
a/li
/ul

I appreciate any help. Thanks!