在使用jQuery Validate进行验证之前,获取提交按钮的ID

问题描述

| 我有一个具有两种不同用途(创建新帖子或更新现有帖子)的表单,该表单显示fancybox弹出窗口中。 我想使用两个按钮来提交表单; \'保存\'和\'保存并关闭\'。 “保存”按钮将只提交表单,并从服务器接收带有时间戳的“成功”消息(因此我可以显示“最后保存的”消息)。 \“保存并关闭\”将从服务器返回一条成功消息,并关闭fancybox。 我的麻烦是,我不知道如何告诉提交处理程序单击了哪个提交按钮,因此它知道是成功关闭框还是仅显示时间戳。 我在考虑是否可以捕获提交按钮的ID,因为它击中了验证程序,可以将其传递给成功处理程序... 这是我的验证器
$(\'#contact\').validate({
    rules: {
        title: {
            required: true
        },comments: {
            required: true,maxlength: 200
        }
    },messages: {
        comments: {
            maxlength: \"Too much text. 200 chars. max.\"
        }
    },submitHandler: function() {
        $(\'#loading_contact\').show();
        var formData = $(\"#contact\").serializeArray();

        $.ajax({
            type: \"POST\",url: \"admin.cfc?method=createPosting&returnformat=json\",data: formData,dataType: \"json\",cache: false,success: function(data) {
            $(\'#formwrapper\').empty();
            $(\'#formwrapper\').html(data.message);
            }   
        });
    }
});
还有我的表格
<cfform name=\"contact\" id=\"contact\">
            <cfif arrayLen(errors)>
                <p>Please correct the following error(s):
                    <ul><cfloop index=\"e\" array=\"#errors#\">
                            <li>
                                <cfoutput>#e#</cfoutput>
                            </li>
                        </cfloop>
                    </ul>
                </p>
            </cfif>
            <cfinput type=\"hidden\" id=\"job_id\" name=\"job_id\">
            <p><label for=\"title\" id=\"ltitle\">Position Title</label></p>
            <cfinput style=\"color:black\" type=\"text\" id=\"title\" class=\"oneliner required\" name=\"title\">
            <p><label for=\"comments\" id=\"lcomments\">Description</label></p>
            <cftextarea style=\"color:black;height:600px;\" id=\"comments\" name=\"comments\" class=\"required\"></cftextarea>
            <p style=\"padding:15px 0 0 0;\"><cfinput style=\"background:none;border:none;text-decoration:underline;color:black;\" type=\"submit\" id=\"submit\" value=\"Save\" name=\"submit\"><img id=\"loading_contact\" src=\"../images/loading.gif\" /> <cfinput style=\"background:none;border:none;text-decoration:underline;color:black;\" type=\"submit\" id=\"saveclose\" value=\"Save and Close\" name=\"saveclose\"><img style=\"display:none;\" id=\"save_close\" src=\"../images/loading.gif\" /></p>
        </cfform>
    

解决方法

        Javascript的变量具有函数作用域,因此要将按下的按钮传递给成功处理程序,请尝试以下操作:
 $(\':button\').click(function(){
       var type = $(this).attr(\'id\');
       $(\'#contact\').validate({  
          submitHandler: function() {
             $.ajax({success: function(data) {if(type===\'\'){}} });
          };
       });
    });
我省略了您已经知道的代码-这只是您的带有传递变量的validate和ajax方法的commithandler和successhandler     ,        另一个选择是让两个按钮都执行ajax发布。您可以先通过form.valid()查看文档来检查表单是否有效。 \“ close \”选项的ajax发布成功调用也会关闭该框。 更新:您还可以使提交按钮在页面上的某个位置设置一个字段,并让成功处理程序读取该字段以确定是否应关闭该框。变一点点,但可以。     ,        我不确定现在如何调用您的sumbit处理程序,但是将其删除并使用:
$(\'#submit\').bind(\'click\',function (e) {
   e.preventDefault(); 
   submitHandler(false);
});
$(\'#saveclose\').bind(\'click\',function(e) {
   e.preventDefault();
   submitHandler(true);
});
总结表格应该起作用。我的意思是您将传递给sumbitHandler的布尔值,如果需要关闭则为true。