Home/ Questions/Q 8779563
In Process

The Archive Base Latest Questions

Editorial Team
  • 0
Asked: 2026-06-13T19:49:13+00:00

Here’s a quick background on what I’m trying to do. I have a contact

  • 0

Here’s a quick background on what I’m trying to do. I have a contact form on my website, and when the user clicks on ‘Submit’, I want it to do this:

  1. User clicks submit
  2. Confirmation box opens, asking user to agree or disagree to the
    disclaimer
  3. if agrees = submit form
  4. if disagrees = close confirmation box

Here is what I want to know. I don’t necessarily want to style the actual alert box, since I know that is not possible, what I want to do is style the text inside the alert box; the “disclaimer”. I tried just adding header tags and bold tags to it, but those just generate the text and not the actual styles.

Here’s the code I’m using, its just a very simple alert box script.. if you have a better idea, please let me know.

<SCRIPT language="JavaScript">
<!--
function go_there()
{
var where_to= confirm("DISCLAIMER TEXT WILL GO HERE");
if (where_to== true)
 {
  window.location="http://mcgehee.ace-onecomputers.com/nlphpmail.php";
 }
  else
 {

 }
}
//-->

HTML:

<button class="button" id="submit" value="send" type="submit" name="submit" onClick="go_there()">Send</button>

Also, another issue i’m having with this is that instead of it just closing the dialog box, it still continues the script.

Share

Leave an answer

You must login to add an answer.

Need An Account,

1 Answer

  1. Editorial Team

    You cannot style alert or confirm box. You have to use DHTML box.

    Using Impromptu

    Try this, I used jQuery Impromptu plugin http://trentrichardson.com/Impromptu/

    Demo: http://jsfiddle.net/muthkum/4h8cX/6/

    For full code, check out page source on http://fiddle.jshell.net/muthkum/4h8cX/6/show/

    Using smoke.js

    Demo: http://jsfiddle.net/muthkum/8qXsv/3/

    UPDATE:

    Here is the full code using jQuery Impromptu

    You can see, I’ve included jquery-1.8.2.js and jquery-impromptu.4.0.min.js. Also styles are included in the below codes. I hope this helps.

    <!DOCTYPE html>
<html>
<head>
  <meta http-equiv="content-type" content="text/html; charset=UTF-8">
  <title> - jsFiddle demo by muthkum</title>

  <script type='text/javascript' src='http://code.jquery.com/jquery-1.8.2.js'></script>    

      <script type='text/javascript' src="http://trentrichardson.com/Impromptu/scripts/jquery-impromptu.4.0.min.js"></script>


  <style type='text/css'>
    /*
------------------------------
    Impromptu
------------------------------
*/
.jqifade{
    position: absolute; 
    background-color: #777777; 
}
div.jqi{ 
    width: 400px; 
    font-family: Verdana, Geneva, Arial, Helvetica, sans-serif; 
    position: absolute; 
    background-color: #ffffff; 
    font-size: 11px; 
    text-align: left; 
    border: solid 1px #eeeeee;
    border-radius: 10px;
    -moz-border-radius: 10px;
    -webkit-border-radius: 10px;
    padding: 7px;
}
div.jqi .jqicontainer{ 
    font-weight: bold; 
}
div.jqi .jqiclose{ 
    position: absolute;
    top: 4px; right: -2px; 
    width: 18px; 
    cursor: default; 
    color: #bbbbbb; 
    font-weight: bold; 
}
div.jqi .jqimessage{ 
    padding: 10px; 
    line-height: 20px; 
    color: #444444; 
}
div.jqi .jqibuttons{ 
    text-align: right; 
    padding: 5px 0 5px 0; 
    border: solid 1px #eeeeee; 
    background-color: #f4f4f4;
}
div.jqi button{ 
    padding: 3px 10px; 
    margin: 0 10px; 
    background-color: #2F6073; 
    border: solid 1px #f4f4f4; 
    color: #ffffff; 
    font-weight: bold; 
    font-size: 12px; 
}
div.jqi button:hover{ 
    background-color: #728A8C;
}
div.jqi button.jqidefaultbutton{
    background-color: #BF5E26;
}
.jqiwarning .jqi .jqibuttons{ 
    background-color: #BF5E26;
}


  </style>



<script type='text/javascript'>//<![CDATA[ 

function go_there(){

    $.prompt('<b>DISCLAIMER</b> <span style="font-weight:normal">TEXT WILL GO HERE</span>',{
       buttons: { Ok: true, Cancel: false}, 
       callback: function(e,v,m,f){
          if(v){
             window.location="http://mcgehee.ace-onecomputers.com/nlphpmail.php";
          }else{

          }
       }
   });

}

//]]>  

</script>


</head>
<body>
  <button class="button" id="submit" value="send" type="submit" name="submit" onClick="go_there()">Send</button>


</body>


</html>

​
    • 0