Page 1 of 1

using php, mysql, autosuggest/complete to fill in text field

Posted: Mon Jul 09, 2007 4:43 pm
by Chaos at end
I need help with a mysql populated autosuggest textbox. I'm fairly new at this and have accomplished a working version using a

combobox, tho thats not what I want.

I have a working textbox using ajax-autocomplete with a succesfull mysql query.

I have a database called items with:
Id:
1
2
3
etc...

item:
item1
item2
item3
etc...

price:
100
200
300
etc.

What I need is, to place a autosuggest box on every line down a form, once the item selection has been made, it will autofill a std. text box to the right with a price for the item selected to be added up later down the page.

for example:
line 1, I want to select item1, once selected, the textbox to the right populates with $100
line 2, same thing, I select item3 and the textbox to the right populates with $300
and so on down the page.

I'll worry about the adding up of all the prices at the end later, I just need the above example working.
I've checked all over the web and could not find such a code as this except with a combobox(which I dont want-harder to search data). My only problem was I couldn't figure out how to implicate it on every line with there own variables.

If someone can help me put this code together, it will be greatly appreciated!!

Thanks in advance!

Chaos at end

Posted: Tue Jul 10, 2007 7:10 am
by superdezign
That seems like simple AJAX to me. Upon item selection just send out an AJAX request for that item's price. I'm not very experienced with AJAX, but I'm pretty sure that this is how it works.

Posted: Tue Jul 10, 2007 7:31 am
by Rovas
Find here a couple of links http://www.roscripts.com/Ajax_autosugge ... e-154.html a nice tutorial search Google for more

Posted: Tue Jul 10, 2007 11:17 am
by Chaos at end
feyd | Please use

Code: Select all

,

Code: Select all

and [syntax="..."] tags where appropriate when posting code. Your post has been edited to reflect how we'd like it posted. Please read:  [url=http://forums.devnetwork.net/viewtopic.php?t=21171]Posting Code in the Forums[/url] to learn how to do it too.[/color]


I went to those links before and found some good info,  tho this is the site I found my code [url]http://wiseguysonly.com/2006/04/14/ajax-autocompletion-for-the-impatient/[/url].

Including these scripts:
src="javascripts/prototype.js"
src="javascripts/effects.js"
src="javascripts/controls.js"

this is the autocompletion.php
[syntax="html"]
<html>
<head>

//js src code//

		<style>
	body {font-family: verdana; arial, sans-serif; font-size: 12px; }
	#div, ul { padding: 3px; width: 150px; font-family: verdana; arial, sans-serif; font-size: 12px;}
	ul { list-style-type: none; font-family: verdana; arial, sans-serif; font-size: 12px;  margin: 5px 0 0 0}
	li { margin: 0 0 5px 0; cursor: default; color: black;}
	li:hover { background: lightblue; }


	</style>	


	
</head>
<body>

<table border="0" align="center" valign="center""><tr><td align="left" valign="center">	
	<div>
		<input type="text" id="search1" name="search1" />
	</div>
	
	
	<div id="hint"></div>

<script type="text/javascript">	
		new Ajax.Autocompleter("search1","hint","server.php");

	</script>

	
</td>

<td>$
<input name="search1" value="//WHERE I NEED THE PRICE FILLED//">
</td>
</tr>


<tr>
<td align="left" valign="center">

	<div>
		<input type="text" id="search2" name="search2" />
	</div>
	
	
	<div id="hint"></div>

<script type="text/javascript">	
		new Ajax.Autocompleter("search2","hint","server.php");

	</script>

</td>

<td>$
<input name="search" value="<?php if (isset($_REQUEST['search2'])) echo $_REQUEST['price']; ?>">

// this does not seem to work(the search# should be the variable called right? or is the hint the variable??)//

</td>

</tr></table>

</body>
</html>
Where server.php is:[/syntax]

Code: Select all

$host = "host";
	$database = "database";
	$user = "user";
	$password = "password";

	mysql_connect($host,$user,$password);
	mysql_select_db($database);

	$sql = "SELECT * FROM tablename WHERE items LIKE '%" . $_POST['search'] . "%'";
	$rs = mysql_query($sql);

?>

<ul>

<? while($data = mysql_fetch_assoc($rs)) { ?>
  <li><? echo stripslashes($data['items']);?></li>
<? } ?>

</ul>
What I did find from the link to roscripts was a good discription on WHERE items like '%" .$POST[''] . "%'";
but If Im right that just calls up the words alike per word being typed. I need the once selected item# to put the price in the textbox to the right. I need to retrieve the selection under field items with the $'s under field price per the id#. I've searched all over using google in every word combination possible for the right explaination or example.

If anyone has anymore links, tested examples, or ideas, please let me know!

It will be greatly appreciated!
Thanks again in advance!

Chaos at end


feyd | Please use

Code: Select all

,

Code: Select all

and [syntax="..."] tags where appropriate when posting code. Your post has been edited to reflect how we'd like it posted. Please read:  [url=http://forums.devnetwork.net/viewtopic.php?t=21171]Posting Code in the Forums[/url] to learn how to do it too.[/color]

Posted: Tue Jul 10, 2007 1:12 pm
by Chaos at end
feyd | Please use

Code: Select all

,

Code: Select all

and [syntax="..."] tags where appropriate when posting code. Your post has been edited to reflect how we'd like it posted. Please read:  [url=http://forums.devnetwork.net/viewtopic.php?t=21171]Posting Code in the Forums[/url] to learn how to do it too.[/color]


Ok!! I've done a little research and found a js function.  

I added an id to the li in server.php:

Code: Select all

<ul>

<? while($data = mysql_fetch_assoc($rs)) { ?>
  <li id="<? echo $data['price'] ?>"><? echo stripslashes($data['items']);?></li>
<? } ?>

</ul>
Then added the js to autocomplete.php:

Code: Select all

<td>

	<div>
		<input type="text" id="search1" name="search1" />
	</div>
	
	
	<div id="hint"></div>

<script type="text/javascript">	
		new Ajax.Autocompleter("search1","hint","server.php", {afterUpdateElement : getSelectionId});

function getSelectionId(text, li) 
{
      alert (li.id); //works great as a popup and pulls the right info!!//
}	

	</script>

</td>

<td>$
<input name="search1" value"????">// BUT I NEED li.id TO DISPLAY IN TEXBOX //
</td>
Any Thoughts?

Thanks all in advance again!!

Chaos at end


feyd | Please use

Code: Select all

,

Code: Select all

and [syntax="..."] tags where appropriate when posting code. Your post has been edited to reflect how we'd like it posted. Please read:  [url=http://forums.devnetwork.net/viewtopic.php?t=21171]Posting Code in the Forums[/url] to learn how to do it too.[/color]

Posted: Tue Jul 10, 2007 2:36 pm
by RobertGonzalez
Keep in mind that throwing form/url data (POST, GET and worse, REQUEST) at your database without filtering them can have serious negative impact if your users decide to be XSS punks.