Develop Reference

Run a JavaScript function from a php if statement

I would like to create a php IF statement so If it receives the key "test" by POST, <h2> hello </ h2> should be output, otherwise <span> error </ span>
How can I make that?
<div id="rre">
<h2 class="desktop">Hamburg,a major port city in northern Germany.</h2>
<h2 class="mobil">Berlin,is the capital and the largest city of Germany.</h2>
</div>
<form action="viereck.html" method="POST">
<input type="text" name="check"?>
<input type="button" value="Klick" onclick="klick();" />
</form>
<script type="text/javascript">
function klick() {
jQuery('#rre').html('<h1>Hallo</h1>');
}
</script>

The response that you return needs to be inside script tags like:
echo '<script type="text/javascript">alert();</script>';

Why you don't do that with jquery: Try smth like this
<script type="text/javascript">
function klick() {
if($("#text").val() == 'test'){
jQuery('#rre').html("<h1>Hello there!</h1>");
}else{
jQuery('#rre').html("Error");
}
}
</script>
Html
<div id="rre">
<h2 class="desktop">Hamburg,a major port city in northern Germany.</h2>
<h2 class="mobil">Berlin,is the capital and the largest city of Germany.</h2>
</div>
<form action="viereck.html" method="POST">
<input type="text" name="check"? id="text">
<input type="button" value="Klick" onclick="klick();" />
</form>
JSFIDDLE

If the page you're posting to is viereck.html, you're going to be unable to use PHP on it.
If you can change the file to viereck.php, you can POST to it like you're doing, with action="viereck.php" method="POST" Then, at the top of your page, check for POST values in PHP like:
<?php
if(isset($_POST['check'])){
$check = '<span>error</span>';
if($_POST['check'] == 'test'){
$check = '<h1>Hallo</h1>';
}
}
?>
And if your jQuery is on the same page, you can insert the PHP like:
<script type="text/javascript">
function klick() {
jQuery('#rre').html(<?= $check; ?>);
}
</script>
Doing it this way though can lead to some serious headaches as your project grows, I wouldn't recommend it. Why not look into using AJAX? You can submit a form and return a message indicating success or failure, as well as why. You can then create your HTML in jQuery instead of a PHP string like:
// On form submit
$.ajax({
url: "viereck.php",
type: 'POST',
success: function(result){
var msg = $('<h1>').text('Hallo');
$('#rre').html(msg);
},
error: function(result){
var msg = $('<span>').text('Error');
$('#rre').html(msg);
}
});

Displaying links/buttons when a user is logged on/off

I am truly a novice at coding and only succeed with trial and error. I use a WYSIWYG program to do all the main pages in my site and then add php coding to do some specified things.What I am trying to do right now is display a log in button along with a register and forgot password links to those forms, all of which I have built and working, have this display in the masterframe page when a user is not logged in and show another set of user name, profile, logout links when they are logged in. By themselves I have all these functions working, I just cant figure out how to do it this way. Any help or steering me in the right direction to teach me would be great. If you need to be paid for your help that can be arranged as well. Thank You.
update:
This is the code that I have right now and use, again I want to have the if else statement show one thing or the other on condition, and have it show in place of, all on the masterframes page.
// have this display if user is logged in
<span id="LoginName1"><?php
if (isset($_SESSION['username']))
{
echo $_SESSION['username'];
}
else
{
echo 'Not logged in';
}
?></span>
<div id="wb_Text2" style="">
<span style="color:#FFFFFF;font-family:Tahoma;font-size:12px;">Profile</span>
</div>
<form name="logoutform" method="post" action="<?php echo basename(__FILE__); ?>" id="logoutform">
<input type="hidden" name="form_name" value="logoutform">
<a id="Logout2" href="javascript:document.logoutform.submit()">Logout</a>
</form>
//have this display if user is logged out
Log In
<div id="wb_Text3" style="">
<span style="color:#FFFFFF;font-family:Tahoma;font-size:12px;">Register</span>
</div>
<div id="wb_Text1" style="">
<span style="color:#FFFFFF;font-family:Tahoma;font-size:12px;">Forgot Password?</span>
</div>
I have tried doing this but I keep getting a syntax error for unexpected '<'
<span id="LoginName1"><?php
if (isset($_SESSION['username']))
{
echo $_SESSION['username'];
<div id="wb_Text2" style="">
<span style="color:#FFFFFF;font-family:Tahoma;font-size:12px;">Profile</span>
</div>
<form name="logoutform" method="post" action="<?php echo basename(__FILE__); ?>" id="logoutform">
<input type="hidden" name="form_name" value="logoutform">
<a id="Logout2" href="javascript:document.logoutform.submit()">Logout</a>
</form>
}
else
{
Log In
<div id="wb_Text3" style="">
<span style="color:#FFFFFF;font-family:Tahoma;font-size:12px;">Register</span>
</div>
<div id="wb_Text1" style="">
<span style="color:#FFFFFF;font-family:Tahoma;font-size:12px;">Forgot Password?</span>
</div>
}
?></span>

<?php
// Setting a session variable when customer is logged in.
$_SESSION['user_loggedin'] = 1;
$_SESSION['customer_id'] = $customer_id; // Some reference of logged in customer
$_SESSION['customer_name'] = $customer_name; // Customer information collected from DB or other resource.
// Deciding whether to display "Login" button or Logged in status / links
if ($_SESSION['user_loggedin']) {
echo 'Hi ' . $_SESSION['customer_name'];
echo 'My Account';
} else {
echo 'Login';
echo ' Register';
echo ' Forgot Password';
}
If you have some PHP function to check whether customer is logged in or not, you can use that function like this in lieu of if ($_SESSION['user_loggedin']) condition
if (UserLoggedin()) {
// Logged in links
} else {
// Links to be displayed when customer is logged out.
}

You are mixing both PHP and HTML code. Please correct.
You have to separate / embed HTML properly in your document while using php conditions.
Example:
<?php
$condition = true;
if ($condition) {
?>
<h1>This will be displayed when condition is true</h1>
<?php
} else {
?>
<h1>This will be displayed when condition is false</h1>
<?php
} // else ends
?>
Please try this:
<span id="LoginName1"><?php
if (isset($_SESSION['username']))
{
echo $_SESSION['username'];
?>
<div id="wb_Text2" style="">
<span style="color:#FFFFFF;font-family:Tahoma;font-size:12px;">Profile</span>
</div>
<form name="logoutform" method="post" action="<?php echo basename(__FILE__); ?>" id="logoutform">
<input type="hidden" name="form_name" value="logoutform">
<a id="Logout2" href="javascript:document.logoutform.submit()">Logout</a>
</form>
<?php
}
else
{
?>
Log In
<div id="wb_Text3" style="">
<span style="color:#FFFFFF;font-family:Tahoma;font-size:12px;">Register</span>
</div>
<div id="wb_Text1" style="">
<span style="color:#FFFFFF;font-family:Tahoma;font-size:12px;">Forgot Password?</span>
</div>
<?php
}
?></span>

Adding some code in your question would be nice, but if I understand your question correctly you might want to try this:
$logged_in = 0;
if($logged_in == 0) {
//all the stuff you want to show when the person is not logged in
$logged_in = 1;
}
if($logged_in == 1) {
//all the stuff you want to show when the person is logged in
}

In order to do what you are trying, you need to implement just a bit of logic on the code. The example of kerv is perfectly valid. The idea is that you will validate if the user is logged in or not, before rendering the html. For example:
if($userLoggedIn){
<div> Welcome to the site </div>
} else {
<div> Your are not logged in, please do so to continue </div>
}
I'll suggest you to edit the question with some code so we can properly help you.

Create a PHP session and use that session variable for your "IF" condition boolean.
i.e. if (session active)
{then display this object}
else
{dont display this object}
Here is some documentation on PHP 5 Sessions. PHP 5 Sessions
The neat thing about PHP is that it is completely interchangeable with HTML. Therefore you and assign elements to divs. Here is an example.
<html>
<body>
<?php
$loggedInTxt="";
$loggedOutTxt="";
if (*session*){
$loggedInTxt="<div>*some html content here*</div>"
}
else{
$loggedOutTxt="<div>*some html content here*</div>"
}
?>
<?php echo($loggedInTxt)?>
<?php echo($loggedOutTxt)?>
</body>
</html>
The idea is that you test the condition within the php and create php strings containing html elements. You can insert the anywhere in your html. So if you create a button and assign the code you used to create that button to a php variable then you can echo that variable(the code for the button) anywhere in your html script. I was blown away by the implications of php. I hope this helps simplify it! (This more of an overview. Do NOT copy and paste the code)

How to reload user defined tag in CMS Made Simple

I have a html file which loads a list from my database and allows the front end user to remove a particular entry.
The HTML Code looks like this:
<script type="text/javascript">// <![CDATA[
function sendForm() {
var dataSend=$("#clientid").val();
$("#responseDiv").html("<h2>Removing from Database...</h2>");
$.post("RemoveClient.php",{
ClientId: dataSend
},function(data) {
$("#responseDiv").html(data);
$("#clientlist").empty();
$("#clientlist").html("{client_list nocache}");
});
return false;
}
// ]]></script>
</p>
<div id="MainForm"><form class="form" onsubmit="return sendForm()">
<h2 class="formstyle">Client Wizard</h2>
<p>Please fill all the required fields.</p>
<div id="clientlist">{client_list nocache}</div>
<p><input style="font-size: 1.5em; font-color: #000000;" onclick="sendForm()" type="submit" value="Delete" /></p>
</form>
<div id="responseDiv"> </div>
</div>
The UDT called for {client_list} is given below.
$dbhost='127.0.0.1';
$dbuser='user';
$dbpass='pass';
$dbname='dbname';
$conn=mysqli_connect($dbhost,$dbuser,$dbpass,$dbname);
if(!$conn)
{
die('Could not connect:'.mysqli_connect_error());
}
$sql="SELECT clientid,clientname FROM client order by clientid";
echo "<label> Select Client: </label>";
echo "<select id=clientid name=clientid>";
$result=mysqli_query($conn,$sql);
while($row=mysqli_fetch_assoc($result))
{
echo "<option value=".$row['clientid'].">".$row['clientname']."</option>";
}
echo "</select>";
Now, once I click on delete, I want the drop down list to refresh with the new list not having the deleted client. I tried doing that by emptying the div and then reloading the UDT. Unfortunately this does not seem to be working, the way I want it to, as the list does not get refreshed until and unless I refresh the page. Is there anyway I can make this work?

The quick/easiest option would be to assign it an id and to remove the entry via javascript.
Second, would be to have RemoveClient.php return it as part of the response from the AJAX.
var response = data.split('|');
$("#responseDiv").html(response[0]);
$("#clientlist").html(response[1]);
Third, I would strongly advise against this way but it is the question you ask, put the UDT alone on new page then load the page with the ?showtemplate=false parameter.
$("#clientlist").load("//www.mydomain.com/myudt.html?showtemplate=false");

Refreshing div with AJAX

Index.php
...
<form id="calculator_form" name="form" action="" method="get" >
<input name="one" type="text">
<input name="two" type="text">
<input type="submit">
</form>
...
<!-- refresh area -->
<?php if(isset($_GET["one"])) { ?>
<div>
<?php echo $_GET["one"] . " " . $_GET["two"]; ?>
</div>
<?php } ?>
<------------------->
I would like to submit the form and reload the refresh area indicated above. I know this can be achieved by using AJAX but I'm not quite sure how.
I have tried putting the refresh area in a separate ajax.php file and using JQuery but it didn't work;
$(document).ready(function() {
$("#calculator_form").submit(function(event) {
event.preventDefault();
$("#divtoappend").load("ajax.php", data);
})
})
I've also tried using $.get() but to no avail.
I'm able to send the data back and forth to a seperate php page but I'm stuck trying to achieve what I am looking for.
EDIT:
The code that I posted was quickly written and the syntax isn't the issue in question, I'm merely wondering how I can refresh a <div> under the form so that it will once again do the if(isset($_GET["one"])) check and print the updated php variables.
EDIT 2:
My code is now as follows:
Index.php
...
<form id="calculator_form" name="form" action="" method="get" >
<input name="one" type="text">
<input name="two" type="text">
<input type="submit">
</form>
...
<div id="append">
<!-- where I want the ajax response to show -->
</div>
...
ajax.php
<?php if(isset($_GET["one"])) { ?>
<div>
<?php echo $_GET["one"] . " " . 4_GET["two"]; ?>
</div>
<!-- assume there's n number of divs -->
<?php } ?>
Now I want the ajax.php div to append to the #append div in index.php. There has to be a better way than altering the ajax.php and using echo:
ajax.php (with echo)
<?php
if(isset($_GET["one"])) {
echo "<div>". $_GET["one"] . " " . $_GET["two"] . "</div>";
}
?>
So, as ajax.php could be very large, is there a better solution than
just echoing data from ajax.php to index.php?

Now this can be done in many ways.. One of them is Following.. Try this:
Index.php file
<form method="get" id="calculator_form">
<input name="one" type="text" id="one">
<input name="two" type="text" id="two">
<input type="submit" name="submit">
</form>
<div class="result"></div>
<script type="text/javascript">
$(document).ready(function(){
$("#calculator_form").on('submit', function(event){
event.preventDefault();
var one = $('#one').val(); // Taking value of input one
var two = $('#two').val(); // Taking value of input two
$.get( "ajax.php", { one:one, two:two }). done( function( data ) {
$('.result').html(data); // Printing result into result class div
});
});
});
</script>
ajax.php
<?php if(isset($_GET["one"])) { ?>
<div>
<?php echo $_GET["one"] . " " . $_GET["two"]; ?>
</div>
<?php } ?>

Use this,
$(document).ready(function() {
$(document).on('submit',"#calculator_form",function(event) {
event.preventDefault();
$.get(
'ajax.php',
function(ret_data){
$("#divtoappend").html(ret_data);
}
);
});
}) ;
The original syntax for $.get is,
$.get(
URL,
{
VAR_NAME1:VAL1,
VAR_NAME2:VAL2
},
function(response){
// your action after ajax complete
}
);

Typo: You have accidentally used $(document).read( instead of $(document).ready(! That will stop your code running.
Note: jQuery has a handy shortcut for the document ready handler:
$(function(){
// your code here
});

I'm not sure if I understand the question correctly, but here is what you can do: Assign some ID or at least the css Class name to the target div and paint the stuff you are getting from AJAX response something like below.
$(document).ready(function() {
$("#calculator_form").submit(function(event) {
event.preventDefault();
$.ajax({
url: "Ajax_URL",
success: function(result) {
$("#targetDiv").html(result.one + " " + result.two); //assuming you have assigned ID to the target div.
}
});
})
})

How to refresh using ajax and keep form data

I'm working on a live discussion form. The page loads the threads from MySQL, and refreshes via AJAX every 4 seconds. After the last comment on each thread, there's a text input for comments (very similar to Facebook).
Everything works fine, except that when the user is writing in the input and the page refreshes, the message disappears. Security and privacy is the main goal on this project, that's why I don't want to use cookies. I have tried many solutions, and searched several hours for a solution but nothing seems to work.
Is it a possible solution to $_post every time that page refreshes?
In case of caching the entered values and retrieving them from $_session or local storage, can anyone suggest a more specific approach? i.e: where to put the listeners :)
I've tried to make a function that prevents reloading the page if the value of the input is different to "", but even this didn't work for me.
Here is my refresh code:
<script type="text/javascript">
var PHP = "msgboard.php";
function updateShouts(){
$('#msgboard').load(PHP);
}
window.setInterval( "updateShouts()", 4000 );
</script>
And here is the main PHP function:
while($row = mysql_fetch_array($resultados)) {
echo '<div class="post">
<div class="user"><b>'.$row["user"].'</b></div>';
echo ' <div class="txt">'.$row["msg1"].'</div>
</div>';
$sql2="SELECT * FROM table WHERE masterid = '".$row['id']."'ORDER BY id ASC";
$resultados2 = mysql_query($sql2);
while($row2 = mysql_fetch_array($resultados2)) {
echo '<div class="comment">
<div class="txt"><b>'.$row2['user'].'</b>';
echo ' '.$row2['msg1'].'</div>
</div>';
}
echo '<div class="commentform">
<form action="board.php" method="post">
<input type="text" size="75" name="message" id="message1">
<input type="hidden" name="masterid" value="'.$row['id'].'">
<input type="submit" name="Submit" value="Enviar"></form>
</div>' ;
}
Thanks in advance!

As #aziz pointed out in the comments, if you just want to update the comments, you only need to update that part of your page.
Step 1: Add a container to the comments so you can target the update to that container
You will notice there is now a new div <div id="comments_contaner"> in the code which will contain all the comments.
Also when you are outputting HTML, it is easier / more legile to just close the PHP tag and use <?= $variable ?> if you need to place a PHP variable in the HTML.
msgboard.php:
<?
while($post = mysql_fetch_array($resultados))
{
?>
<div class="post">
<div class="user"><b><?= $post["user"]?></b></div>
<div class="txt"><?= $post["msg1"]?></div>
</div>
<div id="comments_contaner">
<?
// This code can be ommited as you can just call updateShouts() upon page load to fetch the comments
$comments = mysql_query("SELECT * FROM table WHERE masterid = '{$post['id']}' ORDER BY id ASC");
while($comment = mysql_fetch_array($comments))
{
?>
<div class="comment">
<div class="txt"><b><?= $comment['user'] ?></b> <?= $comment['msg1'] ?></div>
</div>
<?
}
?>
</div>
<div class="commentform">
<form action="board.php" method="post">
<input type="text" size="75" name="message" id="message1">
<input type="hidden" name="masterid" value="<?= $post['id'] ?>">
<input type="submit" name="Submit" value="Enviar">
</form>
</div>
<?
}
?>
Step 2: Create a PHP function to update the comments
This function will only output the comments, it will need the masterid as a parameter to know which comments to output.
updateComments.php:
<?
$masterid = $_GET['masterid']
$comments = mysql_query("SELECT * FROM table WHERE masterid = '{$masterid}' ORDER BY id ASC");
while($comment = mysql_fetch_array($comments))
{
?>
<div class="comment">
<div class="txt"><b><?= $comment['user'] ?></b> <?= $comment['msg1'] ?></div>
</div>
<?
}
?>
Step 3: Call the PHP update function in your script targeting the container div
You will need to pass the $row['id'] as a parameter in the URL
<script type="text/javascript">
var PHP = "updateComments.php?masterid=<?= $post['id']?>";
function updateShouts(){
$('#comments_contaner').load(PHP);
}
window.setInterval( "updateShouts()", 4000 );
</script>
PD: I have not tested this code, it is just to show you the main idea.
EDIT: Corrected variable names and added comment.

Perhaphs you should look into stateful HTTP connections. So whenever a new message is added to the board on the server-side, all the clients are notified. This way, you don't have to refresh the page unnecessarily. HTML5 supports Web Sockets that can make it possible. Here are some links I came across that you may find useful:
Create Bi-directional connection to PHP Server using HTML5 Web Sockets
Wikipedia Page on WebSocket
socketo.me