Link to home
Avatar of Jon Imms
Jon ImmsFlag for United States of America

asked on

jQuery error help

Having a problem with one of the functions in my form.js file.  For some reason it breaks alot of js functionality on the site, such as menus, columns etc.

forms.js
jQuery(document).ready(setupForms);

function setupForms(){
	
	if(jQuery(".wp-block-forms").size() === 0) return false;
	
	jQuery('#user-category').on('change', function(){
		
		var current = jQuery(this);
		var value = current.val();
		var category = jQuery('option[value="'+value+'"]', current).attr('data-cat');
		var primaryProject = jQuery('#primary-project');
		
		primaryProject.val(jQuery("option:first", primaryProject).val());

		jQuery('option.active', primaryProject).removeClass('active');
		jQuery('option[data-cat="'+category+'"]', primaryProject).addClass('active');
		
	});
	
	if(jQuery("#combine-name").size() === 0) return false;
	
	var nameFields = jQuery('#first-name, #last-name');
	
	nameFields.on('keyup', function(){
		jQuery('#combine-name').val(jQuery('#first-name').val() + ' ' + jQuery('#last-name').val());
	});
	
	jQuery('#full_name').on('blur', function() {
		var result = jQuery('#full_name').val().split(/(?<=^\S+)\s/);
	  jQuery('#first-name').val(result[0]);
	  jQuery('#last-name').val(result[1]);
	});

	//Function for passing State value through hidden field, based on phone number area code.
	jQuery('#phone').on('blur', function () {
        var pe = jQuery(this);
        var pNumber = pe.val();
        if (pNumber.length < 3) {
            return;
        }

        var areaCode = pNumber.substr(0, 3);
        jQuery('#areacode').val(getState(areaCode));
	});
	
	//Function for passing State value through hidden field, based on phone number area code.
	jQuery('#phone').on('blur', function () {
        var peCountry = jQuery(this);
        var pNumberCountry = peCountry.val();
        if (pNumberCountry.length < 3) {
            return;
        }

        var areaCodeCountry = pNumberCountry.substr(0, 3);
        jQuery('#areacodeCountry').val(getCountry(areaCodeCountry));
    });

 }

Open in new window


Now if i take out the split names functionality, and my file looks like this,  everything works again (except for the split the full name into first/last name which i took out. )

jQuery(document).ready(setupForms);

function setupForms(){
	
	if(jQuery(".wp-block-forms").size() === 0) return false;
	
	jQuery('#user-category').on('change', function(){
		
		var current = jQuery(this);
		var value = current.val();
		var category = jQuery('option[value="'+value+'"]', current).attr('data-cat');
		var primaryProject = jQuery('#primary-project');
		
		primaryProject.val(jQuery("option:first", primaryProject).val());

		jQuery('option.active', primaryProject).removeClass('active');
		jQuery('option[data-cat="'+category+'"]', primaryProject).addClass('active');
		
	});
	
	if(jQuery("#combine-name").size() === 0) return false;
	
	var nameFields = jQuery('#first-name, #last-name');
	
	nameFields.on('keyup', function(){
		jQuery('#combine-name').val(jQuery('#first-name').val() + ' ' + jQuery('#last-name').val());
	});

	//Function for passing State value through hidden field, based on phone number area code.
	jQuery('#phone').on('blur', function () {
        var pe = jQuery(this);
        var pNumber = pe.val();
        if (pNumber.length < 3) {
            return;
        }

        var areaCode = pNumber.substr(0, 3);
        jQuery('#areacode').val(getState(areaCode));
	});
	
	//Function for passing State value through hidden field, based on phone number area code.
	jQuery('#phone').on('blur', function () {
        var peCountry = jQuery(this);
        var pNumberCountry = peCountry.val();
        if (pNumberCountry.length < 3) {
            return;
        }

        var areaCodeCountry = pNumberCountry.substr(0, 3);
        jQuery('#areacodeCountry').val(getCountry(areaCodeCountry));
    });

 }

Open in new window


Can anybody see why this would be killing functionality on the site?
jQuery('#full_name').on('blur', function() {
            var result = jQuery('#full_name').val().split(/(?<=^\S+)\s/);
        jQuery('#first-name').val(result[0]);
        jQuery('#last-name').val(result[1]);
      });
Avatar of Jeffrey Dake
Jeffrey Dake
Flag of United States of America image

What does your html look like.  I am trying to figure out the 4 fields of first name, last name, full name and combine name. 

ASKER CERTIFIED SOLUTION
Avatar of Jeffrey Dake
Jeffrey Dake
Flag of United States of America image

Blurred text
THIS SOLUTION IS ONLY AVAILABLE TO MEMBERS.
View this solution by signing up for a free trial.
Members can start a 7-Day free trial and enjoy unlimited access to the platform.
See Pricing Options
Start Free Trial