Create Yes/No dialog box; Getting JS values from pop-up window on submit

  • Thread starter gimme_this_gimme_that
  • Start date
G

gimme_this_gimme_that

Hi,

This is sort of a :

How to build a Yes/No dialog box qquestion.

Or perhaps a question about getting javascript variables
from a pop-up window and processing them on a submit.

This is what I'd like to have happen :

When the user clicks on the Delete button the confirm() method
should run and prompt the user for a Yes/No selection. Then
the doDelete variable should get assigned. Then the validate()
method should get called. The result of validate() should be
false if the user selected "No".

This is what happens :

confirm runs and prompts the user. The validate() method never
sees the value of doDelete.

Notice there are two forms.

Your help is appreciated. Thanks!

<html>
<head>
<script>
var winConfirm = null;
var buttonNum = 0;
var doDelete = "No";

function confirm()
{
var windowWidth = 250;
var windowHeight = 100;
var locX = ( screen.width - windowWidth ) / 2;
var locY = ( screen.height - windowHeight ) / 2;
var windowFeatures = "width=" + windowWidth
+ ",height=" + windowHeight
+ ",screenX=" + locX
+ ",screenY=" + locY
+ ",titlebar=no"
+ ",left=" + locX
+ ",top=" + locY;

if ( ( winConfirm != null ) && !winConfirm.closed ) {
winConfirm.close();
}

winConfirm = window.open( "", "winConfirm", windowFeatures );

var theHTML = '<head><title>Confirm Deletion</title>'
+ '<body bgcolor="#cccccc">'
+ '<center><font="Verdana, Arial"><b>'
+ 'Really Delete ?'
+ '</b><form name="buttonForm">'
+ '<input type="button" value=" Delete "'
+ ' onclick="opener.buttonClicked(0);self.close();">'
+ '&nbsp;'
+ '<input type="button" value=" Cancel "'
+ ' onclick="opener.buttonClicked(1);self.close();">'
+ '</form></center></font></body>';

winConfirm.document.writeln( theHTML );
alert("Flow shouldn't get here until after the user has selected Yes
or No. How to make it wait for Yes/No ?");
}

function buttonClicked( buttonChoice )
{
switch( buttonChoice )
{
case 0:
doDelete = "Yes";
break;
default:
doDelete = "No";
}
}

function validate(aForm) {
alert("in validate");
if (buttonNum < 2 ) {
aForm.submit();
}
if (doDelete == "No") {
return false;
}
aForm.submit();
}

</script>
</head>
<body>
<form name="aForm" onsubmit="return validate(this);">
<hidden value="2" name="id">
<input type="submit" onclick="buttonNum=0;" value="Edit"><br>
<input type="submit" onclick="buttonNum=1;" value="Send"><br>
<input type="submit" onclick="buttonNum=2;confirm();"
value="Delete"><br>
</form>
<p>
<form name="aForm" onsubmit="return validate(this);">
<hidden value="3" name="id">
<input type="submit" onclick="buttonNum=0;" value="Edit"><br>
<input type="submit" onclick="buttonNum=1;" value="Send"><br>
<input type="submit" onclick="buttonNum=2;confirm();"
value="Delete"><br>
</form>

</body>
</html>
 
G

gimme_this_gimme_that

Ooooooooh that's sweet. I'm gonna go with that.

I'd be interested in seeing a solution for the original question
though.
- Having spent a few hours try to get it to work.
 
S

Stephen Chalmers

This is sort of a :
How to build a Yes/No dialog box qquestion.

<SNIP>

I have to assume that you're not happy with the limitations of the JS confirm function, although what you're creating
looks pretty much the same.

validate() is called by the submit handler, however it submits the form, which would cause validate() to be called
again. I'm not sure what result that may have.

Opening a new window does not stall execution of a script, therefore if 'delete' is selected, submission should be made
conditional on the 'yes' being pressed.

The HTML generated had missing <HTML> & </HEAD tags.

Failing to call document.open() before writing the HTML and document.close() thereafter, was causing a wait cursor to
appear constantly.

This minor modification abandons validate() and uses the return value of confirm() to authorise the submit.

If the confirm window is opened, buttonClicked( ) determines the action.

Beware it's a bit sluggish under Mozilla and if 'delete' is clicked twice, Opera doesn't seem to like closing the window
and reopening it. I'm not an avid window opener.

<html>
<head>
<script>
var winConfirm = null;
var buttonNum = 0;
var doDelete = "No";

function confirm()
{
var rv=true;

var windowWidth = 250;
var windowHeight = 100;
var locX = ( screen.width - windowWidth ) / 2;
var locY = ( screen.height - windowHeight ) / 2;
var windowFeatures = "width=" + windowWidth
+ ",height=" + windowHeight
+ ",screenX=" + locX
+ ",screenY=" + locY
+ ",titlebar=no"
+ ",left=" + locX
+ ",top=" + locY;

if ( ( winConfirm != null ) && !winConfirm.closed ) {
winConfirm.close();
}

if(buttonNum==2)
{
buttonNum=0; // Prepare for subsequent call

rv=false // Cancel submit and let opener.buttonClicked DECIDE

winConfirm = window.open( "", "winConfirm", windowFeatures );

var theHTML = '<HTML><head><title>Confirm Deletion</title></HEAD>'
+ '<body bgcolor="#cccccc">'
+ '<center><font="Verdana, Arial"><b>'
+ 'Really Delete ?'
+ '</b><form name="buttonForm">'
+ '<input type="button" value=" Delete "'
+ ' onclick="opener.buttonClicked(0);self.close();">'
+ '&nbsp;'
+ '<input type="button" value=" Cancel "'
+ ' onclick="opener.buttonClicked(1);self.close();">'
+ '</form></center></font></body></HTML>';
winConfirm.document.open();
winConfirm.document.writeln( theHTML );
winConfirm.document.close();

}

return rv;
}

function buttonClicked( buttonChoice )
{
if(buttonChoice==0)
document.forms.aForm.submit();
}

</script>
</head>
<body>

<form name="aForm" onsubmit="return confirm(this);">
<input type="submit" onclick="buttonNum=0;" value="Edit"><br>
<input type="submit" onclick="buttonNum=1;" value="Send"><br>
<input type="submit" onclick='buttonNum=2;' value="Delete"><br>
</form>

</body>
</html>
 
G

gimme_this_gimme_that

Thanks Stephen,

That works and looks great.

You also explained what I didn't know and what I couldn't
figure out on my own.

I totally missed the double call to validate, although I seen it
occur in my sandbox somehow I still missed it. So it goes
when you're spinning your wheels.

Assiging buttonNum to zero. Now that was a good tip.

Letting buttonClicked() handle the submit was something
I wouldn't have thought of doing.

You get my tip of the hat. Wow!
 

Ask a Question

Want to reply to this thread or ask your own question?

You'll need to choose a username for the site, which only take a couple of moments. After that, you can post your question and our members will help you out.

Ask a Question

Members online

Forum statistics

Threads
473,769
Messages
2,569,579
Members
45,053
Latest member
BrodieSola

Latest Threads

Top