How to refresh a parent page #Rails - javascript

I have the fllowing requirement,
I have a model called Task to display user tasks
1 . Link to add a new task (in the tasks index page)
2 . when a user click the link, 'tasks/new' action will open up inside a popup
3 . when the user save the new task, I want to close 'new task' popup and refresh the
parent page 'tasks/index' so that new task will display
I guess, i will have to execute a page reload java script at the end of 'tasks/create' action. But i'm not sure how to.
can anyone help me out to make this happen, thanks in advance
cheers,
sameera

Have your Task controller's create action redirect to the tasks index page as normal so that the newly created task shows up in the list. Then add a JavaScript onclick event handler to the Save button in the New Task popup. The event handler should simply perform a window.close(); to close the popup window when the Save button is clicked. If you're using the Prototype framework, it will be something like:
$("save").observe("click", function() {
window.close();
});
Alternatively, use JavaScript to trap the new task form submission (onsubmit event) and close the popup window that way.

try window.opener.location.reload()
in your case,if you know the index page's action,you can use
redirect_to :action=>'index'

Related

Click on a button in a Modal Window - Protractor

I'm writing protractor tests for an existing app.
I have a button called 'Decline' in a modal window, and I'm trying to click it using:
element(by.buttonText('Decline')).click();
But I receive the below error:
UnknownError: unknown error: Element is not clickable at point (,). Other element would receive the click:
May be because I have another button called 'Decline' outside the modal window?
How do I click on the modal window's Decline button ?
Found that this is the js code that displays this Decline button.
.....
var content = {
title: 'Decline',
htmlBody: '<p>...</p> ',
okButton: 'Decline',
onOk: function() {
.....
As there are two buttons with button text Decline, How do we identity the one in modal?
One way to approach that would be to improve your locator to work in the scope of the modal content. But, since you have not provided an HTML representation of the modal I cannot provide you with a specific answer. Here are the samples that you can improve to fit your use case:
element(by.css(".modalContent button[ng-click*=ok]")).click();
element(by.css(".modalContent")).element(by.buttonText("Decline")).click();
Another approach could be to find all buttons with a specific text and filter the visible one:
element.all(by.buttonText("Decline")).filter(function (button) {
return button.isDisplayed().then(function (isDisplayed) {
return isDisplayed;
});
}).first().click();
My Colleague recommended this and it worked:
Clicking on First Decline button opens up a modal,
Sleep for some time,
Now click on the second Decline button.
element(by.buttonText('Decline')).click();
browser.sleep(2000);
element(by.cssContainingText('.btn', 'Decline')).click();
Thanks for all your help :)
Write the code
which needs to display under modal window,
inside form tag.
And serialize that form with the existing form.
Just search the button by its text and use the function click. So for you it should look like that:
element(by.buttonText('Cancel')).click();
try the below code,
var DeclineBtn = element(by.buttonText('Decline'));
browser.executeScript("arguments[0].click()",DeclineBtn.getWebElement())

Interact between two different web applications using Javascript

I have two applications webApp1 and webApp2. In webApp1 , HTML page contains an tag on click of it an HTML page in webApp2 will be opened in new browser window, page contains one text box and save button. If user enters something in text box and click on save button, need to send a notification from webApp2 to webApp1 so that webApp1 can close the newly opened window and perform some operation after closing window.
How can I achieve this using Java script?
What you are looking for is window.opener.
In Webapp1, window 1, you would have a function in javascript that would need to be done after closing.
function AfterClose() {
// code to execute in Webapp1, triggered in Webapp2
}
In Webapp2, within your save function, do the following.
function Save() {
// ...
// code to save your information
// ...
window.opener.AfterClose();
self.close();
}
Why not just call window.close() as part of the save button click function in webapp2?

How to get data from JS popup window when window is closing

I'm trying to capture when a form field from a popup window exists when the window is closed. I currently do not have control over the child window, but it is on the same domain as the parent window.
I've looked into using the timer functionality:
var child = window.open(...);
var timer = setInterval(checkChild, 500);
function checkChild() {
if (child.closed) {
<DO SOMETHING HERE>
clearInterval(timer);
}
}
but that won't work for me because I don't think that'll give me access to the child's data.
My popup window has a few form fields for uploading a user's profile image. My question is how would I access whether the user SUBMITTED the form or just simply closed the window? There is javascript in the popup window for the submit button that will handle actually uploading the image, but I would need to somehow capture when they click the "upload" button and be able to see that the user actually had an image to upload submitted.
Thanks in advance!
EDIT:
I went ahead and just looked into the closed window event. I couldn't actually get any data from there, but I was able to read further from the DB on the server-side code to get the data I needed.
You can use the child.onbeforeunload event to get information from the child window before it closes.
As suggested by https://stackoverflow.com/a/15769556/1600851

Parent Jsp page refresh when click on popupwindow alert box

I am working on jsp's, I have two jsp one in configDb.jsp, in that I have written code to retrieve the values from database and display it. In this whereas I have option like newconnection.. its a popup window. When I click on that it opens popupwindow and taken the values and store them in a database, but in my parent page I am not able to display those values. After I click on the ok button in popup window, I have to refresh the parent page, then I am able to see the values which I have created few seconds back by the new connection page. Could anyone please help me out?
You can include this in your HTML for the popup window.
<script type="text/javascript">
function proceed(){
opener.location.reload(true);
self.close();
}
</script>
<form onsubmit="proceed()">
...
</form>
Actually you can obtain the answer by googling "javascript refresh parent page from popup" and you will see stackoverflow's answer :)
A better alternative without the need of refreshing the parent page can be achieved by adding a submit button listener and perform a DOM action to insert the new element with new content. This can be easily done by Javascript.

how to stop reloading parent window while child window gets open

I have a form submit, where it get the values from the form and goes
to next page... here I have a hyperlink to open a child window, while
I click, it opens the child window and simultaneously it reloads the
parent window. I have a action configured to the parent window which
has a Database insert statement too.
The problem is that while I click the link it call my action
again(because of page reload), in this action I wrote if condition to
check null/empty string from the previous page form submit. since this
is the second time the action loads it looks of the fields(but
actually those fields are in my previous page form). so it take null
while checking my if condition.
Another problem is that when I solve the above problem here comes the
SQL insert statement, which is about to execute 2nd time. I dont want
this to happen or I dont want my action to execute while I open the
popup window and I want to populate the selected value from the popup
to the parent window.
code used for opening the popup
function select_reactant()
{
window.open ("SeriesTab.action?component=reactant",
"mywindow","scrollbars=1,resizable=1,width=1000,height=1000");
};
This is the place where I open the popup and want to populate the value selected from the popup to the textfiled here
<tr>
<td>reactant</td>
<td><s:textfield name="reactant" id="reactantId" readonly="true" theme="simple"/></td>
</tr>
jquery to get back the value form popup to parent window
$(window.opener.document).find('#reactantId').val(rxn);
the code inside action below is what the action that I mention at the beginning
if(Rxn!=null||!Rxn.equals("")) //Rxn is the field variable for previous page
{
//my insert statement
}
while I run I get nullpointer error since the value for Rxn is reset to null by the page reload due to popup opening done by
window.open
You can do something like this
HTML
reactant
jQuery
$(function(){
$("#anchSelectReactant").click(function(){
select_reactant();
return false;
});
});

Categories

Resources