简体   繁体   English

jQuery表单提交显示成功消息

[英]Jquery Form on submit show success message

I have a form that uses Jquery to show a message for 我有一个使用Jquery来显示消息的表单

*field required error message *字段必填错误消息

I am trying to get it to show a success message if the form is submitted. 如果表单已提交,我试图使其显示成功消息。

The form submits as long as the req fields are filled in. 只要填写必填字段,表单就提交。

Does anyone know how I can modify this code to show the "success" div if all the "req" fields are filled out? 有谁知道如果所有“ req”字段均已填写,如何修改此代码以显示“成功” div?

Thanks 谢谢

    $(function() {
       function validateform() {
          var valid = true;
          $(".req").css("border","1px solid #ccc");
          $(".req").each(function() {
             if ( $(this).val() == "" || $(this).val().replace(/\s/g, '').length == 0 ) {
                $(this).css("border","1px solided");$(".required").css("display","block");
                valid = false;
             }
          });
          return valid;
       }    
       $("#submit").click( function() {
          $('#myform').submit( validateform );
          $('$name').submit();
       });  
   });
           submitHandler: function(form){
                  $(form).ajaxSubmit({
    target: '#preview', 
    success: function() {  
    $('#form id').slideDown('slow'),
<!-- RESET THE FORM FIELDS AFTER SUBMIT STARTS HERE-->
    $("#form")[0].reset();
<!--RESET THE FORM FIELDS AFTER SUBMIT  ENDS HERE--->
    } 

}); 

                }

There are two simple ways that will allow you to render a success message. 有两种简单的方法可以使您呈现成功消息。 You can either use ajax with the callback success function, or if you want a full post, you you can check at the top of your file if a certain POST was set, and if so, render a success message. 您可以将ajax与回调成功函数一起使用,或者如果您想要完整的帖子,则可以检查文件顶部是否设置了某个POST,如果是,则显示成功消息。

Here is an example of checking POST: 这是检查POST的示例:

if(isset($_POST['name attribute posting'])) {
    $util->showSuccessMessage();
    //OR echo "<div class='popup'></div>"
}

And here is an example of using Ajax's success callback function: 以下是使用Ajax的成功回调函数的示例:

function submitForm() {
    $.ajax({
        url : 'this_file.php',
        type: 'POST',
        success : showSuccessMessage   //function call
    })
}
    $(function() {
           function validateform() {
              var valid = true;
              $(".req").css("border","1px solid #ccc");
              $(".req").each(function() {
                 if ( $(this).val() == "" || $(this).val().replace(/\s/g, '').length == 0 ) {
                    $(this).css("border","1px solided");
                    $(".required").css("display","block");
                    valid = false;
                 }

              });
              return valid;
           }    
           $("#submit").click( function() {
              $('#myform').submit(function()

               {
               if( validateform)
              {
                $('$name').submit();
             }
         } );

           });  
       });

reference submit 参考提交

声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM