Hi, Andrew, and thanks for the code.
I've been *partially* successful and I don't quite understand why things are
happening the way they are...it could be some of the ColdFusion code
involved.
When I run the login.cfm page with the "myForm" form, I end up with my
message being displayed for a successful login, but it's in this format,
{"login":"Login Successful"} which I think is the Json translation of
the data...
Also, the message is displayed on the "login_processor.cfm" page, instead
of the page with the form, "login.cfm", which is where the message
should end
up in plain text.
Here are the files involved:
- login.cfm
- login_processor.cfm
- manager_data.cfc
- cfjson.cfc (running the code your way probably makes this
unecessary, at the very least,
since, I assume, form.js is handling the Json
translation...?)
Here's what each of these files looks like:
login.cfm
___________________________________________________________________
<!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";>
<cfsetting showdebugoutput="no">
<head>
<script type="text/javascript" src="jquery.js"></script>
<script type="text/javascript" src="jquery.form.js"></script>
<script type="text/javascript">
$(document).ready(function() {
//bind 'myForm' and provide a simple callback function
$('#myForm').ajaxForm( {
dataType: 'json',
success: function(data) {
$('#contentdiv').empty().fadeIn(1000).append(data.login_message);
}
});
});
</script>
<style type="text/css">
body { font-family: Arial, Helvetica, sans-serif; }
#databox { border: 1px solid Gray;
margin:30px auto 0px auto;
padding: 10px;
width: 200px;}
#contentdiv { color:red; font-size: 30px; margin-top: 10px;}
</style>
</head>
<body>
<form id="myForm" action="login_processor.cfm" method="post">
Email: <input type="text" name="email_address" />
Password: <input type="password" name="password" />
<input type="submit" value="Login" />
</form>
<p id="contentdiv"> </p>
</body>
</html>
login_processor.cfm
_____________________________________________________________
<cfsetting showdebugoutput="no">
<cfset mdata = createObject("component","manager_data")>
<cfset thedata = mdata.getmanagerData(form.email_address,
form.password)>
<cfset ojson = createObject("component","cfjson")>
<cfset results = ojson.encode(thedata)>
<cfoutput>#results#</cfoutput>
manager_data.cfc
_______________________________________________________________
<cfcomponent displayname="manager_data" hint="Contains manager database
query" output="false">
<cffunction name = "getmanagerData">
<cfargument name = "email_address" type="string" required="yes">
<cfargument name = "password" type="string" required="yes">
<cfquery name="get_manager" datasource="login">
select email_address, password
from site_managers
where email_address = '#arguments.email_address#'
and password = '#arguments.password#'
</cfquery>
<cfset managerStruct = structNew()>
<cfif get_manager.recordcount gt 0>
<cfset managerStruct.login = "Login Successful">
<cfelse>
<cfset managerStruct.login = "Login Unsuccessful">
</cfif>
<cfreturn managerStruct>
</cffunction>
</cfcomponent>
And then there's cfjson.cfc, the content of which I won't post unless
you really
need to see it because there's a lot of code...
Is there some adjustment that's needed in my processing code/files since
I'm using the different jQuery code that you provided?
Any more help is appreciated!
Rick
aschmid wrote:
Rick,
You could try the form plugin as below
<form id="myForm" action="request_processor.cfm" method="post">
Email: <input type="text" name="email_address" />
Password: <input type="password" name="password" />
<input type="submit" value="Login" />
</form>
<script type="text/javascript" src="path/to/jquery.js"></script>
<script type="text/javascript" src="path/to/form.js"></script>
<script type="text/javascript">
$(document).ready(function() {
// bind 'myForm' and provide a simple callback function
$('#myForm').ajaxForm( {
dataType: 'json',
success: function(data) {
$('#contentdiv').empty().fadeIn(1000).append
(data.login_message);
}
});
});
</script>
Andrew
On Dec 7, 7:31 am, Rick Faircloth <[EMAIL PROTECTED]> wrote:
I'm trying to put my first Ajax to use by creating a login form.
To get there, I'm attempting to modify the first tutorial I've found which
I understand enough to understand what it's doing and how it's working
with a ColdFusion backend.
Anyway, my first question is: How do I modify the code below to
send an email address (form.email_address) and password (form.password)
to the url: "request_processor.cfm"?
The code below was just for a form with a select which, when the value
changed,
would cause an item in a db to be read and appear. I'm modifying it for
email_address
and password fields, with a submit button.
$(document).ready(function(){
$('#contentdiv').html(' ');
$('#idm').change(function(){
var formval = {idm:$(this).val()};
$.ajax({
type: "POST",
url: "request_processor.cfm",
dataType: "json",
data: formval,
success: function(response){
$('#contentdiv').empty().fadeIn(1000).append(response.main_dish);
}
});
});
});
So, I'd have:
$(document).ready(function(){
$('#contentdiv').html(' ');
$('#login-button').click(function(){
var formval = {email address, password:$(this).val()};
<--- (???)
$.ajax({
type:"post",
url:"request_processor.cfm",
dataType:"json",
data:formval
success:function(response){
$('#contentdiv').empty().fadeIn(1000).append(response.login_message);
}
});
});
});
What changes need to be made?
Thanks for any help!
Rick
---------------------------------------------------------------------------------------------------
Text inserted by Panda IS 2009:
This message has NOT been classified as spam. If it is unsolicited mail (spam), click
on the following link to reclassify it:
http://localhost:6083/Panda?ID=pav_21630&SPAM=true&path=C:\Documents%20and%20Settings\Rick%20Faircloth\Local%20Settings\Application%20Data\Panda%20Security\Panda%20Internet%20Security%202009\AntiSpam
---------------------------------------------------------------------------------------------------
