提交前的确认框

时间:2012-12-05 10:50:56

标签: php jquery-ui jquery

我有这个表格,我需要修改,以便在提交前确认。

 echo '<form method="post" action="coupon.php">
<input type="hidden" name="id_user"
 value="'.$id_user.'">
 <input type="hidden" name="points"
 value="250">
 <input type="hidden" name="form_secret" id="form_secret" value="'.$_SESSION['FORM_SECRET'].'" />
  <div id="p2">
<input type="submit" value="250"></div>
</form>';

我试图实现许多jquery模式框(我不需要普通的javascript,因为我需要添加一些设计)但是表格即使有弹出窗口继续处理。 你能给我一些建议吗? 感谢。

3 个答案:

答案 0 :(得分:4)

您可以使用简单的javascript来制作确认框。 内部使用onclick / onsubmit =“createConfirm()”/&gt;

然后使用javascript确认框在提交答案时显示确认框。 http://www.w3schools.com/js/js_popup.asp 使用此链接将为您提供确认框的示例。

您还可以修改布局。你可以看一下。这将是有用的。 http://ui-dev.jquery.com/demos/dialog/#default

答案 1 :(得分:0)

将此添加到您的表单标记....

onsubmit="return false"

echo '<form method="post" action="coupon.php" onsubmit="return false" id="formID">

显示确认弹出窗口......

并确认....发布表格......

if(CONFORMATION){    
  $('#formID').submit() ;  
}else{
  //do your stuff
}

 $("form").submit(function() {
   //show your conformation popup

   if(CONFORMATION){
     return true;
   }

   return false;
});

您的<form>代码

上不需要任何内容

答案 2 :(得分:0)

这是我的方法:

<!DOCTYPE html>
<html lang="en">
    <head>
        <meta charset="utf-8" />
        <title>Test</title>
        <script src="//ajax.googleapis.com/ajax/libs/jquery/1.8.2/jquery.min.js"></script>
    </head>
    <body>
        <form action="blah.php" class="confirm" method="get">
            <input type="text" name="field1" value="" />
            <button type="submit">Submit</button>
        </form>
        <div class="modal" style="display: none;">
            <h1>Attention!!</h1>
            <p>Please confirm this action</p>
            <button type="button" class="action confirm">Confirm</button>
            <button type="button" class="action cancel">Cancel</button>
        </div>
        <script>
        $(function(){
            // capture the form that triggered the action
            var $form;
            // can the form submit
            var $cansend = false;

            // show the modal on form submit
            $('form.confirm').submit(function(){
                $form = $(this);
                if ($cansend == true)
                {
                    $cansend = false;
                    return true;
                }
                $('.modal').show();
                return false;
            });

            // which button got clicked in the modal
            $('div.modal button.action').click(function(){
                if ($(this).hasClass('confirm'))
                {
                    $cansend = true;
                    $('div.modal').hide();
                    $form.submit();
                }
                else
                {
                    $cansend = false;
                    $('div.modal').hide();
                }
            });
        });
        </script>
    </body>
</html>