javascript pop-up box - javascript

OK so I haven't messed with JavaScript in a long time but I do remember some. I have tried Google but it hasn't proved to be what i wanted.
Let's say I have a link... when you click it -- a window pop-up box appears. You can submit the form... then when you press submit! The pop-up box with the form you just filled out would close and the page you clicked the box up box would be redirected....
How would I make that happen?

Try this:
Parent page:
<script type="text/javascript">
window.name="dansMainPage";
function popWin(link) {
var w = window.open(link.href,link.target,'width=500,height=600,resizable');
return w?false:true; // if popup blocker, use the default behaviour of the link
}
</script>
<a href="pagewithform.html" target="_blank"
onClick="return popWin(this)">Pop form</a>
child page:
<form target="dansMainPage" onSubmit="setTimeout(function() { window.close() },1000)">
.
.
.

Related

Include different .php files in JS popup

I have multiple buttons which currently redirect to different pages for users to perform a single action and they would then need to click another button whilst on the confirmation page to go back where they were before. This is old school and inconvenient...
What I would like to do is create 1 single pop-up box which would get triggered (appear) when any of those buttons are clicked. Inside the box, I want the relevant .php file to appear so users can confirm their action and the page would then reload and display a confirmation message.
Example:
"Delete" button needs to trigger the confirmation-popup.php to appear with the delete.php file included in it so users can confirm the deletion.
"Cancel" button needs to trigger the confirmation-popup.php to appear with the cancel.php file included in it so users can confirm the cancellation.
Here's what I've done:
- Created the pop up and included it on their Account page (that's where all the buttons are).
- Added a JS which passes through the button ID to trigger the popup
When either of the buttons is clicked, the popup would appear fine.
I'm stuck at the stage where different "action".php files need to passed and included in the body of the popup. I know I could create multiple popups each for its relevant action, but we all know this isn't best practice and it's doubling up.
Any help would be appreciated!
Edit: Added code after the below comment
HTML:
<button class="button-small button-red" id="confirm-delete">Delete</button>
JS:
$(document).ready(function() {
$("#confirm-delete").click(function() {
if (!$(".confirm-popup").is(":visible")) {
$(".confirm-popup").fadeIn("slow");
return false;
}
});
});
PHP confirm_popup.php:
<div class="confirm-popup">
<?php include 'delete_auction.php'; ?>
</div>
You can open different iframes in the popup based on the button pressed. That will allow you to use one popup and you will just edit the iframe src attribute to the correct php page. For example you can add an HTML attribute to each button that holds the URL of the page that should be opened by the button. Then you will have some JS code that on the button press will read the attribute that holds the URL and puts it in the iframe src attribute inside the popup.
Something like this using jQuery:
<button class="myclass" cotent-url="delete.php">Delete</button>
<button class="myclass" cotent-url="save.php">Save</button>
<div class="popup"><iframe src=""></iframe></div>
<script type="text/javascript">
$('.myclass').click(function(){
$('.popup iframe').attr('src', $(this).attr('content-url'));
})
</script>
Or AJAX way:
<button class="myclass" cotent-url="delete.php">Delete</button>
<button class="myclass" cotent-url="save.php">Save</button>
<div class="popup"></div>
<script type="text/javascript">
$('.myclass').click(function(){
$.ajax({
url: $(this).attr('content-url'),
data: {},
success: function(response) {
$('.popup').html(response);
},
dataType: 'html'
});
})
</script>

window.close() not working on pop up with pop up

I have a Customer Info form that has anchor tag "close" that should close the current window. This customer form is being opened as pop up. The Customer form also has a search btn that when clicked it pop ups the search form that is being run by a javascript called searchOrder.js. So basically it is a pop up inside a pop up. The customer form's close btn is not working but when the reference to searchOrder.js is removed, it begins to work. Also, when the search pop up is open and I click the "close" anchor tag, it closes the search pop up but never the current window which is the customer form.
Ive tried a lot of solutions already but nothing is working. I used self.close(), window.opener.close(), made it a btn instead of a link etc.,c alled a function onclick
function closeWindow() {
var closeRef;
window.opener='x';
closeRef = window.open('','_parent','');
//or closeRef = window.open("",name);
closeRef.close();
}
heres my gsp code:
<g:form method="post" name="CustomerInfoForm" target="_parent" role="form">
<div class="id="closeLink">Close</div>
<button id="searchOrderButton" type="button" class="button" onclick="searchOrder(document.forms[0].summaryMessage.value,'summaryMessageText','${createLink(action:'searchOrder')}','${createLinkTo(dir:'images',file:'closeButton.gif')}')" value="Search Order">Check Order</button>
</g:form>
How do I make the current window (customer info ) close? tnx
You should use a function like this to close your popup window :
<g:form method="post" name="CustomerInfoForm" target="_parent" role="form">
<div class="id="closeLink">
Close
</div>
<button id="searchOrderButton" type="button" class="button" onclick="searchOrder(document.forms[0].summaryMessage.value,'summaryMessageText','${createLink(action:'searchOrder')}','${createLinkTo(dir:'images',file:'closeButton.gif')}')" value="Search Order">Check Order</button>
</g:form>
<script type="text/javascript">
function openpopup()
{
my_window = window.open("","myPopup","status=1,width=100,height=100");
}
function closepopup()
{
if(false == my_window.closed)
{
my_window.close ();
}
}
</script>
EDIT : Don't forget to open your popup with the openpopup() function :
Open Popup Window
You can shorten window.close() to just close() and shorten window.open() to open(). Maybe you'll find what you need here, though:
http://www.w3schools.com/js/tryit.asp?filename=try_win_closed
http://www.w3schools.com/jsref/obj_window.asp

HTML button onload submit

I have a button example below
<button id="startrunning">go</button>
There is no form or anything I'm using on the same page java script to detect it's click. It will work like I want it to when I click it. I want to see when the page is loaded it will automatically submit it's self is there a way?
Thank you
jsFiddle: http://jsfiddle.net/QEu84/10/
<script type="text/javascript">
function submit()
{
document.getElementById("startrunning").click(); // Simulates button click
document.submitForm.submit(); // Submits the form without the button
}
</script>
<body onload="submit()">
<form id="submitForm">
<button id="startrunning">go</button>
</form>
</body>
You can automatically click it when the page loads, using the code below, but you need a form to submit something (you submit a form, not a button)
<body onLoad="document.getElementById('startrunning').click();">

How to close popup and redirect a page

My site using php and i create an online quiz and the quiz show in pop up mode.
Currently when i want to redirect my page using the script below. it goes to my homepage BUT it still at the pop up mode. I want it to close the pop up and go to homepage after I click finish.
How can I do that?
<script type="text/javascript">
window.parent.location = "../../../"
</script>
You can access the window that opened a popup with the window.opener property on the popup. So, something like this should work:
window.opener.location.replace(redirectUrl);
window.close;
If you wanted to put that behavior in the onclick event on a submit button you're building like this:
echo "<input type=\"submit\"
name=\"finishattempt\"
value=\"".get_string("finishattempt", "quiz")."\"
onclick=\"$onclick\" />\n";
You'd need to assign the String window.opener.location.href='someUrl';window.close(); to the variable $onclick before echoing the submit button out.
You can try this code (used on an HTML button):
<input type="button" onclick="parent.window.opener.location='http://homepage.com'; window.close();">
And have a look at some similar threads like this one: Javascript: Close Popup, Open New Window & Redirect
[EDIT] See this article too
this way you can do it ..
<script type="text/javascript">
function close_window(){
window.opener.location = 'pop_up.php';
window.close();
}
</script>
html code..
<body>
<form method="post" name="frm_2" id="frm_2">
<input type="submit" name="btn_close" id="btn_close" onclick="return close_window();" />
</form>
</body>

javascript form onload doesn't work in Safari

My goal is to open a new window when the user clicks on the link and then reload the main page to go back to the previous content. The first code snippet below works in IE and FireFox but doesn’t pop a new window in Safari. The second code snippet works in all 3 browsers but in Safari doesn’t perform the history.go(-1); to go back to the previous page on a main window.
Also, in a second snippet, if I put "return true;" after "history.go(-1);" history.go(-1); does work but the new window doesn't pop up (target=""_blank"").
Any suggestions?
Thanks,
Ryan
<html> <body> <form id="sso" method="POST" action="/apps/Integration/SsoUtil/SiteTransfer/SsoSignonSaml2Url.aspx" target="_blank" >
<input type="hidden" size=150 name="SsoEncryptedData" value="<%=cd.ToSsoEncryptedB64()%>" /> </form> </body>
<script>
sso.submit();
history.back(); </script> </html>
------------------WORKS IN SAFARI BUT DOESN"T RELOAD THE PARENT PAGE-----------------------
<%
Response.Write("<html>")
Response.Write("<body onload=""document.getElementById('sso').submit();return true; history.go(-1);"">")
Response.Write("<form id=""sso"" method=""POST"" action=""/Apps/Integration/SsoUtil/SiteTransfer/SsoSignonSaml2Url.aspx"" target=""_blank"">")
Response.Write("</form><br/>")
Response.Write("</body>")
Response.Write("</html>")
Response.End()
%>
-------------------------------------------------------------------------------------------
Try
<script>
sso.submit();
setTimeout(function() { history.back();},1000)
</script>
then try returning <script>opener.history.back()</script> from your server when you submit
Lastly give your form a submit button and try clicking it instead of submitting the form
document.getElementById('subbut').click()

Categories

Resources