Assign "$Post->ID" to custom id - php

So, for a post loop, $post->ID is used to get the post id's.
Is there a way to "change" it to a custom "id"?
Here is what I mean by it:
So, I have a page that is passed onto a template via ajax as following:
There is a first php template called "first.php".
In this file, I have a post loop which contains a button:
$id = get_the_ID();
<?php echo '<button type="button" class="rh_show_image" data-post_id="' .$id. '">' ;?>
<?php echo get_post_meta($post->ID, 'rh_image', true); ?>
<?php echo '</button>';?>
This button has data-post_id which contains the post id. When it is clicked, then a second.php is loaded via ajax:
<script>
jQuery(document).ready(function() {
jQuery('.rh_show_image').click(function(e) {
e.preventDefault();
var rh_contact_form_id = jQuery(this).data("post_id");
jQuery.ajax({
type: "GET",
url: "<?php echo admin_url('admin-ajax.php'); ?>",
dataType: 'html',
data: ({ action: 'rh_second_php', rhc_post_id: rh_contact_form_id}),
success: function(data){
jQuery('#rh_iamge_' + rh_contact_form_id).html(data);
},
error: function(data)
{
alert("Error!");
return false;
}
});
});
});
</script>
When the second.php is called, as you can see from the script above, the post_id of the post is saved and parsed onto the template (data: ({ action: 'rh_second_php', rhc_post_id: rh_contact_form_id}),)
Then in the second.php, I have the following:
<!--Show title-->
<?php echo get_the_title($_REQUEST['rhc_post_id']); ?>
<!--Show image-->
<div class="images">
<?php
$I_will_call_you = callme_image();
foreach ($I_will_call_you as $slideshowimage)
{
echo "<img src='{$slideshowimage}' />";
}
?>
</div>
So, essentially, I am using $_REQUEST['rhc_post_id'] instead of $post->ID
Here is the problem
In the image div from the second.php, it does not show any images because it does not recognized the post id from $_REQUEST['rhc_post_id'].
So, is there a way to make it equal between $post->ID and $_REQUEST['rhc_post_id']?
Something like this: $_REQUEST['rhc_post_id'] = $post->ID
Thanks guys!
EDIT: The image div works fine when it is placed with a post loop, instead via ajax. So, the code itself works fine.
Edit 2: Syntax in the second.php is fixed now

Related

how to built ajax tabs in wordpress?

I try to display the departments in my website as tabs, when click one tab it will display the data related to this department according to department_id.
I try this code Execute php function only when clicked (wordpress) but I need the tabs number to be dynamic.
<div class="tabs">
<ul>
<?php
$arr1=array(2,3,5,10,22,25,27,28,29,30);
$arr2=array("dep1","dep2","dep3","dep4",
"dep5","dep6","dep7","dep8","dep9","dep10");
for($i=0;$i<10;$i++){?>
<li><a href="#tab" id="<?php echo $arr1[$i]; ?>"><?php echo
$arr2[$i];?>
</a></li>
<?php } ?>
</ul>
</div>
<div id="tab" class="section">
</div>
functions.php:
<?php
add_action('wp_ajax_tabsfunction', 'tabsfunction');
add_action('wp_ajax_nopriv_tabsfunction', 'tabsfunction');
function tabsfunction() {
$dept_id=$_GET[id];
/** Here I print data according to $dept_id **/
die();
}
?>
script.js:
jQuery(document).ready(function() {
jQuery('.tabs a').click(function(e) {
e.preventDefault();
var tab_id = jQuery(this).attr('id');
console.log(tab_id);
jQuery.ajax({
type: "GET",
url: "wp-admin/admin-ajax.php",
dataType: 'html',
data: ({ action: 'tabsfunction', id: tab_id}),
success: function(data){
jQuery('#tab').html(data);
},
error: function(data)
{
alert("Error!");
return false;
} });}); });
it dose not work, it displays data only for one tab.
console.log(tab_id) ----> it display the id for the first tab clicked
and did not change when click another tab.
You need to echo the output from the tabsfunction and also add the die() at end of the function like below :
add_action('wp_ajax_tabsfunction', 'tabsfunction');
add_action('wp_ajax_nopriv_tabsfunction', 'tabsfunction');
function tabsfunction() {
$dept_id=$_GET[id];
/** Here display data according to $dept_id **/
echo 'output';
die();
}
Hope it helps.
can you please correct your tab list code.
<div class="tabs">
<ul>
<?php
$arr1 = array(2,3,5,10,22,25,27,28,29,30);
$arr2 = array("dep1","dep2","dep3","dep4","dep5","dep6","dep7","dep8","dep9","dep10");
for($i=0;$i<10;$i++)
{
?>
<li><?php echo $arr2[$i];?></li>
<?php
}
?>
</ul>
</div>
<?php for($i=0;$i<10;$i++)
{
?>
<div id="tab<?php echo $arr1[$i]; ?>" class="section">
</div>
<?php
}
?>
Also return proper response on ajax request.
<?php
add_action('wp_ajax_tabsfunction', 'tabsfunction');
add_action('wp_ajax_nopriv_tabsfunction', 'tabsfunction');
function tabsfunction() {
$dept_id = $_GET[id];
echo $dept_id; // this just dispay requsted id as tab content here you can add your logic for dynamic content based on id
die();
}
?>
And your script js look like this
jQuery(document).ready(function() {
jQuery('.tabs a').click(function(e) {
e.preventDefault();
var tab_id = jQuery(this).attr('id');
console.log(tab_id);
jQuery.ajax({
type: "GET",
url: "wp-admin/admin-ajax.php",
dataType: 'html',
data: ({ action: 'tabsfunction', id: tab_id}),
success: function(data){
jQuery('#tab'+tab_id).html(data);
},
error: function(data)
{
alert("Error!");
return false;
} });}); });

POST in AJAX dont work when i redirect to the page

Hello im struggling with my Code :
I try to post some data to a php page :
$('.choixvol').click(function() {
var id = "testid";
$.ajax({
type: 'POST',
url: 'vol.php',
data: {
id: id
},
success: function() {
window.location.href = "vol.php";
},
});
});
But when I redirect to my PHP page the isset() doesn't work :
vol.php :
<?php
require'header_fr.php';
logged_only();
if(isset($_POST['id'])){
$id = $_POST['id'];
}else{
$id = "not isset";
}
?>
<div id="container"class="container">
<div class="form-wrap text-center">
<?php echo $id ?>
</div>
</div>
<?php
require'footer_fr.php';
?>
And display "not isset"
If you want to get the id when you redirect to the page, pass it in via GET method (providing the id is not private and is ok to be viewed in the url).
$('.choixvol').click(function() {
var id = "testid";
$.ajax({
type: 'POST',
url: 'vol.php',
data: {id: id},
success: function() {
window.location.href = "vol.php?id=" . $id;
},
});
});
<?php
require'header_fr.php';
logged_only();
if(isset($_POST['id'])){
//Do something with your post ID when using the post method
}
if(isset($_GET['id'])){
//Do something with your GET ID when redirected back with the GET method
$id = $_GET['id'];
}
?>
<div id="container"class="container">
<div class="form-wrap text-center">
<?php echo $id ?>
</div>
</div>
<?php
require'footer_fr.php';
?>
Although the comments on the OP are correct, this method is nonsense.

refresh an included page

I have a page index.php
Inside of it is a friendlist that updates the db with a button click without refreshing the page. Now I want that only the friendlist refreshs so its updated
<html>
<body>
<?php
include ("friendlist.php");
?>
</body>
</html>
friendlist.php:
<script>
function adduser() {
var data=$("#adduserform").serialize();
$.ajax({
type: "POST",
url: "addfriend.php",
data: data,
dataType: "html",
success: function(data)
{
//refresh myFriendlist or requser so its updated
}
});
}
</script>
<div id="myFriendlist" class="friendlist-content">
<?php if(!empty($request)) { ?>
<div id="req">
<h2 id="reqh">Anfragen</h2>
<?php foreach($request as $row) {
$row['userAname'] = (strlen($row['userAname']) > 5) ? substr($row['userAname'], 0, 5) . '...' : $row['userAname'];
?>
<div id="requser">
<a class="reqimg" style="padding:0px;" href="user.php?id=<?php echo ($row['id']);?>">
<img class="reqpb" src="./users/<?php echo ($row['userAid']); ?>/pb.jpg" alt="Bild nicht gefunden" onerror="this.src='./img/no_pb.png';"></img>
</a>
<a class="reqnm" style="padding:0px;" href="user.php?id=<?php echo ($row['userAid']);?>"><?php echo $row['userAname']; ?></a>
<img id="aimg" src="./img/accepticon.png">
<form id="adduserform" name="adduserform">
<input type="hidden" id="reqid" name="reqid" value="<?php echo $row['userAid'];?>" />
<input type="hidden" id="reqnm" name="reqnm" value="<?php echo $row['userAname'];?>" />
</form>
<img id="aimg" src="./img/dntaccepticon.png">
</div>
<?php
}
?>
</div>
<?php
}
?>
</div>
How can I do that?
You can refresh an external file using ajax. For example, if you had a div with the id "friendslist" you could refresh its contents this way:
$.ajax({
url: "friendlist.php"
}).done(function(response) {
$( '#friendslist' ).html( response );
});
The documentation for ajax is on the jQuery site here: http://api.jquery.com/jquery.ajax/.
If you can make "addfriend.php" to return the new complete list of users, so that would be:
<?php foreach($request as $row) {
$row['userAname'] = (strlen($row['userAname']) > 5) ? substr($row['userAname'], 0, 5) . '...' : $row['userAname'];
?>
you could use that response, which you will receive when you do the AJAX call, to refresh the friendlist, using the jquery HTML function (http://api.jquery.com/html/)
you can follow this code but not tested
first update your index.php
<html>
<body>
<div id="friendlist">
<?php
include ("friendlist.php");
?>
</div>
</body>
</html>
then update your addfriend.php as like
<?php
// your code here
// then include your frindlist.php content
include 'yourpath/frindlist.php'
?>
then update your javascript code like this
function adduser() {
var data=$("#adduserform").serialize();
$.ajax({
type: "POST",
url: "addfriend.php",
data: data,
dataType: "html",
success: function(data)
{
$('#friendlist').html(data);
}
});
}

Jquery reload div content on select change using php ajax

OK here is my code
portfolio.php
<select name="portfolio" id="portfolio_dropdown" class="service-dropdown">
<?php foreach($years as $year){ ?>
<option value="<?php echo $year['year']; ?>"><?php echo $year['year']; ?></option>
<?php } ?>
</select>
<div class="loading"></div>
<div id="portfolio">
<div id="port-cont">
<?php foreach($portfolios as $portfolio){ ?>
<div class="video">
<div class="play">
Play
</div>
<iframe src="http://www.youtube.com/v/<?php echo $portfolio['url']; ?>"frameborder="0" allowfullscreen></iframe>
<h3><?php echo $portfolio['title']; ?></h3>
<p><?php echo $portfolio['text']; ?></p>
</div>
<?php } ?>
</div>
</div>
my js code
$("body").on('change','#portfolio_dropdown',function(){
var year = $(this).val();
$.ajax({
type: "POST",
url: "catalog/controller/portfolio.php",
data: "year="+year,
beforeSend: function(){
$(".loading").show();
$("#portfolio").empty();
},
success: function(portfolio_data){
$(".loading").hide();
$("#portfolio").html(portfolio_data);
}
});
});
my portfolio controller file
if(isset($_POST['year'])){
include_once "../../system/validation.php";
include_once "../model/DataBase.php";
include_once "../model/Display.php";
$year = integer($_POST['year']);
$get_portfolio_data = new Display("portfolio");
$portfolios = $get_portfolio_data->getDataByColumnName("year",$year);
include_once "../view/themes/default/template/portfolio_data.php";
exit();
}
My portfolio file "the first one " i get my data with another function that i get my last year(2014) portfolio data
so when i change the year i call my controller file to get the data related to that year
my question here is how to return $portfolios that i got from my controller file so i don't have to change my template file code or include another file as i did
i mean i need to reload my portfolio.php template content
i tried something like this
$("body").on('change','#portfolio_dropdown',function(){
var year = $(this).val();
$.ajax({
type: "POST",
url: "catalog/controller/portfolio.php",
data: "year="+year,
beforeSend: function(){
$(".loading").show();
$("#portfolio").hide();
},
success: function(portfolio_data){
$(".loading").hide();
$("#portfolio").show().load("portfolio" + " #port-cont");
}
});
});
but i don't know how to send my new $portfolios data to the same div without including another template file
Actually i'm little confused how to do this properly
So i hope you got what i want to do :)
You can create a separate portfolio-div.php file that only contains the code you want to replace with, and call that from the $.ajax call.
Or you can add a $_GET parameter like ?skiptemplate=1 to portfolio.php so that when you call the file with that parameter, the surrounding template markup is skipped when the file is called from an ajax call.
If you do not have the opportunity to change the server-side code, you can load the whole template file again, but extract only the #port-cont part to replace the existing content. Don't use load() (which itself will call an URL), use html() instead:
$("#portfolio").show().html(portfolio_data);
(though this will insert all HTML, not only the #port-cont part)
$("#portfolio").html(portfolio_data)
Just pass the parameter into html

Loading a facebox modal window after an ajax request

this is what i have in the head tags of my html page to load the facebox plugin:
<!-- This is for the facebox plugin to work -->
<link href="<?php echo base_url();?>styles/facebox/src/facebox.css" media="screen" rel="stylesheet" type="text/css" />
<script src="<?php echo base_url();?>styles/facebox/lib/jquery.js" type="text/javascript"> </script>
<script src="<?php echo base_url();?>styles/facebox/src/facebox.js" type="text/javascript"></script>
<script type="text/javascript">
jQuery(document).ready(function($) {
$('a[rel*=facebox]').facebox({
loadingImage : "<?php echo base_url();?>styles/facebox/src/loading.gif",
closeImage : "<?php echo base_url();?>styles/facebox/src/closelabel.png"
})
})
</script>
this is the code for my div
<?php if(isset($$j)) : foreach($$j as $row) : ?>
<div class="single-result" id="single-result">
<div class="name"><?php echo $row->Name; ?></div>
<div class="description"><?php echo $row->Description; ?></div>
</div>
<?php endforeach; ?>
<?php else : ?>
error here
<?php endif; ?>
what i am wanting, is some ajax code that calls a function when the user clicks on the div id="single-result" so that it makes an ajax call to a php controller that gets the data from the database and then loads the view into a facebox modal window.
The part i am unsure about is how to make it load into a facebox modal window, l know how to use ajax calls to make it send data to a file and then load a view into a certain div on the page, l just want it to load it into the modal window instead of a certain div on the page.
Is this possible at all? (also i am using codeigniter for the php framework)
here is my ajax code which would load the ajax request results into the content-right div when the user clicks on div.
<script type="text/javascript">
$("#single-result").click(function() {
var form_data = {
ajax: '1',
itemcode: "<?php echo $row->id; ?>"
};
$.ajax({
url: "<?php echo site_url('ajax/item_info_right'); ?>",
type: 'POST',
data: form_data,
success: function(msg) {
$('#content-right').html(msg);
}
});
return false;
});
</script>
<!-- END -->
how do i modify this code above to make it work with going into a facebox modal window? I know facebox provides this code below, but i have no idea what to do with it?
jQuery.facebox(function() {
jQuery.get('code.js', function(data) {
jQuery.facebox('<textarea>' + data + '</textarea>')
})
})
It's not really clear what you're after...
If what you want is to have the data returned from the ajax POST to be populated into a facebox, simply call facebox on the success callback of the ajax post:
$("#single-result").click(function() {
var form_data = {
ajax: '1',
itemcode: "<?php echo $row->id; ?>"
};
$.ajax({
url: "<?php echo site_url('ajax/item_info_right'); ?>",
type: 'POST',
data: form_data,
success: function(msg) {
jQuery.facebox(msg);
})
});
alternatively, it looks like if you want the facebox loading graphics while the post is processed, you can wrap the ajax POST in facebox function:
$("#single-result").click(function() {
jQuery.facebox(function() {
var form_data = {
ajax: '1',
itemcode: "<?php echo $row->id; ?>"
};
$.ajax({
url: "<?php echo site_url('ajax/item_info_right'); ?>",
type: 'POST',
data: form_data,
success: function(msg) {
jQuery.facebox(msg);
})
});
})
})

Categories