How do I close a popup window, and open the next page in the main window in ROR? - html

I have a popup window containing a form which gathers data for a report.
When I click submit in that window, I want it to close the popup, and open the report in the original window that called the popup.
I think I can open the report in the correct window by using
{ :target => <name of window> }
in the form_tag, but I don't know how to determine or set the name of the originating window.
I also don't know how to close the popup window.

:target => adds the html attribute target to the link. This opens up a new window and names the new window the target.
You have to use javascript or Ajax to redirect the old page,
window.opener.location.href="http://new_url";
and then close the old window.
window.close();
This can be done either through the rjs file or directly in the javascript.

The popup window can be closed using the onClick html event as follows:
<%= submit_tag "Go!", {:onClick => "window.close()"} %>

Try this:
function fclosepopup(){
window.opener.location.replace="URL";
window.close();
}
It will close the current window and bring you to the next page in the parent window.

How is this for starters?
# The submit button in your child window's view:
<%= button_to_function 'Save', "$('my_form').submit(); window.opener.location.reload(); window.close();" %>

Related

How to open url to the same tab if its already open in browser

I am facing some challenge-
Lets consider I have a menu and under that I have 3 links-
About
Contact Us
FAQs
By default home page is About menu item.
Now when I am clicking on "Contact Us" , I want to open a new tab on same browser window. And without closing this if again I am clinking on "Contact Us" from the first tab, this time I do not want to open new tab because I have already an open tab for Contact us, I just wanted to navigate to the same one which is earlier opened.
How to handle this scenario in jsp.
Is there any way to do this. please help me.
you can always put a name in the target so it will always go to the same window/tab
<a href="somerandomurl.com" target="mywindow">Contact Us<\a>
Its not possible to control this on Internet explorer.
You can however change how IE behaves:
-Internet Options
-Tabs
-Always open pop-ups in a new tab
-Open links from other programs in: A new tab in the current window
target="_blank" will always make sure it opens in a new window
http://www.w3schools.com/tags/att_a_target.asp
It will however refresh the page with the same url
You can have the link return a javascript window object and be able to return to the window anytime you want without refreshing the page
var newtab = null;
function openwindow(){
if (newtab==null) {
newtab = window.open("www.example.com");
} else {
newtab.focus();
}
}
<a onclick="openwindow()">click me</a>
This solution will work if someone refresh the parent page also, it will close the child tab if that tab is already open on refresh of parent page.
Javascript:
<script>
var newtab = null;
window.open('', 'business-list', '').close();
function openwindow() {
if (!newtab || newtab.closed) {
newtab = window.open("/admin/business-list.aspx","business-list");
} else {
newtab.focus();
}
}
</script>
HTML:
<a onclick="openwindow()" style="cursor:pointer">Business List</a>

how to remove "X" button from popup in angularJS

How can I remove "X" button from Popup in angularJS? I don't need it because the cancel button that I have implemented has same functional but the "X" button couldn't reset modifies. It will be implemented as default in HTML:
<div class="ngdialog-close"></div>
While opening popup you need to pass one option showClose which will hide close button if its false.(default true)
Code
ngDialog.open({
template: 'templateId',
className: 'ngdialog-theme-default',
showClose: false //<-- while opening dialog make it false
});
You have to read documentation before integrating (using) any module in your project. Here is the complete list of options for ngDialog.
Hide close button

Generate Href target blank link from popup form

I want users to input some url in a text field from a popup, and then, when submit the popup the parent page auto refresh and shows the url they have insert, with hyperlink to the site.
I have now set a scrypt to store the form in a cookie, that computer can read everytime users come back to the site.
You can see my work in: http://www.resmasecamadas.com/test
You can achieve it using JS. you dont need to use cookies at all!
Observe this sample code.
//On click of this button new Popup will be opened!
<button onclick="myFunction();">Open popup</button>
<script>
function myFunction() {
var popup = window.open("", "popup", "width=200, height=100");
popup.document.write("<input type='text' name='text' id='text'><button onclick='window.opener.passFunction(text.value);'>click</button>");
}
function passFunction(x){
document.write(x);
}
</script>
You can send data from pop up window using window.opener.someFunction(parameters)here "someFunction" is a function in parent window!

How to allow 'Open in a new tab' when using ng-click?

I have a table on HTML and each row leads to a different page, with more details about that row. But as I am using angularjs, with ng-click I can't right click this row and select 'open in a new tab'. Is there any way to solve it?
Thanks in advance!
If possible you should convert your element to an anchor element.
<a ng-href="{{ your dynamic url }}" ng-click="your function">Your link text</a>
The browser will interpret the element as a link, and will therefor give you the correct dropdown.
Note that you also have to have the correct href value to open in a new tab.
EDIT:
I would recommend this question if you want a more detailed answer on how to fix this kind of behaviour using JQuery.
Inside your ng-click function you can call window.open(url, '_blank') however as a word of warning, this will depend on the browser and current settings.
In some cases this will open in a pop-out window and in other cases it will open in a new tab. There is no way to force either behavior as the javascript is browser agnostic, it has simply requested a new window and it is up to the browser the decide how to implement it. see here for a discussion on forcing a tab or window
However the only way to get that right-click option or the ctrl+click to open in a new tab is if the browser sees a <a> tag. Otherwise it doesn't treat it as a link.
If you want to generate your href dynamically based on some condition then you can set your href on ng-mousedown event and after that you can perform any event like open link in new tab, open link in new window and click.
HTML:
{{label}}
JS :
$scope.openDetailView = function (event, userRole) {
if(userRole == 'admin') {
jQuery(event.target).attr('href', 'admin/view');
} else {
jQuery(event.target).attr('href', 'user/view');
}
};
You have to use anchor element inside the table row.
HTML
<tr>
<a ng-href="dynamic url" ng-click="openItem($event)">Open the item</a>
</tr>
Controller
$scope.openItem = function (event) {
event.preventDefault();
// code to open a item
}

How to go to bottom of the page when submitbutton is clicked?

On my website there is a contactform on the bottom of the page. When it is filled in and a user pressed the submitbutton, the page reloads but shows the top of the page. What do I need to adjust so when a user pushed the submitbutton, the page reloads and goes to the bottom of the page?
Thanks!
You have a few options:
Set the hashtag
You can use jQuery and use .scrollTop()
Or native with window.scrollBy(0,9999);
Submit the for through Ajax so you don't have to refresh the page.
Put a named anchor to where you want to go after form sending:
<a name="afterform"><h1>Example: a heading</h1></a>
And then add that as a hash to the form action:
<form action="yourpage.html#afterform" ...