jQuery验证-动态表单字段消息

Question

I am using JQuery Validate to do validation on my forms.

$("#myform").validate({
    rules: {
        email: {
            customemail: true
        }
    },
    messages: {
        firstName: $('#' + requestTypeValue + '_' + 'firstName').attr('data-error'),
        lastName: $('#' + requestTypeValue + '_' + 'lastName').attr('data-error'),
        email: $('#email').attr('data-error')

    },

This works, pefectly. but now I need to make a change so that the messages object can have dynamic feild names based on a global variable so I need to do something like this:

$("#myform").validate({
    rules: {
       "email": {
            customemail: true
        }
    },
    messages: {
         "myGlobalVar" + firstName: $('#' + requestTypeValue + '_' + 'firstName').attr('data-error'),
         "myGlobalVar" + lastName: $('#' + requestTypeValue + '_' + 'lastName').attr('data-error'),
         "myGlobalVar" + email: $('#email').attr('data-error')

    },

I was thinking if I create the messages object outside of this method, then I would end up with something like this, might work

$("#myform").validate({
    rules: {
       "email": {
            customemail: true
        }
    },
    messages: myMessageObject

    },

but I'm still not sure on the syntax to create a dynamic object in this way.

Ideas please?

UPDATE: Chirag Ravindra Answer looked like exactly what I needed so I tired it, but it didn't work. So as a first step I tried this based on Chirag Ravindra answer:

$("#myform").validate({
    rules: {
        email: {
            customemail: true
        }
    },
    messages: {
        Prefix_firstName: $('#' + requestTypeValue + '_' + 'firstName').attr('data-error'),
        lastName: $('#' + requestTypeValue + '_' + 'lastName').attr('data-error'),
        email: $('#email').attr('data-error'),
        jobTitle: $('#' + requestTypeValue + '_' + 'jobTitle').attr('data-error'),
        company: $('#' + requestTypeValue + '_' + 'company').attr('data-error'),
        phone: $('#' + requestTypeValue + '_' + 'phone').attr('data-error'),
        comments: $('#' + requestTypeValue + '_' + 'comments').attr('data-error')
    },

This works for the Prefix_firstName field, BUT this doesn't work:

var validationMessages = {};

validationMessages =  {
            Prefix_firstName: $('#' + requestTypeValue + '_' + 'firstName').attr('data-error'),
            lastName: $('#' + requestTypeValue + '_' + 'lastName').attr('data-error'),
            email: $('#email').attr('data-error'),
            jobTitle: $('#' + requestTypeValue + '_' + 'jobTitle').attr('data-error'),
            company: $('#' + requestTypeValue + '_' + 'company').attr('data-error'),
            phone: $('#' + requestTypeValue + '_' + 'phone').attr('data-error'),
            comments: $('#' + requestTypeValue + '_' + 'comments').attr('data-error')
        },

        $("#myform").validate({
            rules: {
                email: {
                    customemail: true
                }
            },
            messages: validationMessages,

I really don't understand why just by moving the messages in to an object causes it to fail...

Answer 1

I'm not sure that this is valid syntax:

{
     "myGlobalVar" + firstName: $('#' + requestTypeValue + '_' + 'firstName').attr('data-error'),
     "myGlobalVar" + lastName: $('#' + requestTypeValue + '_' + 'lastName').attr('data-error'),
     "myGlobalVar" + email: $('#email').attr('data-error')

}

You can use the array notation to create objects with dynamic keys (if that is your intention):

 var requestTypeValue = 'test'; var myGlobalPrefix = 'prefix_'; var myMessagesObject = {}; myMessagesObject[myGlobalPrefix+'firstname'] = $('#' + requestTypeValue + '_' + 'firstName').attr('data-error'); console.log(myMessagesObject); /** Output: { "prefix_firstname": "Error Message" } **/ 

 <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> <div id='test_firstName' data-error="Error Message"></div> 

You can then use the myMessagesObject handler in your validation method

$("#myform").validate({
    rules: {
       "email": {
            customemail: true
        }
    },
    messages: myMessagesObject

 },...)