Can't use PHP value from jQuery.load() content - php

I'm working on a project that uses jQuery modals that dynamically load their content on a button click.
I am having an issue using this loaded content like I would normally.
Here is an example of my problem
<script type="text/javascript>
click function{
load modal{
open: $('#modalID').load('phpfile.php?id=<?php echo $id ?>');
}
</script>
That all works fine, but when trying to use jQuery within the "phpfile.php" is where the problem lies
<?php
$id = $_GET['id'];
$db = USE ID TO GET DATABASE INFO; //works fine here
?>
//ECHO SOME HTML HERE
<script type="text/javascript">
$('#buttonID').on('click', function(){
alert('test <?php echo $id ?>');
});
</script>
When I click the button, I get the alert but it just says test and I don't get the ID like I should.
Thanks in advance for your help and suggestions on this one!

You have pasted pseudo code so it is difficult to say what is wrong in your code.
The following should work, give it a try:
File 1.
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js"></script>
<?
$id = "10";
?>
<script>
$(document).ready(
function(){
$('#modalID').load('phpfile.php?id=<?php echo $id ?>');
});
</script>
<div id = 'modalID'></div>
And phpfile.php:
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js"></script>
<?php
$id = $_GET['id'];
?>
<script>
$('#buttonID').on('click', function(){
alert('test <?php echo $id ?>');
});
</script>
<input type="button" id = "buttonID" value="click me">

Please check on the do you have any errors in your browser's console. The above code should work. The possibilities are like if you don't get your $_GET['id'] or any script errors will prevent execution of your code.
I have created a sample php file which is working fine.
<?php
$id = rand();
?>
<button id="buttonID"> Click </button>
//ECHO SOME HTML HERE
<script type="text/javascript">
$('#buttonID').on('click', function(){
alert('test <?php echo $id ?>');
});
</script>

Related

Loading data from database in every few seconds without page refresh

I want to load contents from database in every 10 seconds to a particular . But however i try whole page gets refreshed. Not getting where oi am going wrong.
Here is my code
<?php
include('header.php');
include('includes/Connection.php');
include('includes/GeneralFunctions.php');
?>
<script type="text/javascript" src="http://code.jquery.com/jquery-1.8.2.js"></script>
<script type="text/javascript">
setInterval(function(){
$('#test').load('#test');
},5000);
</script>
<div id="test">
<?php
$l1 = $con->prepare("SELECT msg, topic FROM messages ORDER BY id DESC");
$l1->execute();
$cntmsg = $l1->rowCount();
foreach($l1 as $r1)
{
echo $r1['topic']."<br />";
echo $r1['msg']."\n";
}
?>
</div>
Use ajax in your SetInterval function.
ajax() method is used to perform an AJAX (asynchronous HTTP) request
$.ajax({url: "demo_test.txt", success: function(result){
$("#div1").html(result);
}});

How can I load php in a div with button onclick events in Javascript?

I am trying to load a table dynamically in a div in a php page. I want to load the tables using buttons or links on the same page.
I tried this:
<button id="fcluns" type="button" onclick="loadpage(this.id)">FC LUNs</button>
<div id="Table"></div>
<script type="text/javascript">
function loadpage(clicked_id){
if (clicked_id =="fcluns"){
$("Table").html('loadingImage.gif').load('getfcLuns.php?name=<?php $Host=$_GET['name']; echo $Host;?>');
}
}
</script>
i am generating the table from a php page getfcLuns.php where mysql queries are executed to get the details from database. And i am getting the $host in this php and passing it to the helper php to generate the table.
Any other efficient way is welcome. But I want to keep the page php based only.
<script src="ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js"; type="text/javascript"> </script>
<button id="fcluns" type="button" onclick="loadpage(this.id)">FC LUNs</button>
<div id="Table"></div>
<script type="text/javascript">
function loadpage(clicked_id){
if (clicked_id =="fcluns"){
$("Table").load("getfcLuns.php?name=<?php $Host=$_GET['name']; echo $Host; ?>");
}
}
</script>
This above script Worked.
Try
$("#Table").css({'background-image':'loadingImage.gif'}).load(
'getfcLuns.php?name=<?php echo $_GET[name];?>',
function() {
$(this).css({'background-image':'none'});
}
);
Read the Documentation http://api.jquery.com/load/

Trying to Send data using jquery .post()

In insert.php I have the following
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js">
<script type="text/javascript" src="includes/js/jquery.form.js"></script>
<script type="text/javascript">
$(document).ready(function() {
$(".like").click(function() {
var data = $(this).attr('data-id');
$.post("data.php", {'name': data}, function(response){
$('#dv').html(response);
});
});
});
// ...
</script>
<!-- ... -->
<?
if (!is_bool($result) && !is_null($result)){
while($row = mysql_fetch_array($result))
{
?>
<? $id = $row['uniqueid'];?>
<? echo "<br>ID: " . $row['uniqueid'];?>
<? echo "<br>Name: " . $row['surname']; ?>
<? echo "<br><a href class=like id=buton data-id='$id'> Like (" . $row['likes'] . ") </a>"; ?>
<? echo "<br><br>"; ?>
<!-- ... -->
in data.php I have
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js">
<script type="text/javascript" src="includes/js/jquery.form.js"></script>
<script type="text/javascript">
alert("<? echo $_POST['name']; ?>");
</script>
I fixed a couple of things I was told were wrong but it still does't work. The alert box is blank. Please help. Thanks.
this is completely wrong... for your data.php this will not parse javascript the way you are expecting.. it will simply take in POST data and ECHO out a result.. dont try and use client-side javascript because it will not do anything
data.php: its php just simply do
<?php
echo $_POST['name'];
?>
in your js if you really want a popup to show then you have to wait for the results of the POST/RESPONSE and do it
$.post("data.php", {'name': data}, function(response){
$('#dv').html(response);
alert(response);
});
remember the php script you call from a POST or ajax call will only process server side code.. PHP, perl, java, C... not client-side code like javascript

php echo not working for strtotime function while assigning it to a javascript variable

This works fine
<html>
<head>
<script src="jquery.js"></script>
<script>
$(document).ready(function(){
var timeLeft = <?php echo '1279'; ?>;
$("#time").text(timeLeft);
});
</script>
</head>
<body>
<div id="time"></div>
</body>
</html>
but this doesn't
<script>
$(document).ready(function(){
var timeLeft = <?php echo strtotime("now"); ?>;
$("#time").text(timeLeft);
});
</script>
It gives error Uncaught SyntaxError: Unexpected token < .
It is a php extension file.
Try this:
<script>
$(document).ready(function(){
var timeLeft = '<?php echo strtotime("now"); ?>';
$("#time").text(timeLeft);
});
</script>
Directly using php in javascript is very dangeorous. Because timetostr may output some warnings about timezone etc and your code will be broken without any visual clue.
In my projects, If I have to use any php output in my javascript, I create hidden divs and access the value from javascript:
<div class='hidden' id='values'>
<div class='val-time'><?php echo strtotime("now"); ?></div>
</div>
<script>
$(document).ready(function(){
var timeLeft = $("#values .val-time").html();
$("#time").text(timeLeft);
});
</script>
So whenever you want to debug your code, simply remove "hidden" class from #values and look at which values are ouputted by PHP.

php, jquery, how to trigger a click?

i have a link that needs to be triggered from a success post:
<?php
if ($_POST["action"] == "1") {
?>
<script type='text/javascript'>
$(window).load(function() {
$(".likepic").click();
});
</script>
<?php } ?>
<script type='text/javascript'>
$(window).load(function() {
$(".likepic").click(function(){
$(".likepic").colorbox({width:"620px", height:"570px", inline:true, href:"#likepic_lightbox"});
});
});
</script>
<div class="blackk" style="display:none;">
<div id="likepic_lightbox">test
</div>
</div>
so if that post action is 1 then run the jquery script and click on the link for something else to happen :)
this is what i tried but without success.
any ideas?
Thanks
Try using $(document).ready() instead of $(window).load()
Also, you'll need to switch the order of your JavaScript blocks. The click handler needs to be defined first.
Play with a test version here: http://jsfiddle.net/irama/bcMp7/
Or see updated code below:
<script type='text/javascript'>
$(document).ready(function() {
$(".likepic").click(function(){
$(".likepic").colorbox({width:"620px", height:"570px", inline:true, href:"#likepic_lightbox"});
});
});
</script>
<?php if ($_POST["action"] == "1") { ?>
<script type='text/javascript'>
$(document).ready(function() {
$(".likepic").click();
});
</script>
<?php } ?>
<div class="blackk" style="display:none;">
<div id="likepic_lightbox">test</div>
</div>
Let us know how you go!

Categories