Member Avatar for ivan3510

Hi all.
I'm trying to create custom prompt. When I click on the button, appears custom prompt and ask "Do you realy want to submit?". When I click "Yes", the form isn't submited. Here's html code:

<html>
<head>
<link rel="stylesheet" href="look.css" type="text/css">
<script type="text/javascript" src="script.js"></script>
</head>
<body>
<form name="novo" action="obrada.php" method="post">
<input type="text" name="a">
</form>
<input type="button" value="Send" onclick="openPrompt()">
</body>
</html>

css code:

input.prompt{
border:1px solid blue;
background-color:#ebebeb;
font-family:Libersina;
font-size:15px;
color:#003510;
}
td.titlebar{
background-color:#aabbcc;
color:#000066;
font-family:Libersina;
font-size:15px;
}
table.promptbox{
border:1 solid #ccccff;
background-color:rgb(182,220,233);
color:#000066;
font-family:Libersina;
font-size:15px;
padding-bottom:5px;
padding-right:5px;
padding-left:5px;
padding-top:5px;
}
input.promptbox{
border:1px solid blue;
background-color:#ebebeb;
font-family:Libersina;
font-size:16px;
color:#003510;
}

Javascript code:

var response = null
function prompt2(prompttitle, message, f_yes, f_no,button_1,button_2){
promptbox = document.createElement('div');
promptbox.setAttribute ('id' , 'prompt')
document.getElementsByTagName('body')[0].appendChild(promptbox)
promptbox = eval("document.getElementById('prompt').style")
promptbox.position = 'absolute'
promptbox.top = 100
promptbox.left = 200
promptbox.width = 300
promptbox.border = 'outset 1 #bbbbbb'
document.getElementById('prompt').innerHTML = "<table cellspacing='0' width='100%'><tr><td style='padding-left:5px;' class='titlebar'>" + prompttitle + "</td></tr></table>"
document.getElementById('prompt').innerHTML = document.getElementById('prompt').innerHTML + "<table cellspacing='0' width='100%' class='promptbox'><tr><td>"+message+"</td></tr><tr><td align='right'><br><input type='button' class='prompt' value='"+button_1+"' onClick='"+f_yes+"'> <input type='button' class='prompt' value='"+button_2+"' onClick='"+f_no+"'></td></tr></table>"
document.getElementById("promptbox").focus()
}
function yes(){
document.form.submit();
}
function no(){
window.location="dok.php";
}
function openPrompt(){
prompt2('Confirm','Do you realy want to submit form?', 'yes()','no()','Yes','No');
}
  • 2 Contributors
  • 5 Replies
  • 623 Views
  • 1 Day Discussion Span
  • Latest Post Latest Post by ivan3510
Member Avatar for Graphix

You can easily ask the user whether he wants to submit the form or not:

<form method='post' action='' onsubmit='return confirm("Are you sure you want to submit this form?");'>

The confirm() returns true if the user selected "yes" and false if the user selected "no".

~G

Member Avatar for ivan3510

OK. But I want that this popup looks better.

Member Avatar for ivan3510

Is there some other way for creating javascript popup that will be able to submit form by pressing a button?
(The same as when logging to this site.)
Sorry for my bad English.

Member Avatar for Graphix

Well, that is alot more difficult. Anyway here how it is done:

<form name='MyForm' onsubmit='checkValue();' action=''>

And then in the JavaScript:

var form_allowed_to_submit = false; // This is a global variable

function checkValue() {
 if (form_allowed_to_submit == false) {
  prompt2('Confirm','Do you realy want to submit form?', 'yes()','no()','Yes','No');
 }
 return form_allowed to_submit;
}

And then in your yes() function:

form_allowed_to_submit = true;
document.MyForm.submit();
Edited by Graphix because: n/a
Member Avatar for ivan3510

Thank you very much.

Be a part of the DaniWeb community

We're a friendly, industry-focused community of developers, IT pros, digital marketers, and technology enthusiasts meeting, networking, learning, and sharing knowledge.