I would like to create an AJAX pop up window that will serve as a login pop up when the user clicks "log in" to log in to a website. What algorithm and programming will I need to do this? I will be using PHP and MySQL.
I doubt you need ajax, you can simply have a hidden div that fades in when you click login.
<div id="login-trigger">login</div>
<div id="login" style="display:none;">... login form goes here ...</div>
Using jQuery:
$('#login-trigger').click(function(){ $('#login').fadeIn() })
Example here: http://jsfiddle.net/pu4rd/
Take a look at the jQuery Tools Overlay.
There you can render out a (hidden) div containing the login box and show it as an overlay-popup (or even load an "external" login page like HERE).
Related
I need to know how I can process the SSO login without reloading the page.
My sample link is http://abmprograms.com/tdr/disqus.php
When I click on the first option to login a pop-up opens, if I either try to login with below details (see my comment below) or close it the page reloads.
Is there anyway to prevent this?
Looks like you are using, jquery. Have you tried using modal forms: http://jqueryui.com/dialog/#modal-form
You can control the login form post using javascript which would let you control the modal form behavior.
I need to be able to ask users for help if they have been sitting idle on my php site for at least 30 seconds. I have the popup made and styled. It is on a page that currently uses a button to show the popup(for testing purposes). But now I need to remove the button and put in place some kind of javascript or php to open the modal after 30 seconds of user inactivity.
Here is some of the page that has the button to display the modal popup (I'm assuming this is where I would tell the site to wait for inactivity):
<body onload="javascript:fg_hideform('fg_formContainer','fg_backgroundpopup');">
<p>
This is an example page showing how to add the popup contact form to your website.
Click on the button below to open the popup.
</p>
<p>
<a href='javascript:fg_popup_form("fg_formContainer", "fg_form_InnerContainer","fg_backgroundpopup");'>
<img border='0' src='contact-us-button.png' width='213' height='39' /></a>
</p>
The page also includes the 2 files necessary to show and submit the popup contact form. I will show the code for those if it is necessary. Thank you so much!
Note: I found this plugin: http://www.erichynds.com/jquery/a-new-and-improved-jquery-idle-timeout-plugin/ but I'm not sure how to use it to keep a modal from being disabled once the mouse moves. I need a user to be able to fill out the contact form so it can be submitted.
I also tried using some javascript code from another post on stackoverflow but I am really really bad with javascript and have no clue what to do here.
does
<script type="text/javascript">
setTimeout(function() {
fg_popup_form("fg_formContainer", "fg_form_InnerContainer","fg_backgroundpopup");
}, 30000);
}
</script>
solve the problem?
I have seen a few of these floating about however I want to use it different to the way they posted on here.
I have all my server validation (for register page) at the top of the page so the form submit looks like (im on index.php so it just does it's self):
However, the index.php page has a login button and a register button and the form pops up depending which you click.
However i need that div to act like a page, so you submit and it reloads the div as if it were a web page if that makes sense?
Thanks for reading :-)
After someone completes a form on our website and clicks on submit s/he is directed to a landing page. I would like to change that flow so that upon submitting (1) URL1 opens as new window; and (2) user is redirected from current form page to URL2.
Can you help?
current code snippet -
if(! isset($RedirectOnSuccess))
$RedirectOnSuccess = 'oldURL';
I'm a tech newbie so need your help in piecing it together. I am using MODx and the web page itself calls the php script with the following -
[!FORM_SNIPPET?
&RedirectOnSuccess=oldURL
!]
do it with javascript. http://www.tizag.com/javascriptT/javascriptredirect.php & http://www.pageresource.com/jscript/jwinopen.htm
It likely depends on the context of your popup, but rather than using a traditional popup you might consider something less invasive and prone to ad-blocking such as a lightbox or other ajax-based display tools within the page. You can trigger the lightbox from a click event on the submit button, display your message with it, and then submit the form on close or confirm.
Avoid solutions where viewing the form result page is dependent on javascript as some (uncommon) users may have it disabled. If it is implemented as above, such users would miss your popup but the form would still go through.
You could use jQuery to implement this without modifying the php code that MODx uses to generate your form, and instead attach a click event to the form's submit button by putting javascript in the xhtml header. For example:
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.4.4/jquery.min.js"></script>
<script src="/colorbox/jquery.colorbox.js"></script>
<script type="javascript">
$("#FormID.input[type=submit]").click(function(e) {
/* prevent form from submitting */
e.preventDefault();
e.stopPropagation();
/* on colorbox close, submit form */
$(document).bind('cbox_close', function(){
e.submit(); // submit the form on close
});
/* open the colorbox */
.colorbox({href:"http://example.com/url1"});
});
</script>
I used ColorBox here, but the same idea should apply to other lightbox alternatives. I didn't browser test this, so be sure to test and adapt as necessary.
Given problems with popup blockers your best bet is to target a new window with HTML on the form upload.
<form target="_blank">
Then using JavaScript (perhaps via opener.location.href in the popup), you can redirect the main window to another URL.
Can someone me to open the modal popup when a vistor requests the page for the very first time, a cokie hides it thereafter. I need to do a survey. They answer one question and are redirected so a close button or submit button is not needed. Im using php.
Thanks for the help.
Bruce
Are you allowed to use jQuery? I would user jQuery + jQuery-UI (http://jqueryui.com/demos/dialog/)
What you have to do is just define a Div element with the markup of the popup, and then invoke the popup method used by jQuery UI in the document ready event.
e.g.
$(document).ready(function() {$( "#dialog" ).dialog();});
and
<div id="dialog"> Here goes your survey form</div>
Also it is a good idea to load jQuery and jQuery-UI from a CDN, like google's, use these addresses:
https://ajax.googleapis.com/ajax/libs/jquery/1.4.4/jquery.min.js
https://ajax.googleapis.com/ajax/libs/jqueryui/1.8.6/jquery-ui.min.js
Hope this helps