Validating an edit form (Javascript)

  • Resolved worldless

    (@worldless)


    7 years, 1 month ago

    The following Javascript code validates #add_new_entry_form. I need it to validate #edit_entry_form as well.

    // JavaScript Document

jQuery( document ).ready( function() {

	// if google maps are enabled, address, city, zip and country are mandatory!
	if( parseInt( frm_vrule.gmapsenabled ) ) {
		
		jQuery( '#add_new_entry_form' ).validate( {
			ignore: "",
			rules: {
			  frm_personal_details_address: {
				minlength: 5,
				required: true
			  },
			  frm_personal_details_city: {
				minlength: 2,
				required: true
			  },
			  frm_personal_details_zip: {
				minlength: 4,
				required: true
			  },
			  frm_personal_details_country: {
				minlength: 3,
				required: true
			  },
			  frm_entry_title: {
				minlength: 5,
				required: true
			  },
			  frm_entry_content: {
				minlength: 165,
				required: true
			  },
			  frm_entry_excerpt: {
				minlength: 120
			  },
			  frm_entry_url: {
				url: true
			  }
			},
			messages: {
			  frm_personal_details_address: {
				frmaddress: frm_vrule.frmaddress,
				required: frm_vrule.required
			  },
			  frm_personal_details_city: {
				frmcity: frm_vrule.frmcity,
				required: frm_vrule.required
			  },
			  frm_personal_details_zip: {
				  frmzip: frm_vrule.frmzip,
				  required: frm_vrule.required
			  },
			  frm_personal_details_country: {
				  frmcountry: frm_vrule.frmcountry,
				  required: frm_vrule.required
			  },
			  frm_entry_title: {
				frmtitle: frm_vrule.frmtitle,
				required: frm_vrule.required
			  },
			  frm_entry_content: {
				frmcontent: frm_vrule.frmcontent,
				required: frm_vrule.required
			  },
			  frm_entry_excerpt: frm_vrule.frmexcerpt,
			  frm_entry_url: frm_vrule.frmurl
			},
			errorPlacement: function( label, element ) {
				if( element.is( "textarea" ) && !element.is( ":visible" ) ) label.insertAfter( element.next() );
				else label.insertAfter( element );
			}
			
		} );
		
	} else {
	
	jQuery( '#add_new_entry_form' ).validate( {
		ignore: "",
		rules: {
		  frm_entry_title: {
			minlength: 5,
			required: true
		  },
		  frm_personal_details_country: {
			minlength: 2,
			required: true
		  },
		  frm_entry_content: {
			minlength: 30,
			required: true
		  },
		  frm_entry_excerpt: {
			minlength: 30
		  },
		  frm_entry_url: {
			url: false
		  }
		},
		messages: {
		  frm_entry_title: {
			frmtitle: frm_vrule.frmtitle,
			required: frm_vrule.required
		  },
		  frm_entry_content: {
			frmcontent: frm_vrule.frmcontent,
			required: frm_vrule.required
		  },
		  frm_entry_excerpt: frm_vrule.frmexcerpt,
		  frm_entry_url: frm_vrule.frmurl
		},
		errorPlacement: function( label, element ) {
			if( element.is( "textarea" ) && !element.is( ":visible" ) ) label.insertAfter( element.next() );
			else label.insertAfter( element );
		}
		
		} );
	
	}
	
	jQuery( '#frm_submit' ).click( function() {
		tinyMCE.triggerSave();
		var status;
		status = jQuery( "#add_new_entry_form" ).valid(); //Validate again
		if( status == true ) jQuery( "#frm-fuzz" ).fadeIn();
	} );
	  
} ); // end document.ready

function tinyMCE_callback_validate() {
    tinyMCE.triggerSave();
    jQuery( '#frm_entry_content' ).valid();
}
    • This topic was modified 7 years, 1 month ago by worldless.
Viewing 6 replies - 1 through 6 (of 6 total)

  • If the validation code you wish to run on the field #add_new_entry_form is identical to the validation you want to run on #edit_entry_form then you could use the jQuery multiple selector to

    jQuery( '#add_new_entry_form, #edit_entry_form' ).validate( { ...your validation code... });

    You could also add a specific class to your inputs like ‘needs-validation’ and let jQuery select all inputs with that class.

    jQuery( '.needs-validation' ).validate( { ...your validation code... });

    Thread Starter worldless

    (@worldless)

    I replaced '#add_new_entry_form' with '#add_new_entry_form, #edit_entry_form' and it fixed the issue… Thanks wpaart

    However there is a part with "#add_new_entry_form". should I change it to "#add_new_entry_form, #edit_entry_form" ?

    • This reply was modified 7 years, 1 month ago by worldless.
    • This reply was modified 7 years, 1 month ago by worldless.

    If you need the same functionality than also changing that code is a valid option. But if everything now works as expected you can leave it at that.

    Thread Starter worldless

    (@worldless)

    Thank you so much for your help

    No problem. Do not hesitate to post further WordPress questions on the forums. Have a nice weekend.

    Thread Starter worldless

    (@worldless)

    That’s very nice of you… you too

Viewing 6 replies - 1 through 6 (of 6 total)
  • The topic ‘Validating an edit form (Javascript)’ is closed to new replies.

Tags