This is related to question "Bookmarklet behind elements".
I want to either self close the iframe after form submission or if not possible, add a close button with the iframe to close it. my bookmarklet at the moment is
javascript:(function(){var iFrame=document.createElement('IFRAME');iFrame.src='http://www.yeongbing.com/testform/dd-formmailer/dd-formmailer.php';iFrame.style.cssText='display:block;position:absolute;top:5%;left:60%;width:40%;height:51%;overflow:hidden;';document.body.insertBefore(iFrame,document.body.firstChild);})();
I have tried the methods mentioned here but can't seem to work. Any suggestions?
Here's how you can close the iframe from your "Close Window" button.
First, give your iframe an id by adding "iFrame.id='foo';" to the end of your bookmarklet script:
javascript:(function(){var iFrame=document.createElement('IFRAME');iFrame.src='test2.html';iFrame.style.cssText='display:block;position:absolute;top:5%;left:60%;width:40%;height:51%;overflow:hidden;';document.body.insertBefore(iFrame,document.body.firstChild);iFrame.id='foo';})();
Then, in your iframe's source, change
<input type="button" onclick=window.close() value="Close Window"/>
to
<input type="button" onclick="parent.document.body.removeChild(parent.document.getElementById('foo'));" value="Close Window"/>
Related
Im actually having a problem with html5 button in visualforce pages. I have a requirement where when i click on a button, it should redirect to a certain page (user do not want link). For some reason which i don't know, the function i'm executing do not work with HTML5 button (in fact the page only refresh but do not redirect) but when i use input of type button, the function is executed as expected.
I want to use the html5 button as there are some specific css already defined for button in the plugin im using. Find below codes for my button and javascript function :
<button class="butt" onclick="newContact()" >Nouveau</button>
<script type="text/javascript">
function newContact(){
window.location = "/apex/VFP01_NewContact";
}
</script>
What did I do wrong here, and what is the limitation of html5 button ?
Got to know the answer. In visualforce page, the html5 button execute a submit of my form. A way to prevent this, was to specify the attribute type="button".
You really have two options.
You could consider wrapping a element with an anchor tag that points to the URL that you want to target as seen below :
<!-- Target the "YourAction" action in your "YourController" controller -->
<a href='#Url.Action("YourAction","YourController")'>
<input type="Button" id="mybutton" name="url button" value="Next" />
</a>
or you could handle this purely through Javascript and perform your navigation that way :
<!-- The onclick event will trigger a Javascript call to navigate -->
<input type="Button" id="mybutton" name="url button" value="Next" onclick="window.location.href='#Url.Action("YourAction","YourController")';" />
I've been trying to solve this issue for a few days now and its driving me crazy. I
m not even sure if it is possible, so any help will be greatly appreciated. I have searched through hundreds of answers on this great website and I can not find the one I am looking for.
I am trying to use a button to scroll the content of an iframe on my html page.
Basically I have two iframes (named iframe1 & iframe2) they sit side by side on my html page. I have 2 buttons underneath each iframe. iframe1 is to scroll up and down and so the buttons are named "Up & Down" they work fine using the following code:
<input type="button" class="button" onclick="frame1.scrollBy(0,-200)" value="Up" />
<input type="button" class="button" onclick="frame1.scrollBy(0, +200)" value="Down" />
The second iframe (iframe2) holds an html page (named card.html) that has 2 more iframes in it (this is where it gets confusing) the 2 new iframes are called iframe3 & iframe4. I only want to scroll iframe4.
How can I cause it to scroll, I have tried applying the same functionality I used for iframe1 but for some reason it does not work.
i.e.
<input type="button" class="button" onclick="frame4.scrollBy(0,-200)" value="Up" />
<input type="button" class="button" onclick="frame4.scrollBy(0,-200)" value="Up" />
I guess it has something to do with the fact that the iframe is inside another iframe and the buttons are on the main html page.
Any help will be greatly appreciated.
This is just a (reasonably well-educated) guess, but try frame2.frame4.scrollBy(0,-200). You need to get the iframe from inside of the other iframe before you can do stuff with it.
I have a modal window but I want to set up a close function so that when the user clicks on the "button", it will close the modal window. Does anyone know how this can be achieved?
I have a link to the application so you can view it here
Below is the javascript code where it shows the function of opening the modal window and the setup function of where I want to place the code to close the modal window:
function plusbutton() {
$(".previouslink").modal();
return false;
}
function closewindow() {
return false;
}
Below is the form code where user clicks on the plus button and it displays the content within the "previouslink" div tag:
<form id="QandA" action="imageupload.php" method="post">
<h1>CREATING QUESTIONS AND ANSWERS</h1>
<table id="plus" align="center">
<tr>
<th><a onclick="return plusbutton();">
<image src="Images/plussign.jpg" width="30" height="30" alt="Look Up Previous Question" class="plusimage"/>
</a><span id="plussignmsg">(Click Plus Sign to look <br />
up Previous Questions)</span> </th>
</tr>
</table>
<div class="previouslink">
<h1>PREVIOUS QUESTIONS</h1>
<button type="button" id="close" onclick="return closewindow();">Close
</button></div>
</form>
Your Live-Example shows me, that you seem to be using SimpleModal
From the documentation:
CLOSING THE DIALOG
SimpleModal will automatically bind the close
function (using the onclick event) to any element inside the dialog
with the simplemodal-close class. In addition, you can
programmatically close the currently opened dialog by calling
$.modal.close();
Means: In your closeWindow()-Function, you could simply enter the line:
$.modal.close();
and be done.
I've used this jQuery reveal modal plugin on several sites and it has worked great for me.
Alternatively, you should check out jQuery Impromptu. I love the tour feature myself, but the modals are more likely what you are trying to accomplish.
The code from both examples will probably lead you to what you are specifically looking for :)
I have a link in abc domain which opens a popup window and opens a page in a different domain. I need to add a button on the popup which calls window.close() and closes it via javascript. Is is even doable? can I close a popup using windo.close which has been opened by a different domain?
Do you mean something like this:
function openWin(){
myWindow=window.open("http://www.google.co.uk","","width=200,height=100");
}
function closeWin(){
if(myWindow){
myWindow.close();
}
}
hooked up to these buttons:
<input type="button" value="Open 'myWindow'" onclick="openWin()" />
<input type="button" value="Close 'myWindow'" onclick="closeWin()" />
it's a tad crude but should work... I'd also make it unobtrusive if I were you, I've used obtrusive code just to get an answer to you quickly
I have an app which runs in a new window. There are several forms to generate a PDF export. When I submit one of these forms, the window loses its focus and the original window pops up again when the download appears.
I created an iframe, so the forms can target the iframe and the current window doesn't lose its focus. It works great, but I have no idea how to observe the response inside the iframe if everything went right.
Here is how its working so far. I'm using prototypeJS.
<iframe id="pdf_frame" name="pdf_frame" style="display:none;"></iframe>
<form id="PDF_gen" name="PDF_gen" target="pdf_frame" action="pdf.pl">
<input type="hidden" name="size" value="">
<!-- more hidden inputs -->
</form>
<input type="button" id="pdf_submit" value="generate pdf">
JS:
$('pdf_submit').observe('click', function(){
//write stuff to hidden inputs
$('PDF_gen').submit();
});
If something goes wrong, the download dialogue does not appear. When using prototypes form.request() the browser does not know how to handle the response and does not bring up the download dialogue. How can I do it right?
Thanks in advance!
When something goes wrong in the iframe you can try to fire an event from the iframe to its parent window (assuming we're on the same domain; it won't work cross-domain):
parent.document.fire('something:went_wrong')
and have the parent document listen for that event:
document.observe('something:went_wrong', function() {...});