PDA

View Full Version : Can javascript function send its argument data to PHP script within the same function



sufian.javed
Jun 4th, 2007, 01:04 PM
<input type="image" id="imageField" class="btn" src="<?php bloginfo('template_url'); ?>/media/global/btn-go.gif" onclick = "sendRequestPost(document.getElementById('email1').value);" />

The function sendRequestPost() is in a file named header.php:

function sendRequestPost(data) {
// Open PHP script for requests

MM_validateForm('email1','','RisEmail');

if (document.MM_returnValue) {
<?php
$email = ??????????????????????????????????
$subject = 'The Second Floor: Test 000 Welcome!';
$message = 'Greetings!'. "\r\n\r\n";
$message .= 'Thank you for signing up for updates via the T2F website. We will keep you posted on events, new coffee concoctions, and fresh book titles.'. "\r\n\r\n";
$message .= 'We look forward to seeing you soon.'. "\r\n\r\n";
$message .= 'Peace!'. "\r\n";
$message .= 'Sabeen'. "\r\n\r\n";
$message .= 'http://www.t2f.biz'. "\r\n";
$message .= 'http://www.t2f.biz/t2f-events'. "\r\n";
$message .= 'http://www.t2f.biz/blog';
$headers = 'From: Sabeen Mahmud <[email protected]>'. "\n";
$headers .= 'Bcc: [email protected]';
mail($email, $subject, $message, $headers);
?>
http.open('post', phpscript);
http.setRequestHeader('Content-Type', 'application/x-www-form-urlencoded');
http.onreadystatechange = handleResponsePost;
http.send('email1='+data);
}
}

The file subscribe.php is as under:
<?php
/* Short and sweet */
if (! isset($wp_did_header)):
$wp_did_header = true;
require_once( dirname(__FILE__) . '/wp-config.php');
global $wpdb;
if(isset($_POST['email1'])){
$email = $_POST['email1'];
$query2 = "SELECT * FROM rs_em WHERE EMAIL = '".$email."'";
$found = $wpdb->get_var($query2);
if (!$found) {
//<div id="message" class="success"></div>
echo("<div id=\"message\" class=\"success\">Thank you! We will keep you posted.</div>");
/*
$subject = 'The Second Floor: Test 000 Welcome!';
$message = 'Greetings!'. "\r\n\r\n";
$message .= 'Thank you for signing up for updates via the T2F website. We will keep you posted on events, new coffee concoctions, and fresh book titles.'. "\r\n\r\n";
$message .= 'We look forward to seeing you soon.'. "\r\n\r\n";
$message .= 'Peace!'. "\r\n";
$message .= 'Sabeen'. "\r\n\r\n";
$message .= 'http://www.t2f.biz'. "\r\n";
$message .= 'http://www.t2f.biz/t2f-events'. "\r\n";
$message .= 'http://www.t2f.biz/blog';
$headers = 'From: Sabeen Mahmud <[email protected]>'. "\n";
$headers .= 'Bcc: [email protected]';
mail($email, $subject, $message, $headers);
*/
$query = "INSERT INTO rs_em (email) VALUES ('".$email."')";
$wpdb->query($query);
} else {
// <div id="message" class="error"></dib>
echo("<div id=\"message\" class=\"error\">Ooops. We already have this <nobr>e-mail</nobr> address in our database. Please enter another address.</div>");
}
}
endif;
?>

Actually the Ajax message come after 8 to 9 seconds here and the same PHP mail function takes only 1.5 to 2 seconds when written in header.php but how can I use the email from $_POST here (the mail is only sent to BCC in this case)?
Please help me, this is my first task as a web developer for the website (www.t2f.biz). How can I use the argument value of the function to send email. Thx

cyberlogi
Jun 4th, 2007, 07:28 PM
No, JavaScript cannot directly communicate with your server-side scripting language as JavaScript is running on the client-side. You have some subsection of the internet separating the two. You have to either send an HTTPRequest and load/reload a new page or use AJAX to send the message.

sufian.javed
Jun 5th, 2007, 08:34 AM
Thx for your reply. Actually the right way to code PHP mail function is in I guess the following subscribe.php file:
<?php

if (! isset($wp_did_header)):
$wp_did_header = true;
$subject = 'The Second Floor: Welcome!';
$message = 'Greetings!'. "\r\n\r\n";
$message .= 'Thank you for signing up for updates via the T2F website. We will keep you posted on events, new coffee concoctions, and fresh book titles.'. "\r\n\r\n";
$message .= 'We look forward to seeing you soon.'. "\r\n\r\n";
$message .= 'Peace!'. "\r\n";
$message .= 'Sabeen'. "\r\n\r\n";
$message .= 'http://www.t2f.biz'. "\r\n";
$message .= 'http://www.t2f.biz/t2f-events'. "\r\n";
$message .= 'http://www.t2f.biz/blog';
$headers = 'From: Sabeen Mahmud <[email protected]>'. "\n";
$headers .= 'Bcc: [email protected]';
require_once( dirname(__FILE__) . '/wp-config.php');
global $wpdb;
if(isset($_POST['email1'])){
$email = $_POST['email1'];
$query2 = "SELECT * FROM rs_em WHERE EMAIL = '".$email."'";
$found = $wpdb->get_var($query2);
if (!$found) {
echo("<div id=\"message\" class=\"success\">Thank you for signing up. An e-mail will be sent to your account shortly and we will keep you posted.</div>"); $query = "INSERT INTO rs_em (email) VALUES ('".$email."')";
$wpdb->query($query);
mail($email, $subject, $message, $headers); }
else {
echo("<div id=\"message\" class=\"error\">Ooops. We already have this <nobr>e-mail</nobr> address in our database. Please enter another address.</div>");
}
}
endif;
?>

But I have tried this before and it took almost 8 to 9 seconds to display the following AJAX message:
echo("<div id=\"message\" class=\"success\">Thank you for signing up. An e-mail will be sent to your account shortly and we will keep you posted.</div>");

header.php file is as under (after deleting the code for sending mail):

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="<?php bloginfo('html_type'); ?>; charset=<?php bloginfo('charset'); ?>" />
<title><?php bloginfo('name'); ?> <?php wp_title(); ?></title>
<link href="<?php bloginfo('template_url'); ?>/css/base.css" rel="stylesheet" type="text/css" />
<link href="<?php bloginfo('template_url'); if (is_home()) {echo('/style.css');} else { echo('/css/page.css');}?>" rel="stylesheet" type="text/css" />
<link href="<?php bloginfo('template_url'); ?>/css/subnav.css" rel="stylesheet" type="text/css">

<script type="text/javascript" src="<?php bloginfo('template_url'); ?>/js/base.js"></script>

<!-- sIFR Implementation -->
<?php require_once('sifr.php'); ?>
<script type="text/javascript" language="javascript">

// Set path to PHP script
var phpscript = 'subscribe.php';

function createRequestObject() {
var req;
if(window.XMLHttpRequest){
// Firefox, Safari, Opera...
req = new XMLHttpRequest();
} else if(window.ActiveXObject) {
// Internet Explorer 5+
req = new ActiveXObject("Microsoft.XMLHTTP");
} else {
// There is an error creating the object,
// just as an old browser is being used.
alert('There was a problem creating the XMLHttpRequest object');
}
return req;
}

// Make the XMLHttpRequest object
var http = createRequestObject();

function sendRequestGet(act) {
// Open PHP script for requests
http.open('get', phpscript+'?email1='+act);
http.onreadystatechange = handleResponseGet;
http.send(null);
}

function sendRequestPost(data) {
// Open PHP script for requests
MM_validateForm('email1','','RisEmail');
if (document.MM_returnValue) {
http.open('post', phpscript);
http.setRequestHeader('Content-Type', 'application/x-www-form-urlencoded');
http.onreadystatechange = handleResponsePost;
http.send('email1='+data);
}
}

function handleResponseGet() {
if(http.readyState == 4 && http.status == 200){
// Text returned from PHP script
var response = http.responseText;
if(response) {
// Update ajaxTest content
document.getElementById("dt").innerHTML = response;
}
}
}

function handleResponsePost() {
if(http.readyState == 4 && http.status == 200){
// Text returned from PHP script
var response = http.responseText;
if(response) {
// Update ajaxTest2 content
document.getElementById("dt").innerHTML = response;
//alert(response);
}
}
}
</script>
</head>
<body>
<div id="shadow-head"></div>
<div id="shadow-body"><!--SITE WRAPPER STARTS (ends in footer.php)-->
<div id="site-wrapper">
<div id="head">
<div id="hair">
<h1><a href="<?php bloginfo('url')?>">
<span>The Second Floor</span>
</a></h1>
<p>coffee &bull; books &bull; conversation </p>

</div>
</div>


Where:
http.open('post', phpscript); is calling the subscribe.php file. Because of this delay which I am getting I have decided to code the mail function inside the function sendRequestPost() and it took only 1.5 to 2 seconds to send the mail but I am still not able to get the email the user enters inside this function that is why I was asking:
"Can javascript function send its argument data to PHP script within the same function."
Now as you said No. Then can their be any solution to display the AJAX message below the text box quickly?
Waiting for your kind reply
Sufian

cyberlogi
Jun 7th, 2007, 01:43 AM
Yes, you can use AJAX to quickly send and receive requests from the server. However, AJAX is rather complicated to complete explain here and it would be better if you have some kind of wrapper object/method.

The two most popular Frameworks are:

connection manager in
YUI (http://developer.yahoo.com/yui/)

Ajax object in
prototype (http://www.prototypejs.org/)

I prefer using YUI.

Once you have your AJAX system, use event listeners to capture your form 'onsubmit' event and send the forms values to the backend through AJAX. Process on the backend and print the message you want the front-end to receive in valid XML format. You'll setup a callback function for successful requests and then inside that method you'll update your message.