change php variable on click event

Question

I want to change php variable ($start and $end called by var b1 and var b2) if the user clicks on button. Now I know that php is server side, but how can I do it? I read something about using $get but I don't know how to implement it:

<?php if ( is_user_logged_in() ) { ?>
<input type="submit" value="Start Chat" id="start_chat" style="position: absolute; top: 30px; left: 10px;" />
<?php
 } ?> 

 <script>
jQuery('#start_chat').click(function(){
  $(this).data('clicked', true);
});

var b1 = '<?php echo $start; ?>';
var b2 = '<?php echo $end; ?>';


if(jQuery('#start_chat').data('clicked')) {
   // change var b1 and b2
} else {
    // do not change anything
}


</script>

<div id="eu_la">
<?php
$start = strtotime('9:30');
$end = strtotime('12:30');
$timenow = date('U'); 
if((date('w') == 4) && ($timenow >= $start && $timenow <= $end)) { // day 2 = Tuesday
  include('facut_mine.php');
   } 
  else {
do_shortcode('[upzslider usingphp=true]');
  } ?>

What variable are you trying to change? I cannot figure out exactly what you are trying to accomplish here. — Vlad
– Vlad, Commented Sep 20, 2012 at 9:03

Mahdi · Accepted Answer · 2012-09-20 09:36:22Z

6

on your current code here, add:

// change var b1 and b2
$.ajax({
    type: "POST",
    url: "chat.php",
    data: { b1: "123", b2: "456" }
});

on chat.php:

$start = $_POST['b1'];
$end = $_POST['b2'];

Update:

if you need to load back the data here in javascript:

on chat.php make these changes:

// variables
if (!empty($_POST)) {
    $data['b1'] = $_POST['b1'];
    $data['b2'] = $_POST['b2'];
}

// to not lose them
$_SESSION['chat'] = $data;

// to keep it compatible with your old code
$start = $data['b1'];
$end = $data['b2'];

// send the JSON formatted output
echo json_encode($data);

on your client-side code:

// change var b1 and b2
$.ajax({
    type: "POST",
    url: "chat.php",
    dataType: 'json',
    data: { b1: "123", b2: "456" }
}).done(function(data) {
    b1 = data.b1;
    b2 = data.b2;
});

I didn't test that, but hope it works!

edited Sep 20, 2012 at 9:36

answered Sep 20, 2012 at 9:15

Mahdi

9,4479 gold badges58 silver badges75 bronze badges

Sign up to request clarification or add additional context in comments.

Comments

Vlad · Accepted Answer · 2012-09-20 09:14:13Z

First of all, the input tag must be enclosed in a form tag. As such,

<?php if ( is_user_logged_in() ) { ?>
<form method="GET">
<input type="submit" value="Start Chat" id="start_chat" style="position: absolute; top: 30px; left: 10px;" />
<input type="hidden" name="start" value="[WHATEVER YOU WANT GOES HERE]" />
<input type="hidden" name="end" value="[WHATEVER YOU WANT GOES HERE]" />
</form>
<?php
 } ?>

Then, in the PHP code

if (isset($_GET['start']))
    $start = $_GET['start'];
if (isset($_GET['end']))
    $start = $_GET['end'];

That will set the $start and $end variables to whatever values you submitted through the form. However, your JavaScript code won't work as intended

jQuery('#start_chat').click(function(){
     $(this).data('clicked', true);
});


if(jQuery('#start_chat').data('clicked')) {
   // change var b1 and b2
} else {
    // do not change anything
}

The first piece of code adds an event listener to the #start_chat element. The problem, however, is that the latter piece of code is read and executed(by the interpreter) right after, when data('clicked') is not set. So it will never enter the if branch.

Martin Müller · Accepted Answer · 2012-09-20 09:14:50Z

1

As you say correctly, PHP is server side. This is why you would have to call an Ajax-Send to the server, pushing the new values to the php script. Then you'd have to load the answer that is delivered from PHP via Javascript (Ajax onready) and replace the page (parts) with the newly loaded.

Seems awfully complicated for me just to change start and end times. Just do it directly in JS ;)

answered Sep 20, 2012 at 9:14

Martin Müller

2,53522 silver badges34 bronze badges

2 Comments

Claudiu Creanga Over a year ago

yes, but am I able to do this do_shortcode('[upzslider usingphp=true]'); in javascript? I thought that wordpress asks for php...

Martin Müller Over a year ago

No, this cannot be done in Js. However, you can include this in the document and just hide it via CSS/Js (same goes for the facut_mine.php if it contains no "critical" data). So you avoid the need to use Ajax and your page will load in a single request.

Collectives™ on Stack Overflow

change php variable on click event

3 Answers 3

Comments

Comments

2 Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

3 Answers 3

Comments

Comments

2 Comments

Your Answer

Sign up or log in

Post as a guest

Related