by using javascript ajax i have passed the values to php page...
display the values after retrieving from database and print in ajax page...it displaying in alert page...but i need to display in ajax page....
ajax coding
<script>
function optionsAlert()
{
alert("call");
var xmlhttp;
var qw=document.getElementById('c').value;
var qw1=document.getElementById('c1').value;
var qw2=document.getElementById('unit33').value;
var qw3=document.getElementById('dept').value;
var qw4=document.getElementById('class').value;
alert(qw);
alert(qw1);
alert(qw2);
alert(qw3);
alert(qw4);
if (window.XMLHttpRequest)
{// code for IE7+, Firefox, Chrome, Opera, Safari
xmlhttp=new XMLHttpRequest();
}
else
{// code for IE6, IE5
xmlhttp=new ActiveXObject("Microsoft.XMLHTTP");
}
xmlhttp.onreadystatechange=function()
{
if (xmlhttp.readyState==4 && xmlhttp.status==200)
{
alert(xmlhttp.responseText);
if(xmlhttp.responseText==1){
alert("name already Exists" );
return false;
}
else if(xmlhttp.responseText==0)
{
alert("name available");
document.login.submit();
}
}
}
var queryString = "?q=" + qw + "&q1=" + qw1 + "&q2=" + qw2 + "&q3=" + qw3 + "&q4=" + qw4;
xmlhttp.open("get",'ques.php' + queryString,true);
xmlhttp.send();
}
php page
<?php
include('connection.php');
if(($_GET['q']!='') && ($_GET['q1']!='') && ($_GET['q2']!='') && ($_GET['q3']!='') && ($_GET['q4']!=''))
{
$a= mysql_query("select * from unit1 where unit='".$_GET['q']."' and stopic='".$_GET['q1']."' and qtype='".$_GET['q2']."' and dept='".$_GET['q3']."' and class='".$_GET['q4']."'");
//$a= mysql_query("select * from unit1 where unit='unit1' and stopic='Subtopic1' and qtype='normal questions'");
if(mysql_num_rows($a)>0)
{
while($row=mysql_fetch_array($a))
{
$a1=$row['qno'];
$a2=$row['ques'];
$a3=$row['ch1'];
$a4=$row['ch2'];
$a5=$row['ch3'];
$a6=$row['ch4'];
$a7=$row['ans'];
echo $a1."<br>";echo $a2."<br>";echo $a3."<br>";echo $a4."<br>";echo $a5."<br>";echo $a6."<br>";echo $a7."<br>";
echo 1;
}
}
else
{
echo 0;
}
}
?>
Below the ajax coding create div element with id
in your ajax method
if(xmlhttp.responseText==1){
document.getElementById("id").innerHTML = "name already Exists";
return false;
}
else if(xmlhttp.responseText==0)
{
document.getElementById("id").innerHTML="name available";
document.login.submit();
}
"id" your own div id
Related
I am trying to create a ajax function to just reload a <div> and not the entire page.
What is working:
-during writing in the input field the div is reloaded after every character correctly.
What is not working:
-when the input field is complete empty again, it is not showing the whole entries I have in the database.
this is what I have in the php file where the div is:
function showGames(str) {
if (str == "") {
document.getElementById("searchgame").innerHTML = "";
return;
} else {
if (window.XMLHttpRequest) {
// code for IE7+, Firefox, Chrome, Opera, Safari
xmlhttp = new XMLHttpRequest();
} else {
// code for IE6, IE5
xmlhttp = new ActiveXObject("Microsoft.XMLHTTP");
}
xmlhttp.onreadystatechange = function() {
if (xmlhttp.readyState == 4 && xmlhttp.status == 200) {
document.getElementById("show").innerHTML = xmlhttp.responseText;
}
};
xmlhttp.open("GET","searchgame.php?game="+str,true);
xmlhttp.send();
} }
this is what I have in the search.php
<?php
include 'test/database.php';
$pdo = Database::connect();
if($_GET['game'] == "") {
$sql="SELECT * FROM games WHERE active=1";
echo "<script type='text/javascript'>alert('Should be empty')</script>";
} else {
$q = $_GET['game'];
$sql="SELECT * FROM games WHERE gamenamelong LIKE '%".$q."%'";
}
$stmt = $pdo->prepare($sql);
$stmt->execute();
$gameResults = $stmt->fetchAll(PDO::FETCH_ASSOC);
$rowCount1 = count($gameResults);
Is anybody able to help me?
Thank you!
since we don't know how your form looks like, and what calls the function showGames how, I can only give a vague answer. But your main problem/misstake should be solved with that:
In your function showGames you never hit the ajax if the search string is empty, so you can't get back all results.
So I suggest to change that function like so:
function showGames(str) {
if (str == "") {
document.getElementById("searchgame").innerHTML = "";
//remove that: return;
}
// remove the 'else { '
// now you allways hit the ajax
if (window.XMLHttpRequest) {
// code for IE7+, Firefox, Chrome, Opera, Safari
xmlhttp = new XMLHttpRequest();
} else {
// code for IE6, IE5
xmlhttp = new ActiveXObject("Microsoft.XMLHTTP");
}
xmlhttp.onreadystatechange = function() {
if (xmlhttp.readyState == 4 && xmlhttp.status == 200) {
document.getElementById("show").innerHTML = xmlhttp.responseText;
}
};
xmlhttp.open("GET","searchgame.php?game="+str,true);
xmlhttp.send();
// remove closing bracket of if-else: '}'
}
I try to use these code from w3school but I have some problems.
My first file:
<script>
function showHint(str)
{
var xmlhttp;
if (str.length==0)
{
document.getElementById("txtHint").innerHTML="";
return;
}
if (window.XMLHttpRequest)
{// code for IE7+, Firefox, Chrome, Opera, Safari
xmlhttp=new XMLHttpRequest();
}
else
{// code for IE6, IE5
xmlhttp=new ActiveXObject("Microsoft.XMLHTTP");
}
xmlhttp.onreadystatechange=function()
{
if (xmlhttp.readyState==4 && xmlhttp.status==200)
{
document.getElementById("txtHint").innerHTML=xmlhttp.responseText;
}
}
xmlhttp.open("GET","getresult.php?q="+str,true);
xmlhttp.send();
}
</script>
<?php
echo "First name: <input type=\"text\" id=\"txt1\" onkeyup=\"showHint(this.value)\" />";
echo "<p>Suggestions: <span id=\"txtHint\"></span></p>";
?>
My second file [getresult.php]:
<?php
$a[]="Anna";
$a[]="Brittany";
$a[]="Cinderella";
$a[]="Diana";
// get the q parameter from URL
$q=$_REQUEST["q"]; $hint="";
// lookup all hints from array if $q is different from ""
if ($q !== "")
{
foreach($a as $key=>$name)
{
if ($q==$key)
{
if ($hint==="")
{
$hint=$name;
}
else
{
$hint .= ", $name";
}
}
}
}
// Output "no suggestion" if no hint were found
// or output the correct values
echo $hint==="" ? "no suggestion" : $hint;
?>
if i want to have 1 file how should i do with
xmlhttp.open("GET","getresult.php?q="+str,true);
because I upload both file on my server it not work but i works when i run on my computer(localhost)
thanks.
You can use this
if (isset($_GET['q'])) {
//getresult.php contents
}
else {
//first file contents
}
getsubcat.php
<?php
include("config.php");
error_reporting(0);
$checkedValue=$_GET['checkedValue'];
$options= "";
$s=mysql_query("SELECT * FROM `sub_category` INNER JOIN `category` on sub_category.cat_id=category.cat_id where category.cat_name='$checkedValue'");
while($rows=mysql_fetch_array($s))
{
$subcategory=$rows['sub_cat_name'];
echo '<input name="sub_category" type="checkbox" class="checkbox_check1" onclick="select_subcatinfo('.$subcategory.')" id="checkbox_check1'.$subcategory.'" value="'. $subcategory.'" > '.$subcategory.'<br /><br />';
}
?>
This is my php coding which ll be loaded through ajax in another page.. Below is my ajax script.
Ajax Script
function select_subcatinfo(name)
{
$("#wait").css("display","block");
var checkedValue1 = name;
if( $("#checkbox_check1"+name).is(':checked') )
{
var xmlhttp;
if (window.XMLHttpRequest)
{// code for IE7+, Firefox, Chrome, Opera, Safari
xmlhttp=new XMLHttpRequest();
}
else
{// code for IE6, IE5
xmlhttp=new ActiveXObject("Microsoft.XMLHTTP");
}
xmlhttp.onreadystatechange=function()
{
if (xmlhttp.readyState==4 && xmlhttp.status==200)
{
$("#wait").css("display","none");
data = xmlhttp.responseText.split("[BRK]");
document.getElementById("DisplaySubcat").innerHTML = data[0]+" "+data[1];
}
}
xmlhttp.open("GET","getSubcatValue.php?checkedValue1="+checkedValue1,true);
xmlhttp.send();
}
else
{
$("#wait").css("display","none");
}
}
</script>
But inside that echo statement this function is not working.. any help here . thankss
Don't use inline Javascript, use jQuery to bind the event handler:
$(document).ready(function() {
$(".checkbox_check1").click(function() {
if (this.checked) {
$("#wait").show();
$.get('getSubcatValue.php', { checkedValue1: this.value }, function(response) {
var data = response.split('[BRK]');
$("#DisplaySubcat").text(data[0] + ' ' + data[1]);
$("#wait").hide();
});
}
});
});
I'm really not trying to answer this...just cleaned up the op's PHP
<?php
require("config.php");
error_reporting(0);
$checkedValue = $_REQUEST['checkedValue'];
$options = "";
$s=mysql_query("SELECT * FROM `sub_category` INNER JOIN `category` on sub_category.cat_id=category.cat_id where category.cat_name='$checkedValue'");
while($rows=mysql_fetch_array($s))
{
$subcategory=$rows['sub_cat_name'];
echo '<div><input name="sub_category" type="checkbox" class="checkbox_check1" onclick="select_subcatinfo('.$subcategory.')" id="checkbox_check1'.$subcategory.'" value="'. $subcategory.'" > '.$subcategory.'<br /><br /></div>';
}
?>
I have the following code which works great:-
$('.ajax a').click(function() {
getpageajax(this.href);
return false;
});
function getpageajax(getpage) {
if(getpage == "") {
//SET ERROR?
document.getElementById("main").innerHTML = "";
return;
}
if(window.XMLHttpRequest) {// code for IE7+, Firefox, Chrome, Opera, Safari
xmlhttp = new XMLHttpRequest();
} else {// code for IE6, IE5
xmlhttp = new ActiveXObject("Microsoft.XMLHTTP");
}
xmlhttp.onreadystatechange = function() {
if(xmlhttp.readyState == 4 && xmlhttp.status == 200) {
document.getElementById("main").innerHTML = xmlhttp.responseText;
}
}
var urlarray = getpage.split('/');
location.hash = urlarray[urlarray.length-1];
xmlhttp.open("GET", "includes/AJAXgetpage.php?getpage=" + getpage, true);
xmlhttp.send();
};
Only problem is that I have no idea how to get then read the anchor links I create (e.g. #contact-us) to create bookmarkable pages.
I tried to do a solution based around the following but it seems less than ideal
<script>
var query = location.href.split('#');
document.cookies = 'anchor=' + query[1];
<?php if (!$_COOKIE['anchor']) : ?>
window.location.reload();
<?php endif; ?>
<?php
echo $_COOKIE['anchor'];
?>
To get the hash, other than your initial example, you can use window.location.hash
// example url - http://www.mysite.com/blog/post#comments
var hash = window.location.hash; // = "#comments"
You can use replace to get rid of the leading # if required.
Right now I'm struggling to get this simple PHP AJAX request to work.
<html>
<head>
<script type="text/javascript">
function getSuggestions(type){
if(type == "")
{
document.getElementById("entries").innerHTML="test"
return;
}
if (window.XMLHttpRequest)
{// code for IE7+, Firefox, Chrome, Opera, Safari
xmlHttp=new XMLHttpRequest();
}
else
{// code for IE6, IE5
xmlHttp=new ActiveXObject("Microsoft.XMLHTTP");
}
xmlHttp.onreadystatechange = function(){
if(xmlHttp.readyState == 4 && xmlHttp.status == 200)
{
document.getElementById("entries").innerHTML=xmlHttp.response;
}
}
xmlHttp.open("GET","getData.php?status="+type,true);
xmlHttp.send();
}
</script>
</head>
<body>
<div id="A" onclick='getSuggestions("A")'>Click for A</div>
<div id="P" onclick='getSuggestions("P")'>Click for P</div>
<div id="R" onclick='getSuggestions("R")'>Click for R</div>
<div id="entries"></div>
</body>
</html>
Below is getData.php
<?php
$status = $_GET["status"];
echo $status;
?>
Everytime I click on any of the tags I get "undefined" in the "entries" tag. Could anybody explain why it's undefined?
use xmlHttp.responseText
This is how I handle AJAX. Essentially an example of akellehe's answer
function getSuggestions(type){
if(type == "") {
document.getElementById("entries").innerHTML="test"
return;
}
var r = getXmlObject();
var url= "getData.php?status="+type;
if (r.readyState == 4 || r.readyState == 0) {
r.open("POST", url, true);
r.onreadystatechange = function (){
if (r.readyState == 4) {
document.getElementById("entries").innerHTML= r.responseText;
}
};
r.send(null);
}
}
////////////////////////////////////
function getXmlObject() {
if (window.XMLHttpRequest) {
return new XMLHttpRequest();
} else if(window.ActiveXObject) {
return new ActiveXObject("Microsoft.XMLHTTP");
} else {
alert('Status: Cound not create XmlHttpRequest Object. Consider upgrading your browser.');
}
}