在发送方法之前添加锚数据以使用Ajax发送

时间:2014-10-13 05:46:06

标签: jquery ajax anchor

我正在编写用于验证和提交表单的Jquery代码。我有锚标记包含值。功能是....我想得到锚数据并发布....简单......怎么做?

    (function ($) {

            "use strict";

            $(document).ready(function () {

            if ($('#hcm_new_applicant_form').length) {
                        $("#hcm_new_applicant_form").validate({
                            // Rules for form validation
                            rules: {                    
                                applicant_name: {
                                    required: true
                                },
                                cnic: {
                                    required: true
                                },
                                mobilephonereq: {
                                    required: true
                                },                                        
                                gender: {
                                    required: true
                                }                    
                            },

                            // Messages for form validation
                            messages: {
                                applicant_name: {
                                    required: 'Please enter applicant name'
                                },                    
                                cnic: {
                                    required: 'Please provide CNIC number'
                                },
                                mobilephonereq: {
                                    required: 'Please enter mobile phone'
                                },
                                gender: {
                                    required: 'Please select gender'
                                }                    
                            },


                            // Ajax form submition  
                            /* Previous CODE                     
                            submitHandler: function (form) {
                                $(form).ajaxSubmit({
                                    beforeSend: function () {                               
                                        var anchors = document.getElementsByName('hcm_position_tags');
                                        var myAnchor = anchors[0];
                                        var value = myAnchor .getAttribute('value');  // This give inside value
                                        var html = myAnchor .innerHTML;  // This give selected tags                                                          
                                    },

                                    success: function () {                                                                                           
                                        $('<input />').attr('type', 'hidden')
                                          .attr('name', "hcm_all_position_tags")
                                          .attr('value', html)
                                          .appendTo('#hcm_new_applicant_form');
                                        return true;
                                    }
                                });
                            },   

                            Previous CODE 
    // Ajax form submition                                               
                    submitHandler: function (form) {
                        var $tag = $('hcm_position_tags');
                        $(form).ajaxSubmit({
                            data: {
                                tags: $tag.attr('value'),
                                html: $tag.html()
                            },
                            success: function () {
                                $('<input />').attr('type', 'hidden')
                                    .attr('name', "hcm_all_position_tags")
                                    .attr('value', html)
                                    .appendTo('#hcm_new_applicant_form');
                                return true;
                            }
                        });
                        return false;
                    },  */
/* NEW CODE */
// Ajax form submition                                               
                submitHandler: function (form) {
                    var $tag = $('#tags_hcm_position');

                    var html = $tag.html(); // This give selected tags  
                    alert($tag.length + ':' + html + ':' + $tag.attr('value'));

                    $('<input />', {
                        type: 'hidden',
                        'name': "hcm_all_position_tags",
                        'value': html
                    }).attr('type', 'hidden').appendTo(form);

                    form.submit();
                },          

                            errorPlacement: function (error, element) {
                                error.insertAfter(element.parent());
                            }
                        });
                    }

        }}

以前我用过这个

$("#hcm_new_applicant_form").submit( function(eventObj) {
  var anchors = document.getElementsByName('hcm_position_tags');
  var myAnchor = anchors[0];
  var value = myAnchor .getAttribute('value');  // This give inside value
  var html = myAnchor .innerHTML;  // This give selected tags  

  $('<input />').attr('type', 'hidden')
      .attr('name', "hcm_all_position_tags")
      .attr('value', html)
      .appendTo('#hcm_new_applicant_form');
  return true;
});

问题是我收到了POST数据,但验证不起作用。我想验证+ POST其他数据......

没有......怎么做

html中的

hcm_position_tag是

<a href="#" id="tags_hcm_position" name="hcm_position_tags" data-name="tags_hcm_position" data-type="select2" data-pk="1" data-title="Enter position applied for" class="editable editable-click" style="display: inline; background-color: rgba(0, 0, 0, 0);">Teaching</a>

得到错误“0:undefined:undefined”

1 个答案:

答案 0 :(得分:0)

您需要的是data,而不是beforeSend

(function ($) {
    "use strict";
    $(document).ready(function () {
        if ($('#hcm_new_applicant_form').length) {
            $("#hcm_new_applicant_form").validate({
                // Rules for form validation
                rules: {
                    applicant_name: {
                        required: true
                    },
                    cnic: {
                        required: true
                    },
                    mobilephonereq: {
                        required: true
                    },
                    gender: {
                        required: true
                    }
                },

                // Messages for form validation
                messages: {
                    applicant_name: {
                        required: 'Please enter applicant name'
                    },
                    cnic: {
                        required: 'Please provide CNIC number'
                    },
                    mobilephonereq: {
                        required: 'Please enter mobile phone'
                    },
                    gender: {
                        required: 'Please select gender'
                    }
                },


                // Ajax form submition                                               
                submitHandler: function (form) {
                    var $tag = $('hcm_position_tags');

                    var html = $tag.html(); // This give selected tags  
                    alert($tag.length + ':' + html + ':' + $tag.attr('value'))

                    $('<input />', {
                        type: 'hidden',
                        'name': "hcm_all_position_tags",
                        'value': html
                    }).attr('type', 'hidden').appendTo(form);

                    form.submit();
                },

                errorPlacement: function (error, element) {
                    error.insertAfter(element.parent());
                }
            });
        }

    })
})

这会向名为tagshtml的服务器发送2个附加参数(将其更改为您想要的任何内容)。