open new popup window and return value - javascript

I am trying to open a new popup window, insert values into database, after that return one value to current window. After I open a new popup window and click return, it returns the value but when I click on submit and return it after that, the value doesn't get returned. I think that's because the new window gets refreshed by the submit button. That's why it doesn't return the value.
Main Page
<form></form>
<form>
<input name="maparea" size="2" type="TEXT">
<input onclick='targetitem = document.forms[1].maparea; dataitem = window.open("popup.php", "dataitem", "toolbar=no,menubar=no,scrollbars=yes"); dataitem.targetitem = targetitem' value="Get Value" type="button">
</form>
Popoup window
<script>
function select_item(item){
targetitem.value = item;
top.close();
return false;
}
</script>
<form action="" method="post">
<input type="submit" name="sub" value="Submit" />
<input type="button" name="re" value="Return" onclick='return select_item("3")' />
</form>
Any solution for that?
I want to submit what I want first after that return the value

In the popup, hook an onclick event on your submit button so it executes before the submit.
Then in the onclick handler do:
window.opener['dataitem'] = <your return value>;
Then after the submit, your parent window will have that value, and you can access it like this:
var somevariable = window['dataitem'];

function setColor(color){ if (opener && !opener.closed){ opener.document.theForm.theField.value = color; opener.focus(); } window.close(); } ... <td width="30" bgcolor="#FFFF00" onclick="setColor(this.bgColor)"> </td>
Read more at http://www.codingforums.com/showthread.php?t=61319#gkH9pd6gdgvxYqQZ.99

How about this?
Open your popup.
In the popup: submit the form via AJAX (to avoid a page refresh).
In the popup: In the success handler for your AJAX call, grab the desired value, pass it back using window.opener, then close the popup.

Related

hello message function in js [duplicate]

I am new to javascript and on every simple thing i get some kind of problem but this seems un-solve-able to me. I googled and nothing simillar.
After i input data into textbox and store it into variable, i print out variable in paragraph.
Problem is that output i printed out disappears within less than second. Code seems to be normal, what might it be? It looks like c when you dont put getch();
Thanks in advance.
<form>Unesite broj koji ce se ispisat kasnije.<br>
<input type="text" id="userInput">
<input type="submit" name="unos" value="Unesi i ispisi" onclick="unesi()"><br><br>
</form>
<br><br>
<p>Unjeli ste <b id="ispis"></b></p>
<script>
function unesi(){
var userInput = document.getElementById('userInput').value;
document.getElementById('ispis').innerHTML = userInput;
}
</script>
The <form> tag doesn't specify an action attribute, so when you click the submit button, the browser will submit the form to the current URL - which will look a lot like the page is refreshing.
If you want to run the unesi function when the user clicks submit and prevent the HTML form from submitting, you need to change it slightly:
<input type="submit" name="unos" value="Unesi i ispisi"
onclick="unesi(); return false;">
The return false prevents the form from submitting itself.
Because the form submits and refreshes the page. Cancel the form request.
<input type="submit" name="unos" value="Unesi i ispisi" onclick="return unesi()">
and the function
function unesi(){
var userInput = document.getElementById('userInput').value;
document.getElementById('ispis').innerHTML = userInput;
return false;
}
better option is to do it on the form level
<form action="#" method="get" onsubmit="return unesi()">
Instead of cancelling the form submitting, another option is to change
<input type="submit" name="unos" value="Unesi i ispisi" onclick="unesi()">
to
<input type="button" name="unos" value="Unesi i ispisi" onclick="unesi()">
This will make it so the form does not try to submit at all when the button is pressed.

My code don't refresh parent page in some cases

I am using a thick box and want to refresh parent page when thicbox is closing. I use below code but it works sometime and dont work in some situations... waht is the problem with it?
<script>
function close2()
{
parent.tb_remove();
parent.location.reload(1)
}
</script>
<input type="submit" name="save_new_task" id="save_new_task" onclick="close2()" style="width: 100px;text-align: center;"
class="button button-primary button-medium" value="<?Php _e("register","creat_mysite");?>"/>
Maybe it is because your submitting the form before the JavaScript get executed? If you want to submit your form and then perform a Javascript function you can try this:
$(document).ready(function()
{
$('#save_new_task').click(function(e)
{
e.preventDefault();
//Serialize your form
//POST request
//Maybe also try window.opener instead of parent
//window.opener refers to the window that called window.open( ... ) to open the window from which it's called
//window.parent refers to the parent of a window in a <(i)frame>
window.opener.tb_remove();
window.opener.location.reload();
});
});
i dont know the context but from what i could figure out try the below
Try this:
<script>
function close2()
{
parent.tb_remove();
parent.location.reload(1);
return true;
}
</script>
<form onsubmit="return close2()" >
<input type="submit" name="save_new_task" id="save_new_task" style="width: 100px;text-align: center;" class="button button-primary button-medium" value="<?Php _e("register","creat_mysite");?>"/>
</form>

Result from JS function shows up and dissapears

I have a JavaScript function:
function SaskaitisanasFunkcija(){
var x = document.forms[0].elements[0].value;
var y = document.forms[0].elements[1].value;
var saskaitisana = parseFloat(x)+parseFloat(y);
document.forms[0].elements[6].value = saskaitisana;}
And a form, that includes this:
<form>
Pirmais skaitlis: <input type="text"><br>
Otrais skaitlis: <input type="text"><br>
Matemātiskā darbība:
<button onclick="SaskaitisanasFunkcija()">+</button>
<button onclick="AtnemsanasFunkcija()">-</button>
<button onclick="ReizinasanasFunkcija()">*</button>
<button onclick="DalisanasFunkcija()">/</button><br>
<b>Rezultāts</b><input type="text">
</form>
What happens is that when I press the button, that has the function "SaskaitisanasFunkcija()" attached to it, the result shows up in the "Rezultāts" input window (not sure how to call it any other way) and dissapears instantly. Can anyone explain why does that happen and give me a hint how to fix the problem?
It happens because the form gets submitted and the page reloads, add the parameter type="button" to the button element
<button type="button" onclick="SaskaitisanasFunkcija()">+</button>
and the form should no longer submit and reload when you click it

Javascript innerHTML Not Posting

I am trying to get a function to print out whatever the user inputs into the text-box. I am using onClick as an attribute on my submit button. I know I set it up properly because it flickers the answer, but only for a split second. How can I get the input to stay on the page? Here's the code: HTML: Type what you want to post to the website!
HTML:
<div id="main_div">
<section id="leftbox">
<form name="mybox">
Type what you want to post to the website!:
<br />
<input type="textbox" size="15" maxlength="15" name="text" id="text">
<br />
<input type="submit" value="Submit!" onClick="doFirst()">
</form>
</section>
</div>
<div id="insert"></div>
Javascript:
function doFirst(){
text = document.getElementById('text');
insert = document.getElementById('insert');
if(text.value == "")
{
insert.innerHTML = "Please input something!";
return false;
}
else
{
insert.innerHTML = text.value;
}
}
try this:
Using type=button
<input type="button" value="Submit!" onClick="doFirst()">
OR using type=submit
<form name="mybox" onsubmit="doFirst(); return false;">
<input type="submit" value="Submit!">
</form>
Explain:
The action for onclick in submit button DO executed. You keep see the page does not have any changes, because of there are a FORM. And the key point: the form handle the submit action after the JS function doFirst() immediately. Adding the onsubmit in the form with return false to stop default action, means:
<form name="mybox" onsubmit="return false;">
<input type="button" value="Submit!" onClick="doFirst()">
</form>
To simplify the changes, use button instead of submit type, or using onsubmit instead of onclick in form trigger.
onClick="doFirst()"
gets converted into an anonymous function:
function(){ doFirst() }
and whatever that function returns determines if the submit should be completed or aborted, so you should use:
onClick="return doFirst();"
In other words, it's not enough that doFirst return something, whatever doFirst returns should be returned again inside the onClick.

when I click submit, it goes straight onto another page

My form submits to another page when I do not want it to. The current page is known as create_session.php
I want the form to submit if all of the validation and the postback is met and even after that the user needs to click "Ok" when the confirmation box appears. Except this never happens. When the user clicks on the submit button, it takes the user straight to another page "QandATable.php", it doesn't care about about validation(), the postback() and the confirmation box doesn't appear.
So what I want to know is that when the user clicks on the submit button, how can I get it so that it checks for the validation(), postback() and confirmation box (showConfirm()) before even going onto the next page.
I believe the problem is the submit button and the form action. Below is the form:
<form action="QandATable.php" method="post" id="sessionForm">
<p><input type="text" id="txtMarks" name="textMarks" onkeypress="return isNumberKey(event)" maxlength="5" /><br/><span id="marksAlert"></span></p>
<p><strong>Room:</strong> <input type="text" id="room" name="roomChosen" value="<?php echo $roomChosen; ?>" />
<br/><span id="roomAlert"></span></p> <!-- Enter Room here-->
<p><input class="questionBtn" type="submit" value="Prepare Questions" name="prequestion" onClick="myClickHandler()"/></p>
</form>
Below is the javascript click handler where it checks for the validation(), postback() and then if both of those met then it will showConfirm().
function myClickHandler(){
if(validation()){
postback(function(message) {
if (message == "")
showConfirm();
});
}
}
You need to return false from your onClick handler to prevent the form from being submitted.
You need to make sure the default action isn't applied when the submit button is clicked. In this case, the default action is to submit the form.
Try adding a return false; such as
<input class="questionBtn" type="submit" value="Prepare Questions" name="prequestion" onClick="myClickHandler(); return false;"/>
Two changes; you need to pass the function, not the function's return value, and you need to return false:
<input class="questionBtn" type="submit" value="Prepare Questions" name="prequestion" onClick="myClickHandler" />
------------------------------------------------------------------------------------------------------------^ here
and
function myClickHandler(){
if(validation()) {
postback(function(message) {
if (message == "")
showConfirm();
});
}
return false;
}

Categories

Resources