I had tried copy and pasting your entire code, it doesn’t work. Check right now, its there
Also, lol at your bio
Neutra photo booth shabby chic tote bag. Blog +1 authentic, Austin locavore next level cardigan McSweeney’s Carles. Semiotics lumbersexual Bushwick tote bag flannel vegan, Tumblr selfies. Iphone fingerstache heirloom selfies. Hella hashtag YOLO salvia, sriracha selvage vegan pour-over. American Apparel polaroid roof party, actually keytar mumblecore banjo normcore Echo Park mlkshk. Tilde stumptown Neutra, mlkshk McSweeney’s flexitarian sartorial ready-made listicle vegan drinking vinegar bitters.
Your page seems to be workig now.
Are you sure? I’m not seeing any result. I tried clearing cache as well. As for the text, you can thank katrina for that.
What are you doing, and what do you expect it to do?
All it’s doing right now is seeing if your field is NOT blank, and showing the error message (I explained why you shouldn’t bother validating in JS since you have type=“email” / required).
That’s what I’m seeing live.
I foudn the issue, it was working but my browser wasn’t recognizing it as a valid email address (i was typing asdf). i’m not used to these smart browsers. WHen I left it blank the browser gave me an error message, but not when it wasnt valid email address format. I found out cuz I tried in chrome and chrome alerted me when I didn’t have valid email address format. Okay, time for next hurdle and try to validate with ajax/php
Right - and because of it being type=“email”. It wasn’t actually submitting (and thus never made it to your JS).
[code][/code]
When I try adding that ajax in (using a webpage tutorial) it shows the div automatically now. Note that I have nothing yet in the process.php form other than my variable declaring my email address, but that shouldn’t matter yet
The success is whether it actually made it to scripts/process.php / didn’t error out getting there.
What you are looking for is to grab the return data from PHP and based on what data is returned, YOU decide whether it was success/fail.
So in the PHP file I somehow declare whether $ajax is a success? I assume when email is sent itll be success, but how would I declare that? I was testing the fail/success by whether or not the #error message of thank you for subscribing showed. Is that not the correct approach?
Here is my subscribers code.
Try to adapt it.
$("#subscribers").submit(function(event) {
event.preventDefault();
if($("#subscribers").valid())
{
$("body").append("<div class=\"overlay\"><div class=\"loading-bar\"><span></span><span></span><span></span><span></span><span></span></div></div>");
$(".overlay").css("z-index","9999");
var email=$("#subEmail").val();
$("#subEmail").prop("disabled", true);
$.ajax({
type: "POST",
dataType: "text",
data: {
'subEmail': email
},
url: "/cadeui/system/includes/process-home",
success: function(data) {
data = JSON.parse(data);
if(data.result[0])
{
$(".overlay").remove();
$("#subscribers").fadeTo(1000,0);
$("<p class=\"success-message\"><span>Success:</span> You have been successfully subscribed to the CadeUI newsletter. Please check your e-mail, <strong>"+data.result[1]+"</strong>, for the confirmation code.</p>").appendTo("#newsletter").delay(1500).fadeIn(1000);
}
else
{
$(".overlay").remove();
$("#subEmail").prop("disabled", false);
if(data.result[1]==="doubleentry")
{
$("<span id=\"attempts-error\" class=\"error\">Error: You are already subscribed</span>").appendTo("#subscribers");
}
else if(data.result[1]==="format")
{
$("<span class=\"error\">Error: Please enter a valid e-mail address</span>").appendTo("#subscribers");
}
$("#subEmail").removeClass("valid").addClass("error");
}
}
});
}
return false;
});
Then in the PHP
if(isset($_POST["subEmail"]))
{
$email=filter_input(INPUT_POST,"subEmail");
$formData=new Subscribers($pdo);
$isValid=$formData->newSubscriber($email);
}
$isAjax = !empty($_SERVER['HTTP_X_REQUESTED_WITH']) && strtolower($_SERVER['HTTP_X_REQUESTED_WITH']) == 'xmlhttprequest';
if($isAjax)
{
$result=["result" => $isValid];
header("Content-Type: application/json");
exit(json_encode($result));
}
if(isset($_POST["subscribe"]))
{
if($isValid[0])
header("Location: http://www.codefundamentals.com/cadeui/index?result=subscribed&email=".$isValid[1]."#newsletter");
else
header("Location: http://www.codefundamentals.com/cadeui/index?error=$isValid[1]#newsletter");
}
That final if statement is for if JS isn’t enabled. You need a fallback for displaying the error message.
Can you read that code? Are you confused about what it does?
FYI:
$formData=new Subscribers($pdo);
$isValid=$formData->newSubscriber($email);
That right there is connecting to my Subscribers class. $isValid holds the array that I return. If it’s a good result, then $isValid[0] is true. IF false, then $isValid[0] is false, and I hold the error reason in $isValid[1].
You can see I append a brief error message in the return header for my purposes so when I return users, I can give them a good error message.
Note in the JS I check for [0] because that holds the true/false. It’s just encoded differently for the jQuery.
You can see my code in action at codefundamentals.com/cadeui/ . Try subscribign.
I understand some of it. I will have to google some. Is your PHP file named process-home?
Yup.
[code][/code]
PHP
[code]if(isset($_POST[“enter-information”]))
{
$email=filter_input(INPUT_POST,“enter-information”);
$formData=new Subscribers($pdo);
$isValid=$formData->newSubscriber($email);
}
$isAjax = !empty($_SERVER[‘HTTP_X_REQUESTED_WITH’]) && strtolower($_SERVER[‘HTTP_X_REQUESTED_WITH’]) == ‘xmlhttprequest’;
if($isAjax)
{
$result=[“result” => $isValid];
header(“Content-Type: application/json”);
exit(json_encode($result));
}
if(isset($_POST[“subscribe”]))
{
if($isValid[0])
header(“Location: http://www.reesecodes.com/index?result=subscribed&email=“.$isValid[1].”#newsletter”);
else
header(“Location: http://www.reesecodes.com/index?error=$isValid[1]#newsletter”);
}[/code]
Not working, trying to fix it atm
Look at your Javascript console. You have errors.
And no, the button is clickable. It just doesn’t look at it because you did *{margin:0;padding:0;border:0;} (which I told you not to do )
I would not agree it’s z-index, because you have no positioning going on there. Why would you think it’s z-index?
Your console is telling you line 3 is invalid.
That line 3 comes from a jQuery plugin I put in which validates the form based on the rules I provide.
Remove the if statement / the closing bracket for it. You don’t have that plugin.
I have no js console. Also I realized that 2 seconds after I posted, which is why its deleted. What console are you speaking of, and which line are you talking about
You have a console. Right click → Inspect element. At the top, it says Elements, Network, Sources, etc.
At the end, it says console. That’s your Javascript console.
I already told you what line in my previous post.
??? Firebug? I don’t even see where it says elements, network, sources,
^^
I still dont see any error in console. only text in there says
Font from origin ‘http://www.reesecodes.com’ has been blocked from loading by Cross-Origin Resource Sharing policy: No ‘Access-Control-Allow-Origin’ header is present on the requested resource. Origin ‘http://reesecodes.com’ is therefore not allowed access.