how to setup auto-close for popup in framework7 version1 - javascript

i am using a framwork7 js version 1 for my android mobile app.but there is a problem in login popup, after the successful login the router is working, but the popup is still on the screen, it is not close.
index file popup code
<div class="popup popup-login">
<div class="content-block">
<h4>LOGIN</h4>
<div class="loginform">
<form id="LoginForm" method="post" class="close-panel">
<div id="msgprint" style="display: block;"></div>
<input type="text" name="Username" id="username" value="" class="form_input required" placeholder="Username" />
<input type="password" name="Password" id="password" value="" class="form_input required" placeholder="Password" />
<input type="button" name="submit" class="form_submit" id="submitlogin" onclick="loginHost()" value="SIGN IN" />
</form>
<div class="signup_bottom">
<p>Don't have an account?</p>
SIGN UP
</div>
</div>
<div class="close_popup_button">
<img src="images/icons/black/menu_close.png" alt="" title="" />
</div>
</div>
</div>
javascript for the router page
if(response.data.is_success){
mainView.router.loadPage({url:'user-product.html', ignoreCache:true,
reload:true });
}
if anyone knows the solutions. please answer.

Related

The session is not working properly in PHP

The session is not working properly in PHP. The login page is working fine. But after redirecting to my home page I couldn't able to see my login details it throws this errorNotice : Undefined index: username in C:\xampp\htdocs\final\header.php on line
and if I use the if-else state to hide my login/signup button it's not working. So please someone help me with this issue
My Login page
<link rel="stylesheet" href="css/auth.css">
<body>
<div class="login-box"> <h2>Login</h2> <form action="handleLogin.php" method="post">
<div class="user-box">
<input type="text" name="loginEmail" required="">
<label>Email</label>
</div>
<div class="user-box">
<input type="password" name="loginPass" required="">
<label>Password</label>
</div>
<a href="#">
<span></span>
<span></span>
<span></span>
<span></span>
<input type="submit" value="LogIn" name="submit">
</a><br>
<a class="nav_btn" href="signup.php"><i class="icon_profile"></i>Create New Account</a> </form> </div>
</body> </html>
LoginHandle page
<div class="login-box"> <h2>Login</h2> <form action="handleLogin.php" method="post">
<div class="user-box">
<input type="text" name="loginEmail" required="">
<label>Email</label>
</div>
<div class="user-box">
<input type="password" name="loginPass" required="">
<label>Password</label>
</div>
<a href="#">
<span></span>
<span></span>
<span></span>
<span></span>
<input type="submit" value="LogIn" name="submit">
</a><br>
<a class="nav_btn" href="signup.php"><i class="icon_profile"></i>Create New Account</a> </form> </div>
</body> </html>
My header session
echo ' <form class="form-inline my-2 my-lg-0" >
<p class="text-light my-0 mx-2">Welcome'.$_SESSION["username"].' </p>
</form>';
I think you should use the post method for the form and then store the values in the sessions but remember to start session first
Here you logged in
<php?
// Check to see if we have some POST data, if we do process it
if ( isset($_POST['name']) && isset($_POST['pass']) ) {
$_SESSION["name"] = htmlentities($_POST["email"]);
header( 'Location: view.php' ) ;
return;
}
?>
<form action="handleLogin.php" method="post">
<div class="user-box">
<input type="text" name="loginEmail" required="">
<label>Email</label>
</div>
<div class="user-box">
<input type="password" pass="loginPass" required="">
<label>Password</label>
</div>
<input type="submit" value="LogIn" name="submit">
</form>

How to start automatic download of pdf on after form submission

I am new into PHP and Html , I have a form where I am able to post details using third party service.I want to make this form submission in such a way that after submission this should start pdf download automatically.It should perform 2 actions on same button click. I have gone through many solutions but I am not able to make this work. Here is my form
<div class="modal-body">
<div class="media-container-column" data-form-type="formoid">
<div data-form-alert="" hidden="" class="align-center" > Thanks for filling out the form use this link to Download </div>
<form class="mbr-form" action="https://mobirise.com/ " method="post" data-form-title="Mobirise Form"><input type="hidden" name="email" data-form-email="true" value="bUMCs/mtytHWYRo/XjN7tA1PqfT+NB00KjPTWZfuYXvKQmJxQUOr1gzeKJUJwLqxqXI/Euh3h4TzMmnq0FW5UjTC1AjsnumlJFTc7U5521K+f6PwqF4lRJdVha0cCPLW" data-form-field="Email">
<div data-for="name">
<div class="form-group">
<input type="text" class="form-control px-3" name="name" data-form-field="Name" placeholder="Name" required="" id="name-header15-c">
</div>
</div>
<div data-for="email">
<div class="form-group">
<input type="email" class="form-control px-3" name="email" data-form-field="Email" placeholder="Email" required="" id="email-header15-c">
</div>
</div>
<div data-for="phone">
<div class="form-group">
<input type="tel" class="form-control px-3" name="phone" data-form-field="Phone" placeholder="Phone" id="phone-header15-c">
</div>
</div>
<span class="input-group-btn"><button onClick="header.php" type="submit" class="btn btn-secondary btn-form display-4">Download</button></span>
</form>
</div>
</div>
This form submission is working fine, how can I start downloading pdf after this, any sample code in javascript or php would be helpful.Thanks
You need to add an id="SampleForm" in your form.
<div class="modal-body">
<div class="media-container-column" data-form-type="formoid">
<div data-form-alert="" hidden="" class="align-center" > Thanks for filling out the form use this link to Download </div>
<form id="SampleForm" class="mbr-form" action="https://mobirise.com/ " method="post" data-form-title="Mobirise Form"><input type="hidden" name="email" data-form-email="true" value="bUMCs/mtytHWYRo/XjN7tA1PqfT+NB00KjPTWZfuYXvKQmJxQUOr1gzeKJUJwLqxqXI/Euh3h4TzMmnq0FW5UjTC1AjsnumlJFTc7U5521K+f6PwqF4lRJdVha0cCPLW" data-form-field="Email">
<div data-for="name">
<div class="form-group">
<input type="text" class="form-control px-3" name="name" data-form-field="Name" placeholder="Name" required="" id="name-header15-c">
</div>
</div>
<div data-for="email">
<div class="form-group">
<input type="email" class="form-control px-3" name="email" data-form-field="Email" placeholder="Email" required="" id="email-header15-c">
</div>
</div>
<div data-for="phone">
<div class="form-group">
<input type="tel" class="form-control px-3" name="phone" data-form-field="Phone" placeholder="Phone" id="phone-header15-c">
</div>
</div>
<span class="input-group-btn"><button onClick="header.php" type="submit" class="btn btn-secondary btn-form display-4">Download</button></span>
</form>
</div>
</div>
Then you need to add some code to process download on form Submit event.
<script>
var pdfUrl = "https://example.com/link-to-your-pdf";
$('#SampleForm').on('submit', function () {
window.open(pdfUrl, '_blank');
});
</script>
You'll have to handle submission with Javascript, instead of the default one.
There is some documentation about sending form submission throught javascript:
https://developer.mozilla.org/en-US/docs/Learn/Forms/Sending_forms_through_JavaScript

onClick Function can work only in loading Web Browser, and can't work totally after loading Web Browser

When I Click the Submit button with id 'submitPasscode', I want to hide the div tag (with id 'passcodeCard') and want to display the div tag (with id 'loginCard').
After Clicking it, onClick function 'checkPasscode()' is worked, but this function works only when loading web browser. It means that div tag (with id 'passcodeCard') didn't hide, and div tag (with id 'loginCard') didn't display after loading web browser.
I would like to know what is wrong with this code to work onClick Function works well.
Here is the code:
<div id="passcodeCard" class="loginDiv" style="margin-top: 10%;" style="display: inline;">
<form id="form" class="form-horizontal" style="padding-top: 5%;">
<div class="group">
<input type="text" id="passcode" name="passcode" placeholder="Enter Passcode"/>
<span class="bar"></span>
<label>Enter Passcode</label>
<button type="submit" class="button buttonBlue" style="margin-top: 5%;" id="submitPasscode" onclick="checkPasscode()">Submit</button>
</div>
</form>
</div>
<div id="loginCard" class="loginDiv widgetHeight" style="display: none;">
<img class="img-responsive user-logo" src="layouts/v7/resources/Images/hims5.png">
<div>
<span class="{if !$ERROR}hide{/if} failureMessage" id="validationMessage">{$MESSAGE}</span>
<span class="{if !$MAIL_STATUS}hide{/if} successMessage">{$MESSAGE}</span>
</div>
<div id="loginFormDiv">
<form class="form-horizontal" method="POST" action="index.php">
<input type="hidden" name="module" value="Users"/>
<input type="hidden" name="action" value="Login"/>
<div class="group">
<input id="username" type="text" name="username" placeholder="Username" value="admin">
<span class="bar"></span>
<label>Username</label>
</div>
<div class="group">
<input id="password" type="password" name="password" placeholder="Password" value="password">
<span class="bar"></span>
<label>Password</label>
</div>
<div class="group">
<button type="submit" class="button buttonBlue">Sign in</button><br>
<a class="forgotPasswordLink" style="color: #15c;">forgot password?</a>
</div>
</form>
</div>
</div>
<script>
function checkPasscode(){
if(document.getElementById("passcode").value == "passcode")
{
document.getElementById("form").style.display = "none";
document.getElementById("loginCard").style.display = "";
}
}
</script>
I don't completely understand your question, but is this what you wanted. I added some extra features such as making the fields required. Please let me know if this helped:
Here is the code:
<div id="passcodeCard" class="loginDiv" style="margin-top: 10%;" style="display: inline;">
<form id="form" class="form-horizontal" style="padding-top: 5%;">
<div class="group">
<input type="password" id="passcode" name="passcode" placeholder="Enter Passcode" required/>
<span class="bar"></span>
<label>Enter Passcode</label>
<button type="submit" class="button buttonBlue" style="margin-top: 5%;" id="submitPasscode" onclick="checkPasscode()">Submit</button>
</div>
</form>
</div>
<div id="loginCard" class="loginDiv widgetHeight" style="display: none;">
<img class="img-responsive user-logo" src="layouts/v7/resources/Images/hims5.png">
<div>
<span class="{if !$ERROR}hide{/if} failureMessage" id="validationMessage">{$MESSAGE}</span>
<span class="{if !$MAIL_STATUS}hide{/if} successMessage">{$MESSAGE}</span>
</div>
<div id="loginFormDiv">
<form class="form-horizontal" method="POST" action="index.php">
<input type="hidden" name="module" value="Users"/>
<input type="hidden" name="action" value="Login"/>
<div class="group">
<input id="username" type="text" name="username" placeholder="Username" value="admin" required>
<span class="bar"></span>
<label>Username</label>
</div>
<div class="group">
<input id="password" type="password" name="password" placeholder="Password" value="password" required>
<span class="bar"></span>
<label>Password</label>
</div>
<div class="group">
<button type="submit" class="button buttonBlue">Sign in</button><br>
<a class="forgotPasswordLink" style="color: #15c;">forgot password?</a>
</div>
</form>
</div>
</div>
<script>
function checkPasscode(){
if(document.getElementById("passcode").value == "passcode")
{
document.getElementById("form").innerHTML = "";
document.getElementById("loginCard").style.display = "block";
}
}
</script>

how can i login parse jquery ajax?

i can not see anything please help me.
How can i parse this code .
I can build cordova app .
i can parse everything app.js file but login doesnt work any ideas?
I think my js code wrong but where am i wrong ?
Cordova is new for me i have no experience for this
$('#submmit-register').on('click', function () {
console.log('login');
var username = $$('#register-username').val();
var email = $$('#register-email').val();
var password = $$('#register-password').val();
if (!username || !password || !email){
myApp.alert('Please fill in all Registration form fields');
return;
}
});
var query = 'http://-------/users/signup';
///'http://-------/users/login'
var postdata = {};
postdata.username = name;
postdata.email = email;
postdata.password = password;
myApp.showIndicator();
$.ajax({
url: query,
headers: {"X-Parse-Application-Id":applicationId,"X-Parse-REST-API-Key":restApiKey},
type: "POST",
contentType: "application/json",
data: JSON.stringify(postdata),
statusCode: {
201: success201,
400: notsuccess,
500: notsuccess
}
});
<div class="popup popup-login">
<div class="content-block-login">
<h4>LOGIN</h4>
<div class="loginform">
<form id="LoginForm" method="post">
<div class="form_row">
<div class="form_row_icon"><img src="images/icons/white/user.png" alt="" title="" /></div>
<input type="text" name="username" value="" class="form_input required" placeholder="username" />
</div>
<div class="form_row">
<div class="form_row_icon"><img src="images/icons/white/lock.png" alt="" title="" /></div>
<input type="password" name="password" value="" class="form_input required" placeholder="password" />
</div>
<div class="forgot_pass">
Forgot Password?</div>
<input type="submit" name="submit" class="form_submit" id="submit" value="LOGIN" />
</form>
<div class="signup_social">
<!--a href="http://www.facebook.com/" class="signup_facebook external">FACEBOOK</a>
<!--a href="http://www.twitter.com/" class="signup_twitter external">TWITTER</a->
LINKEDIN
<!--a href="http://www.twitter.com/" class="signup_googleplus external">GOOGLE+</a-->
</div>
<div class="signup_bottom">
<p>Don't have an account?</p>
LOGIN </div>
</div>
<div class="close_loginpopup_button"><img src="images/icons/white/menu_close.png" alt="" title="" /></div>
</div>
</div>
<!-- Register Popup -->
<div class="popup popup-signup">
<div class="content-block-login">
<h4>REGISTER</h4>
<div class="loginform">
<form id="RegisterForm" method="post">
<div class="form_row">
<div class="form_row_icon"><img src="images/icons/white/user.png" alt="" title="" /></div>
<input type="text" name="username" value="" class="form_input required" placeholder="username" />
</div>
<div class="form_row">
<div class="form_row_icon"><img src="images/icons/white/contact.png" alt="" title="" /></div>
<input type="text" name="email" value="" class="form_input required" placeholder="email" />
</div>
<div class="form_row">
<div class="form_row_icon"><img src="images/icons/white/lock.png" alt="" title="" /></div>
<input type="password" name="password" value="" class="form_input required" placeholder="password" />
</div>
<input type="submit" name="submit" class="form_submit" id="submit" value="REGISTER" />
</form>
<!--div class="signup_social">
FACEBOOK
<!--a href="http://www.twitter.com/" class="signup_twitter external">TWITTER</a->
LINKEDIN
<!--a href="http://www.twitter.com/" class="signup_googleplus external">GOOGLE+</a-->
</div-->
</div>
<div class="close_loginpopup_button"><img src="images/icons/white/menu_close.png" alt="" title="" /></div>
</div>
</div>
<!-- Login Popup -->
<div class="popup popup-forgot">
<div class="content-block-login">
<h4>FORGOT PASSWORD</h4>
<div class="loginform">
<form id="ForgotForm" method="post">
<div class="form_row">
<div class="form_row_icon"><img src="images/icons/white/contact.png" alt="" title="" /></div>
<input type="text" name="Email" value="" class="form_input required" placeholder="email" />
</div>
<input type="submit" name="submit" class="form_submit" id="submit" value="RESEND PASSWORD" />
</form>
<div class="signup_bottom">
<p>Check your email and follow the instructions to reset your password.</p>
</div>
</div>
<div class="close_loginpopup_button"><img src="images/icons/white/menu_close.png" alt="" title="" /></div>
</div>
</div>
<!-- Social Popup ->
First of all there is no submmit-register button or id found in your html code
You have used var username = $$('#register-username').val(); double dollar sign, which is not valid in javascript
I am not sure if what is myApp
myApp.showIndicator(); is a function then call it just like showIndicator();
myApp.alert is invalid
Replace this with success function to get result in just single function
statusCode: {
201: success201,
400: notsuccess,
500: notsuccess
}
success function
success: function(data){
console.log(data);
}

to redirect the same page after form submit

I have a form in my webpage Index.html. When I submit my form it redirects to the action page.
I want the page to redirect to itself (index.html) after completing the action.
<div class="container">
<div class="row marginbot-80">
<div class="col-md-8 col-md-offset-2">
<form id="contact-form" method="post" action="mailfunc.php" class="wow bounceInUp" data-wow-offset="10" data-wow-delay="0.2s">
<div class="row marginbot-20">
<div class="col-md-6 xs-marginbot-20">
<input type="text" class="form-control input-lg" id="name" placeholder="Enter name" required="required" />
</div>
<div class="col-md-6">
<input type="email" class="form-control input-lg" id="email" placeholder="Enter email" required="required" />
</div>
</div>
<div class="row">
<div class="col-md-12">
<div class="form-group">
<input type="text" class="form-control input-lg" id="subject" placeholder="Subject" required="required" />
</div>
<div class="form-group">
<textarea name="message" id="message" class="form-control" rows="4" cols="25" required="required" placeholder="Message"></textarea>
</div>
<button "style=width:40 height:40" class="btn btn-skin" type="submit" id="btnContactUs">Send Message</button>
</div>
</div>
</form>
</div>
</div>
</div>
You could redirect after the script in mailfunc.php to your index.html like this:
header("Location: index.html");
exit();
Currently your submit will open a POST request to mailfunc.php where your form data (most probably) will be processed.
You can quite easily forward from mailfunc.php to index.html using some Javascript code like:
window.location.href = 'index.html';
Try this.
$referer = $_SERVER['HTTP_REFERER'];
header("Location: $referer");
This helps you to redirect to the same page where you are submitting the form
Refer this link to know more about HTTP_REFERER

Categories

Resources