I'm using Fancybox 2 to display some forms on my website. The form comes through from an external page into an IFrame to let the user post a message, kind of like twitter does. However I want the user to be re-directed after the form has been posted. So they post the form to a database, the Fancybox window shuts down and then they are redirected to the posts page where they see their newly posted message. Is there a way of doing this succesfully?
You can try this:
<script>
if(data == 1){
//window.location.replace("dashboard.php"); //will open the page in the fancybox
parent.$.fancybox.close(); //will close the fancybox
//parent.window.location.replace( your_url_here ); //your redirecting URL here
parent.window.location.href = 'dashboard.php'; //your redirecting URL here
}
</script>
I would recommend you to use a real form rather than a post action. You are not really using form submission otherwise, but just a POST request.
If you do that, you could use the target="_top" inside the <form tag and submit the results using the submit function of jQuery.
Related
SOLVED -SORT OF---
window.location.reload(); in my code where i have the submit button close the div, worked.
// Collapse Panel on submit
$("div#panel").on('submit', function() {
window.location.reload();
$("div#panel").slideUp("slow");
$("#toggle a").toggle();
return false;
});
I keep searching for this answer and i get more frustrated every time.
Scenario:
i have a div that slides down for login purposes (jquery, css).
the login form itself in that div is initially dynamically created with PHP ( by if else statement based on value in SESSIONS - PHP echo loads the form).
3.if i put in the correct login and click submit, i have the div close (jquery on(submit)) so that the user can see the page. The page loads dynamic content from a php file using xajax/PHP functions.
4.PROBLEM - if i click to re-open the div it still shows my login form.(because the page has not reloaded). BUT my on page navbar done with xajax/PHP reloads to show the correct menu functions.
my problem is that i want the div to REFRESH after submission, or on any event change if that helps, so that it sees the NEW SESSION data and adjusts accordingly. I DO NOT WANT TO LOAD ANOTHER HTML PAGE INTO THE DIV, so load(whatever.html) IS NOT WHAT I WANT.
if i refresh the whole page using f5 after i login, and pull down the div, the login form will not be there because my SESSIONS now states that im a logged in user and no longer a guest that needs to login. and the div isnt just for login, it will house other links and shortcuts, so it would be used while your logged in throughout your visit.
index.php
<div id="left" class="left">
<?php if(isset($_SESSION['admin'])){
if($_SESSION["admin"] == "1") {
echo "YOU ARE LOGGED IN AS AN ADMIN";
}
}
if(isset($_SESSION['userID'])){
echo "YOU ARE LOGGED IN AS A USER";
}
else { echo '<form class="clearfix" id="loginForm" name="loginForm" action="javascript:void(null)" onsubmit="xajax_login(xajax.getFormValues(\'loginForm\'));">';
slide.js
$(document).ready(function() {
// Expand Panel
$("#open").click(function(){
$("div#panel").slideDown("slow");
});
// Collapse Panel
$("#close").click(function(){
$("div#panel").slideUp("slow");
});
// Switch buttons from "Log In | Register" to "Close Panel" on click
$("#toggle a").click(function () {
$("#toggle a").toggle();
});
// Collapse Panel on submit
$("div#panel").on('submit', function() {
$("div#panel").slideUp("slow");
$("#toggle a").toggle();
return false;
});
// if there is an error, close div and allow link on main content page to be clicked to reopen div
$("#content").on('click', "#tryAgain",function() {
$("div#panel").slideDown("slow");
$("#toggle a").toggle();
}); });
This is very easy to be acomplished even with pure JavaScript, no need of jQuery.
Just make one JS function that resets the input fields in the form or the div and call it every time when you need to "refresh" the content of the div or the form.
If you paste the div definition we can give you more specific advice accompanied with JS code that actually do this.
Well, if you load values into the form when the page loads, it makes sense they'd be there when the form is submitted via ajax. What you really need to do is clear the form values when the div is 'closed' in the first place.
$(#formselector).on('submit',function(){
//your ajax login and page load code
//then:
$('#formselector').find('input').attr('value','');
});
UPDATE
Based on your comment, what you really need to do is check to see if the user is really logged in before popping the form in the first place. There are a few techniques to do this, but what I'd recommend is in your php script that your form submits to, before processing the login, check your $_COOKIE variable to see if the user is recognized. This also requires modification of your login script to make sure it stores user data in a $_COOKIE, similar to how it stores data in the &_SESSION variable.
At that point, your php script will deliver two different responses based on the user state, and your javascript code that launches the form drop down would check to see if it gets the "user not found" response before showing the login form.
To just refresh the content of a particular div, use the follwing:
$("#abc").load(location.href + " #abc>*", "")
where #abc is for the div to be targeted.
I would like to create popup contact form with validation like i did here http://89.212.111.174/delovtujini.si and click “VPIS V BAZO”.
You will get popup where you can fill contact form. How can i do this with CI? Here on this example i do everything in the same html page. In CI i try to create new controller for contat form but i dno’t know how to open the window. I also try to use http://fancyapps.com/fancybox/ I try. but none solution works.
Can someone explain me how to do? Maybe is better to use https://github.com/EllisLab/CodeIgniter/wiki/Ajax-Framework-For-CodeIgniter
Thx
there are 3 ways to trackle your issue.
1) Use custom inline lightbox like what is done on
http://89.212.111.174/delovtujini.si
First post the form back to the same page like below:
public function sign_up()
{
// Setup form validation
$this->form_validation->set_rules(array(
//...do stuff...
));
// Run form validation
if ($this->form_validation->run())
{
//...do stuff...
redirect('');
}
// Load view
$this->load->view('my_form');
}
In the view when you detect a POST you must have javascript
to "open" the lightbox on page load since it won't be display by default (i.e. when you load the page normally the lightbox is "closed" and it is "opened" only when the button is clicked.)
2) Use a iframe lightbox
create the form on a separate CI controller/view and display in within an iframe when the button is clicked.
when the form is submitted you can then call javascript to close the lightbox.
3) Use ajax
both inline and iframe lightbox can work with an ajax form
the idea the same as using an iframe lightbox. Once the form is submitted via ajax, use javascript to close the lightbox.
I have a link on the page that opens a contact form in a modal window.
How can I verify that the user clicked on the link to access the contact form, and did not go to the page directly. I don't want users or bots inadvertently browsing to that page.
Thanks in advance!
You can check for $_SERVER['X_HTTP_REQUESTED_WITH'] header, which will be xmlhttprequest whenever it's an ajax request
You can use the referral url (you can access this url in PHP using $_SERVER["HTTP_REFERER"]) but you can't rely on it. First because it can be changed using a very simple script and second because that field is not always filled.
Another method is to use session to store the last visited page and then check this in your contact page. Anyway this method will also fail if the user see another page before access to the contact form but the page which you want the users start with was already loaded.
You can send a variable with it like
Contact Me
and in the modal test weather it set or not
if(isset($_GET['co'])):
//show the form
else:
//redirect
endif;
or you can use jquery to select that link and sends a variable posted with it like
Contact Me
$('.contact').click(function(){
$.post( 'contact.php', { direct: 'no'},function()
{
//call modal from here
}
);
});
then test if direct = no
if($_POST['direct'] == 'no'):
//show the form
else:
//redirect
endif;
and the jquery solution is more reliable
Sorry I was wrong
Have a form with a hidden field that contains a token, and validate that token with the session on postback.
There is a html form I have which submits to a Servlet once Submit button is clicked. After the submission the Servlet redirects to a fixed url which is
http://siteforServlets.com/Servlet/Servlet
That site then displays an xml report shown below:
Sorry I cannot post Images not enough rep so I uploaded direct link here:
http://img836.imageshack.us/img836/3343/sitea.png
I dont want my users getting confused seeing an xml I prefer it going blank page or redirecting to a different url...
How can I redirect the url to hide this xml report url?
Mark, I tried what you said but it redirects before the form even loads. Here is a quick jsfiddle I made to demonstrate your suggestion: jsfiddle.net/ujsEG/12/
You could try making the form target a hidden iframe and then set the onload attribute of the iframe with a javascript call to window.location.href.
<script type="text/javascript">
var okToRedirect = false;
function redirect() {
if (okToRedirect) {
window.location.href = 'path/to/new/location';
}
}
</script>
<form action="...some action..." target="MyIframe" onsubmit="okToRedirect = true;">
...
</form>
<iframe name="MyIframe" style="display: none;" onload="parent.redirect()"></iframe>
When the form posts, the results will display inside the hidden iframe. Once the iframe finishes loading, the onload attribute will fire the javascript to redirect the user.
Update
I updated my answer because of your comment. I added a javascript method which the iframe can call. There is now a global variable which is set to false initially. This will prevent the first load of the page from redirecting. When the form posts, the onsubmit event on the form will set the global variable okToRedirect to true, the iframe will reload and will call the redirect() method. This time around, the redirect will occur.
I have a form that is shown inside a Colorbox. When users click submit there is some validation done (checking if an entered field already exists in my database) if it does a message is shown and user is prompted to enter a new value. However when this happens the form is not shown the second time inside the Colorbox window, instead it appears on a blank page.
the form is posted to PHP_SELF, how can i change this to show in PHP_SELF (in the current Colorbox)?
cheers
I know this is aside from what you are asking, but
What if you used jquery's submit() and post() instead of PHP_SELF to pass form data to an external php class and handle displaying the return data? If the data is acceptable, you can call $.colorbox.close() manually. If data is unacceptable you can display a message to the user describing the problem.
$('myform').submit(function(){
//validate the data with javascript
//send the data to your function with post
$.post('http://url/to/your/function',{a:first_input,b:second_input},
function(return_data){
if(return_data == 'success'){
$.colorbox.close();
}else{
//display your error message here
}
,html
);
});