Hi, I recently learned how to use AJAX, but I'm having a problem with it. What I'm trying to do is validate a form with PHP, and write the output of the validation in the same page. From the last question I have asked in bytes.com, I was introduced to AJAX(well, I always knew it, but I never used it). So, I wrote the following code accordingly:
index.html: -
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
-
-
<html lang="en-US" xml:lang="en-US" xmlns="http://www.w3.org/1999/xhtml">
-
<head>
-
-
<title> Unimail </title>
-
-
<script type="text/javascript" src="/scripts/main.js"></script>
-
<link rel="shortcut icon" href="/images/favicon.ico" />
-
<link rel="stylesheet" type="text/css" href="/styles/main.css" />
-
-
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
-
<meta property="og:description" content="Free one-time use email" />
-
<meta property="og:title" content="Unimail email service" />
-
<meta name="author" content="Unimail" />
-
<meta property="og:site_name" content="Unimail" />
-
-
</head>
-
-
<body>
-
-
<div id="wrapper">
-
<div id="top">
-
<div class="header">
-
<img src="/images/email_logo4.jpg" alt="Unimail" />
-
</div>
-
<div class="navig">
-
<ul class="navbar">
-
<li><a href="http://localhost/index.html"><span>Home</span></a></li>
-
<li><a href="#">About us</a></li>
-
<li><a href="#">FAQ</a></li>
-
<li><a href="#">Contact</a></li>
-
<li><a href="#">Other services</a></li>
-
</ul>
-
</div>
-
</div>
-
-
<div id="body">
-
<br />
-
<p> Hello! Welcome to Unimail! With Unimail, you can send emails without registering. No inbox, no pre-chosen address, no name. One-time email! </p>
-
-
<br /><br />
-
-
<form name="sendmail" action="/scripts/send.php" method="post" class="sender">
-
-
<p>Recipient's address </p> <input name="recipient" type="text" id="recipient" /><br />
-
<p> Title </p><input name="title" type="text" id="title" />
-
<p> Body </p><textarea rows="15" cols="65" name="body" id="body" ></textarea><br />
-
<input name="submit" type="submit" value="Send!" onclick="getObject();"/>
-
<span id="error"> </span>
-
-
</form>
-
<p> Remember! You will not be able to receive any reply! </p>
-
</div>
-
<div id="footer">
-
<p> This site was created for occasional emailing. Please do not attempt to use this site to spam emails. </p>
-
</div>
-
-
</div>
-
-
</body>
-
-
</html>
-
send.php: -
<?php
-
-
require_once('class.phpgmailer.php');
-
-
$emailRep = "";
-
$titleRep = "";
-
$bodyRep = "";
-
-
function verifyEmail($email)
-
{
-
if (filter_var($email, FILTER_VALIDATE_EMAIL) == true)
-
{
-
return true;
-
}
-
-
$emailRep = "Error: Invalid email address!";
-
}
-
-
function verifyTitle($title)
-
{
-
if (strlen($title) > 0)
-
{
-
return true;
-
}
-
-
$titleRep = "Error: Empty titles are not allowed!";
-
}
-
-
function verifyBody($body)
-
{
-
if (strlen($body) > 19)
-
{
-
return true;
-
}
-
-
$bodyRep = "Error: Your email must consist of at least 20 character!";
-
}
-
-
$to = $_POST['recipient'];
-
$subject = $_POST['title'];
-
$message = $_POST['body'];
-
-
if (verifyEmail($to) && verifyTitle($subject) && verifyBody($message))
-
{
-
$mail = new PHPGMailer();
-
$mail->Username = 'unimail.auto@gmail.com';
-
$mail->Password = '***********';
-
$mail->From = 'unimail.auto@gmail.com';
-
$mail->FromName = 'Unimail';
-
$mail->Subject = $subject;
-
$mail->AddAddress($to);
-
$mail->Body = $message;
-
$mail->Send();
-
-
echo "Message sent!";
-
}
-
-
else
-
{
-
echo $emailRep . "<br />" . $titleRep . "<br />" . $bodyRep;
-
}
-
-
?>
-
main.js: -
function getObject()
-
{
-
var http;
-
-
try
-
{
-
http = new XMLHttpRequest();
-
}
-
-
catch(e)
-
{
-
try
-
{
-
http = new ActiveXObject("Msxml2.XMLHTTP");
-
}
-
-
catch(e)
-
{
-
http = new ActiveXObject("Microsoft.XMLHTTP");
-
}
-
}
-
-
function getServer()
-
{
-
if (http.readyState == 4)
-
{
-
if (http.responseText.match("Error") == "Error")
-
{
-
document.getElementById("error").style.color = "red";
-
document.getElementById("error").innerHTML = " " + http.responseText;
-
}
-
-
else
-
{
-
document.getElementById("error").style.color = "green";
-
document.getElementById("error").innerHTML = " " + http.responseText;
-
}
-
}
-
}
-
-
var email = document.getElementById("recipient");
-
var title = document.getElementById("title");
-
var body = document.getElementById("body");
-
-
http.open("POST", "send.php", true);
-
http.onreadystatechange = getServer();
-
http.send(null);
-
}
-
However, it is not working. From what I understand, after checking for flow in each of the files, there's a problem with my JS code. I may be wrong, but from what I tested it seems that it's a problem with the JS.
What's wrong?? I can't figure it out!
Thanks! :D
26  2684  Dormilich 8,658
Recognized Expert Moderator Expert
there are several problems:
- index.html #49. whatever getObject() does, after it is done the form will submit, the page reload and thus no JavaScript output visible.
- main.js #46. a DOM-0 event handler expects a function to be passed, not a function return value. i.e. http.onreadysta techange = getServer;
Thanks for the reply!
How could I fix the problem with getObject() so that I will be able to display what I want, the way I want(in the same page). I know this is a simple question, but I'm not very familiar with how AJAX works :P
Dormilich 8,658
Recognized Expert Moderator Expert
either use a click button or prevent the form from submitting (either by preventing the default action or by explicitly returning false from the event attribute)
I did this according to this example: http://www.tizag.com/ajaxTutorial/aj...ttprequest.php
Why does it stay on the same page for them, and not for me? I would really like to avoid doing such things like preventing the form from submitting.
Edit:
I removed the action="/scripts/send.php" from index.html. However, it is still not working. I'm getting no output.
Dormilich 8,658
Recognized Expert Moderator Expert
Why does it stay on the same page for them, and not for me?
because they don’t use a submit button.
Thanks for the reply:D
Can you give me any example for a code that actually works? I have no idea how to work with event attributes(I only recently started doing websites.. I'm more of a desktop guy).
Dormilich 8,658
Recognized Expert Moderator Expert
I have no idea how to work with event attributes(I only recently started doing websites.. I'm more of a desktop guy).
how much do you want to understand JavaScript Events?
Can you give me any example for a code that actually works?
do you have a working page, so that I can check whether the AJAX itself works?
I want to understand JS events as much as I can. My goal is to be good.
About the page, I don't use any external hosting. I run it with my Apache server.
Dormilich 8,658
Recognized Expert Moderator Expert
I want to understand JS events as much as I can.
this will not be a piece of cake …
on another thread I wrote a short summary about Events.
you should additionally read some resources:
- Peter Paul Koch’s Quirksmode.org ( Intro, ToC)
- the DOM-Events specifications: DOM-2-Events, DOM-3-Events (there should be something for IE on the MSDN website, too). note that these documents are technical, they exactly describe how events work, i.e. it is not meant as tutorial. still, the introduction section is worth a read to understand the event flow.
Sign in to post your reply or Sign up for a free account.
Similar topics | |
by: k.mitz |
last post by:
Hi,
I have a PHP application that allows users to generate a .pdf report of
their database content. Normally, I've had to refresh a page to call
the script to generate the report, so there's a second or so when the
browser goes blank. I was wondering if it was possible to use AJAX to
call the script to generate the report, then begin the...
|
by: joeakabloo |
last post by:
I've been working on an AJAX web app, my first one actually.
Run into an issue I'm not sure how to resolve (been googling and
reading trying to find a fix).
Basic premise: Using AJAX to handle calls to PHP scripts, which return
DOM-creating javascript to the browser. This javascript usually creates
forms. No issue with performance, works...
|
by: yonido |
last post by:
hey
my final goal: to add a link to an email message, that will contact my
server & mark the email as "important", with no popup windows/annoying
messages.
id like to do this in ajax, but the problem is javascript support in
emails.
i want it to work in every computer, even if its viewed in gmail.
|
by: BeeRich |
last post by:
Hi folks.
I built an ajax.updater reply in a website on a Mac, and she works
fine. It's a simple reply, the html supplied is correct, and I also
supply the target DIV as well.
Just wondering why a PC won't show anything.
Cheers
|
by: Samuel |
last post by:
Hi,
I have ASP.NET user control that implements ICallbackEventHandler. Partial
postback works perfectly when I put control on a regular webform.
But when I put it on page that has master page control doesn't work.
I'm getting following error :"The target <namefor the callback could not
be found or did not implement ICallbackEventHandler."...
| | |
by: sebastian.janoschka |
last post by:
Hi,
I build my first Drag & Drop with JavaScript and I would like to drag
the pictures when I click on it.
When I create a normal div tag with some text the script works, but
when I put a image in the div tag it works not correctly.
Here is my Code... I integrated three pictures and one text, then you
can see the differences.
|
by: gunimpi |
last post by:
http://www.vbforums.com/showthread.php?p=2745431#post2745431
********************************************************
VB6 OR VBA & Webbrowser DOM Tiny $50 Mini Project Programmer help
wanted
********************************************************
For this teeny job, please refer to:
http://feeds.reddit.com/feed/8fu/?o=25
|
by: Tony Sedgwick |
last post by:
I have installed the AJAX extensions and partial page rendering works ok
from a new ajax enabled web site I created in VS. The problem is that I've
manually entered the necessary entries into the web.config into an existing
project and the same asp.net file doesn't work from the migrated web.config
project.
When I compared the html source...
|
by: jrnail23 |
last post by:
I have a user control which contains an UpdatePanel, which contains a
MultiView inside, with a GridView in one of the views.
In my GridView, I have a ButtonField which is supposed to trigger a
server-side operation, using the RowCommand functionality.
In IE, this all works great, but in Firefox (v2.0.0.6), clicking the
above mentioned...
|
by: krg |
last post by:
Hi,
I started writing this blog some time back and it would be
great if I could get an audience here and even better if we could have
a conversation about developments possible on the techniques I have
discussed in my blog.
Automatic Javascript Bug Reporting Using AJAX
http://krahulg.wordpress.com/2007/12/24/automatic-javascript-bug-...
|
by: jinu1996 |
last post by:
In today's digital age, having a compelling online presence is paramount for businesses aiming to thrive in a competitive landscape. At the heart of this digital strategy lies an intricately woven tapestry of website design and digital marketing. It's not merely about having a website; it's about crafting an immersive digital experience that...
| | |
by: Hystou |
last post by:
Overview:
Windows 11 and 10 have less user interface control over operating system update behaviour than previous versions of Windows. In Windows 11 and 10, there is no way to turn off the Windows Update option using the Control Panel or Settings app; it automatically checks for updates and installs any it finds, whether you like it or not. For...
|
by: tracyyun |
last post by:
Dear forum friends,
With the development of smart home technology, a variety of wireless communication protocols have appeared on the market, such as Zigbee, Z-Wave, Wi-Fi, Bluetooth, etc. Each protocol has its own unique characteristics and advantages, but as a user who is planning to build a smart home system, I am a bit confused by the...
|
by: agi2029 |
last post by:
Let's talk about the concept of autonomous AI software engineers and no-code agents. These AIs are designed to manage the entire lifecycle of a software development project—planning, coding, testing, and deployment—without human intervention. Imagine an AI that can take a project description, break it down, write the code, debug it, and then...
|
by: conductexam |
last post by:
I have .net C# application in which I am extracting data from word file and save it in database particularly. To store word all data as it is I am converting the whole word file firstly in HTML and then checking html paragraph one by one.
At the time of converting from word file to html my equations which are in the word document file was convert...
|
by: TSSRALBI |
last post by:
Hello
I'm a network technician in training and I need your help.
I am currently learning how to create and manage the different types of VPNs and I have a question about LAN-to-LAN VPNs.
The last exercise I practiced was to create a LAN-to-LAN VPN between two Pfsense firewalls, by using IPSEC protocols.
I succeeded, with both firewalls in...
|
by: adsilva |
last post by:
A Windows Forms form does not have the event Unload, like VB6. What one acts like?
| | |
by: 6302768590 |
last post by:
Hai team
i want code for transfer the data from one system to another through IP address by using C# our system has to for every 5mins then we have to update the data what the data is updated we have to send another system
|
by: bsmnconsultancy |
last post by:
In today's digital era, a well-designed website is crucial for businesses looking to succeed. Whether you're a small business owner or a large corporation in Toronto, having a strong online presence can significantly impact your brand's success. BSMN Consultancy, a leader in Website Development in Toronto offers valuable insights into creating...
| |
