I have a signup form div which should open on a button click. It is set to display: none by default on page load. On a failed form submit, I have this code in my JS file (which works, I tested with a display: inline-block setting by default):
$(document).ready(function(){
<?php
if(isset($_POST['signUp']) && count($errors)>0){
?>
$ ('#home-sign-up-box').show();
<?php
}elseif(isset($_POST['signUp']) && count($errors)==0){
?>
$('#home-sign-up-box').hide();
<?php
}else{
?>
$('#home-sign-up-box').show();
<?php
}
?>
});
I also have this code which should show the div (it worked before I added the code above):
// Log in and sign up buttons
$("#log-in-button").click(function() {
$("#home-log-in-box").show();
$("#home-log-in-box").animate({
"opacity":1
}, 115);
$(".body-darken").show();
$(".body-darken").animate({
"opacity":0.5
}, 115);
});
$(".body-darken").click(function() {
$("#home-log-in-box").animate({
"opacity":0
}, 115);
$("#home-log-in-box").hide();
$("#home-sign-up-box").hide();
$(".body-darken").animate({
"opacity":0
}, 115);
$(".body-darken").hide();
});
$("#home-log-in-close").click(function() {
$("#home-log-in-box").animate({
"opacity":0
}, 115);
$("#home-log-in-box").hide();
$(".body-darken").animate({
"opacity":0
}, 115);
$(".body-darken").hide();
});
$("#sign-up-button").click(function() {
$("#home-sign-up-box").show();
$("#home-sign-up-box").animate({
"opacity":1
}, 115);
$(".body-darken").show();
$(".body-darken").animate({
"opacity":0.5
}, 115);
});
$("#home-sign-up-close").click(function() {
$("#home-sign-up-box").animate({
"opacity":0
}, 115);
$("#home-sign-up-box").hide();
$(".body-darken").animate({
"opacity":0
}, 115);
$(".body-darken").hide();
});
They are both in the same file, in the order shown. Thanks so much! Any help is much appreciated!
Russell C.
The most important point is that your js file is parsed by the browser, not the server, and the browser knows nothing about php, let alone $_POST. You can only include static js in the .js files you include.If you need to write "dynamic" js, based on php variables, then you have to include it in the header section of your page, not in a static js file. I would do something like the following. The php decides which if the three js lines is included:
<?php
$html = "<head>
";
$html .= ...
$html .= "<script>
";
$html .= " $(document).ready(function(){
";
if(isset( $_POST['signUp'] ) && count($errors)>0) {
$html .= " $('#home-sign-up-box').show();
";
}elseif(isset($_POST['signUp']) && count($errors)==0){
$html .= " $('#home-sign-up-box').hide();
";
}else{
$html .= " $('#home-sign-up-box').show();
";
};
$html .= " })
";
$html .= "</script>;
";
$html .= ...
$html .= "</head>
";
$html .= "<body>
";
$html .= ...
...
echo $html;
My guess about why your page stopped working is that the browser hit all that php stuff in your js file and abandoned ship.
Good luck