i want to send Get when the link clicked to receive the result in php code
and this what happened
this in php file working perfect
<html>
<a class="cc" href="#">click me</a>
<script src="js/jquery.js"></script>
<script type="text/javascript">
$(document).ready(function () {
$(".cc").click(function () {
$(".body").load('page.php ')
})});
</script>
<section class="body"></section>
</html>
but when i put GET to the href didn't work just Flashing content
<html>
<a class="cc" href="?id=1">click me</a>
<script src="js/jquery.js"></script>
<script type="text/javascript">
$(document).ready(function () {
$(".cc").click(function () {
$(".body").load('page.php ')
})});
</script>
<section class="body"></section>
</html>
In the second case, you really need to stop the <a> from following the link.
$(document).ready(function() {
$(".cc").click(function(e) {
e.preventDefault();
$(".body").load('page.php');
});
});
Related
I have two jquery events on click of button.but i want to perform only one event.So how can i do that.
my code is as follow.
<!DOCTYPE html>
<html>
<head>
<title>Demo #1</title>
<script src="js/jquery.min.js" type="text/javascript"></script>
</head>
<body>
<div align="center">
<button id="mybtn">Some Button</button>
</div>
<script>
$("#mybtn").click(function(){
$("#mybtn").fadeOut();
});
</script>
<?php include('demo2.php'); ?>
</body>
</html>
Here is code for demo2.php
<script>
$("#mybtn").click(function(){
alert("i am in included in demo2");
});
</script>
now When i click on button Both Event is performed.so is there any way to perform one event that is store in current page not perform jquery that is included.
Create a variable to connect the selector to the event in page one do this
<script>
var selectFunction1=True;
$("#mybtn").click(function(){
if(selectFunction1===True){
$("#mybtn").fadeOut();
}
else{return false;}
});
</script>
And in demo2.php do this
<script>
var selectFunction2=True;
$("#mybtn").click(function(){
if(selectFunction2===True){
alert("i am in included in demo2");
}
else{return false;}
});
</script>
I want to send id to php script.I think my code is ok, but when i click on tag i get this error:
Notice: Undefined index: id in C:\xampp\htdocs\domaci\cao.php on line 4
here is my html + ajax code :
<html>
<head>
<script type="text/javascript" src="jquery-1.11.1.js"></script>
<script type="text/javascript" language="javascript">
$(document).ready(function(){
$('a').click(function(){
$.post($(this).attr('href'), { id : $(this).attr('id') } );
});
});
</script>
</head>
<body>
<a href="cao.php" id="Barselona" >Barselona</a>
</br>
<a href="cao.php" id="Beograd" >Beograd</a>
</body>
</html>
and this is cao.php:
<html>
<body>
<?php
$id = $_POST['id'];
echo $id;
?>
</body>
</html>
i really need this to get to work, please help me :)
Your $.post ajax is fine. The issue is when the anchor is clicked, you don't preventDefault or return false, to stop the browser redirecting to cao.php. When it redirects to cao.php, it is a GET request, and so triggers the undefined index notice because there is no post data.
Add return false or preventDefault:
$('a').click(function(e){
e.preventDefault();
$.post($(this).attr('href'), { id : $(this).attr('id') } );
});
Look at your browser's console (F12) on the Network tab, to see the response of the ajax.
Try it now.
$(document).ready(function(){
$('a').click(function(){
$.post($(this).attr('data-url'), { id : $(this).attr('id') } );
});
});
</script>
</head>
<body>
<a href="#" data-url="cao.php" id="Barselona" >Barselona</a>
</br>
<a href="#" data-url="cao.php" id="Beograd" >Beograd</a>
</body>
</html>
Your link redirects you, so simpe do this:
e.preventDefault();
Also its better to have variables (for future), here is EXAMPLE
Try this one will work for you:
<html>
<head>
<script type="text/javascript" src="jquery-1.11.1.js"></script>
<script type="text/javascript" language="javascript">
$(document).ready(function(){
$('a').click(function(){
$.post('cao.php', { id : $(this).attr('id') },function(data){
alert(data);
});
});
});
</script>
</head>
<body>
<a href="#" id="Barselona" >Barselona</a>
</br>
<a href="#" id="Beograd" >Beograd</a>
</body>
</html>
AT cao.php page
<?php
$id = $_POST['id'];
echo $id;die;
?>
just try print_r($_POST) in cao.php & check the values are posting
$id=$_POST["id"];
I want to pass jQuery variable to php file ,
this is my_js.js file
function updates() {
$.getJSON("php/fetch.php", function(data) {
$.each(data.result, function(){
var s_id = this['sender_id'];
});
});
}
and i want to display it here in php file,
<html>
<head><title>Pass jquery var to php file</title>
</head>
<body>
<div> <?php echo $s_id ; ?> </div>
<script type="text/javascript" src="my_js.js"></script>
<script type="text/javascript" src="jquery.js"></script>
</body>
</html>
You might consider using jQuery to set the s_id value in the page.
You can modify your HTML as follows (the important part being the added span element):
<html>
<head><title>Pass jquery var to php file</title>
</head>
<body>
<div><span id="s_id"></span></div>
<script type="text/javascript" src="my_js.js"></script>
<script type="text/javascript" src="jquery.js"></script>
</body>
</html>
And you can use jQuery in your getJSON callback to set the value as follows to find your added span element and modify its text:
function updates() {
$.getJSON("php/fetch.php", function(data) {
$.each(data.result, function(){
$("#s_id").text(this['sender_id']);
});
});
}
How can I link HTML href values to AJAX so that I get result on same page but in different conatainer. Below is my my code:
<html>
<head>
<title>DTC Search</title>
<script src="//ajax.googleapis.com/ajax/libs/jquery/1.7.0/jquery.min.js" type="text/javascript"></script>
<script>
$(document).ready(function() {
$('#a').click(function() {
e.preventDefault();
$('content').load($(this).attr('href'));
});
});
</script>
</head>
<body>
CT1<br>
CT2<br>
CT3<br>
CT4<br>
<div id="sidebar"> Body</div>
<div id="footer"> </div>
</body>
</html>
Since I am new to AJAX, I am not able to understand how to get information related to clicked value of href in AJAX function so that it will display result in same page but in other division. My filename is, say front_end.php
This is your code, just updated:
<html>
<head> <title>DTC Search</title>
<script src="//ajax.googleapis.com/ajax/libs/jquery/1.7.0/jquery.min.js" type="text/javascript"></script>
<script>
$(document).ready(function() {
$('a').each(function(){
$(this).on("click",function(e) {
console.log(e);
e.preventDefault();
$('#content').load($(this).attr('href'));
});
});
});
</script>
CT1<br>
CT2<br>
CT3<br>
CT4<br>
<div id="sidebar"> Body
</div> <div id="content"></div>
<div id="footer"> </div>
</body>
</html>
1) A tag is not $("#a") in jquery
2) $('content') is nothing
3) element with id $('#content') or some element with class $('#content')
Tako a look at jsBin example
1: http://jsbin.com/IFaLoJE/1/ or jsfiddle example
Try something like this :
$('a').click(function (e) {
e.preventDefault();
$('#content').load(this.href);
});
i want to refresh a page in php(which is executing the sql statements) to p refreshed every 10 seconds. I load the page in a div like:
<div id="test"> <?php echo showPage() ?></div>
So how can i just refresh this duv that will make the data fetch by the sql refresh..
thank you
You can include a <meta http-equiv="refresh" content="10"/> tag in the head tag, or, if you do not have access to the head tag, you can insert a script tag anywhere in the page like this one:
<script type="text/javascript">
setTimeout(function() {
location.reload();
}, 10000);
</script>
<script type="text/javascript"><!--
$(document).ready(function() {
setTimeout('$(\'#test\').load(\'abc.php #test >* \' )', 10000)
});
//--></script>
Write your script in the below way
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/
libs/jquery/1.3.0/jquery.min.js"></script>
<script type="text/javascript">
var auto_refresh = setInterval(
function () {
$('#test').load('test.php');
}, 10000); // refresh every 10000 milliseconds
</script>
<body>
<div id="test"> </div>
</body>