Pedro Chagas
asked on
Ajax, get information from database and show in the browser
Hi E's, my knowlgment in Ajax is very poor, usually I use HTML and php for made my websites.
Now I need to resolve a problem with Ajax, and maybe this step was my beginning in Ajax.
In snippet code I have a form, where I can put a number, and that number have a title correspondent in my database. If I write 1000 appear one title, if I write 1001 appear another title and so on....
That is what I want do in Ajax, the script have to read the database correspodent for that number, and present data in "<div id="config_titulos">HERE PUT THE INFORMATION COME FROM DATABASE/AJAX</div>".
The db query you see in the beginning of the code, is usually the code I use to get data from db, in this specific case "tutorial" is where located the number, and "title" is where is locates the data from title correspondent for each number.
How I do in Ajax the presentation of title for different numbers I put in the form?
The best regards, JC
Now I need to resolve a problem with Ajax, and maybe this step was my beginning in Ajax.
In snippet code I have a form, where I can put a number, and that number have a title correspondent in my database. If I write 1000 appear one title, if I write 1001 appear another title and so on....
That is what I want do in Ajax, the script have to read the database correspodent for that number, and present data in "<div id="config_titulos">HERE PUT THE INFORMATION COME FROM DATABASE/AJAX</div>".
The db query you see in the beginning of the code, is usually the code I use to get data from db, in this specific case "tutorial" is where located the number, and "title" is where is locates the data from title correspondent for each number.
How I do in Ajax the presentation of title for different numbers I put in the form?
The best regards, JC
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<noscript>
<META HTTP-EQUIV="Refresh" CONTENT="0;URL=index.php">
</noscript>
<? include("database.php");
// this is the way I usualy use to get data from database, in this case I get information from URL, but for this example can be any thing!
$tutorial_result = mysql_query("SELECT * FROM tutorial where tutorial = '$_GET[tutorial]'", $db);
$tutorial_rows = mysql_num_rows($tutorial_result);
$tutorial = mysql_fetch_object($tutorial_result);
?>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Novo Tutorial</title>
<style type="text/css" media="screen">
@import "index.css";
</style>
</head>
<body>
<div id="geral">
<div id="titulo">upload de ficheiros e pastas</div>
<div id="sub_titulo">verificação e preparação</div>
<div id="menu_links">
<a href="index.php" class="links">home</a> <a href="novo.php" class="links">novo</a> <a href="configuracao.php" class="links">configuração</a> <a href="lista.php" class="links">lista</a>
</div>
<div id="config_tecno">
<div id="config_titulos">insert number please:</div>
<div id="config_titulos">HERE PUT THE INFORMATION COME FROM DATABASE/AJAX</div>
</div>
<div id="form"><form action="PROCESS_INFORMATION.PHP" method="post" name="form1">
<input name="number" type="text" value="" size="10" maxlength="4" /><br />
<input name="button" type="submit" disabled value="send information to process" />
</form>
</div>
</div>
</body>
</html>
ASKER
Hi hiello, I don't test your solution because I am in my mobile phone.
In first view, I thing your code will create a table, and increment titles every time I put a number in the form, if I'm wrong, my apologizes! But if it is true, is not that I needed.
Supose I'm correct about your solution:
If I write in the form for example 1000, I present the title correspodent for that number, but if I erase from the form the number 1000 and write 1001 or other the system give me another title, in practice I just to see one title each time I write a number in the form. And that information have to be present in this line: "<div id="config_titulos">HERE PUT THE INFORMATION COME FROM DATABASE/AJAX</div>".
Can you please change your code?
The best regard, JC
In first view, I thing your code will create a table, and increment titles every time I put a number in the form, if I'm wrong, my apologizes! But if it is true, is not that I needed.
Supose I'm correct about your solution:
If I write in the form for example 1000, I present the title correspodent for that number, but if I erase from the form the number 1000 and write 1001 or other the system give me another title, in practice I just to see one title each time I write a number in the form. And that information have to be present in this line: "<div id="config_titulos">HERE PUT THE INFORMATION COME FROM DATABASE/AJAX</div>".
Can you please change your code?
The best regard, JC
line 46:
$('#config_titulos_data'). html(resul t);
overwrites the OLD content of config_titulos_data with the new content fetched from the ajax call. The ajax call is executed everytime a use types a new value and "leaves" the field.
On another note, on my first post, line 26 should be:
exit;
$('#config_titulos_data').
overwrites the OLD content of config_titulos_data with the new content fetched from the ajax call. The ajax call is executed everytime a use types a new value and "leaves" the field.
On another note, on my first post, line 26 should be:
exit;
...
else
{
$tutorial = mysql_fetch_assoc($tutorial_result);
echo PHP_EOL,'<table><thead><tr><th>',implode('</th><th>',array_keys($tutorial)),'</th></tr></thead><tbody>';
do{
echo PHP_EOL,'<tr><td>', implode('</td><td>',$tutorial) , '</td></tr>';
}while( $tutorial = mysql_fetch_assoc($tutorial_result) );
echo PHP_EOL,'</tbody></table>';
}
exit;//BE SURE TO add this line
}
...
ASKER
Hi @hielo, is that I wanted, very nice.
Like you can see in attach image, the ajax system show all fields for that number, and like I tell above (in first post) I just want the information of title, in real case was "titulo" (title in english and titulo in Portuguese).
Can you please change the code again?
The best regards, JC
02-11-2011-18-47-53.png
Like you can see in attach image, the ajax system show all fields for that number, and like I tell above (in first post) I just want the information of title, in real case was "titulo" (title in english and titulo in Portuguese).
Can you please change the code again?
The best regards, JC
02-11-2011-18-47-53.png
ASKER
For example put that information inside a string...
>>the ajax system show all fields for that numbe
That is because I "re-used" the query YOU posted. You posted:
SELECT * FROM ...
which will get you ALL the fields on the query.
>> I just want the information of title, in real case was "titulo"
Then all you need to do is to change your query to:
SELECT `titulo` FROM ...
That is because I "re-used" the query YOU posted. You posted:
SELECT * FROM ...
which will get you ALL the fields on the query.
>> I just want the information of title, in real case was "titulo"
Then all you need to do is to change your query to:
SELECT `titulo` FROM ...
ASKER
You have reason, but when I want see just the 'titulo' I do $tutorial->titulo;
I change the Select, and now I can see the titulo only.
Please how I can see only the contain of titulo. In attach image you can see, that I have the contain of titulo (that's good), but I have ti the title of the field, in this case is titulo too.
Regards, JC
02-11-2011-20-02-16.png
I change the Select, and now I can see the titulo only.
Please how I can see only the contain of titulo. In attach image you can see, that I have the contain of titulo (that's good), but I have ti the title of the field, in this case is titulo too.
Regards, JC
02-11-2011-20-02-16.png
ASKER CERTIFIED SOLUTION
membership
Create a free account to see this answer
Signing up is free and takes 30 seconds. No credit card required.
ASKER
Thank you @hielo.
I post entire code again in snippet code for the next visitors view.
One more time thanks for your time.
The best regards, JC
I post entire code again in snippet code for the next visitors view.
One more time thanks for your time.
The best regards, JC
<?php
$url=htmlentities($_SERVER['PHP_SELF'],ENT_QUOTES);
if( isset($_GET['tutorial']) )
{
require_once("database.php");
$criteria=mysql_real_escape_string($_GET['tutorial']);
$tutorial_result = mysql_query("SELECT * FROM `tutorial` where `tutorial` = '$criteria' ", $db) or die(mysql_error());
$tutorial_rows = mysql_num_rows($tutorial_result);
if(!$tutorial_rows )
{
echo 'No results found.';
}
else
{
while( $tutorial = mysql_fetch_assoc($tutorial_result) )
{
echo $tutorial['titulo'];
}
}
exit;//BE SURE TO add this line
}
?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<noscript>
<META HTTP-EQUIV="Refresh" CONTENT="0;URL=index.php">
</noscript>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Novo Tutorial</title>
<style type="text/css" media="screen">
@import "index.css";
</style>
<script type="text/javascript" src="http://code.jquery.com/jquery-latest.js"></script>
<script type="text/javascript">
function fetchData(v)
{
$.get("<?php echo $url;?>?tutorial="+v,function(result){
$('#config_titulos_data').html(result);
});
}
</script>
</head>
<body>
<div id="geral">
<div id="titulo">upload de ficheiros e pastas</div>
<div id="sub_titulo">verificação e preparação</div>
<div id="menu_links">
<a href="index.php" class="links">home</a> <a href="novo.php" class="links">novo</a> <a href="configuracao.php" class="links">configuração</a> <a href="lista.php" class="links">lista</a>
</div>
<div id="config_tecno">
<div id="config_titulos">insert number please:</div>
<div id="config_titulos_data">HERE PUT THE INFORMATION COME FROM DATABASE/AJAX</div>
</div>
<div id="form"><form action="PROCESS_INFORMATION.PHP" method="post" name="form1">
<input name="number" type="text" value="" size="10" maxlength="4" onchange="fetchData(this.value)" /><br />
<input name="button" type="submit" value="send information to process" />
</form>
</div>
</div>
</body>
</html>
>>SELECT *
On the code above, you are using ONLY "titulo", so you should be executing ONLY SELECT `titulo`. It doesn't make sense for you to consume memory on data/information you do not need. In general, you should select only the field(s) you need.
Regards,
Hielo
On the code above, you are using ONLY "titulo", so you should be executing ONLY SELECT `titulo`. It doesn't make sense for you to consume memory on data/information you do not need. In general, you should select only the field(s) you need.
Regards,
Hielo
ASKER
Thank you hielo!
Open in new window