user1015214
user1015214

Reputation: 3081

jquery submit() ignores changes to input tags

I have a jquery.submit() event handler. What I am trying to do is to catch the submit, and based on certain criteria, modify some of the values (actually, wipe them blank) of the input tags on the submitted form. When I step through with a debugger, I see that the fields are correctly being modified, but once the form submits, I see that it has submitted the original values. Is there a way to do what I am trying to do?

$('#views-exposed-form-find-a-rep-page-1').submit(function(event) {
    //$('.find-a-rep-search').click(function() {
        var address = $('#edit-geo-location');
        var countyField = $('#edit-field-county-value');
        //var stateField = $('#edit-state');
        var postalField = $('#edit-postal-code');
        var contact = $('#edit-field-rep-contact-name-value');
        var disabled = $('input:disabled');
        if(address.val() !== "") {
            var geocoder = new google.maps.Geocoder();
            geocoder.geocode( { 'address': address.val()}, function(results, status) {
                if (status == google.maps.GeocoderStatus.OK) { //if the input wasn't total garbage
                    var county = '';
                    var state = '';
                    var postal = '';
                    ....more logic here....                    }
                    //LOGIC:
                    //1) If we have county and state, use that to validate
                    //2) If we don't have county, use state and zip to validate
                    if (county !== '' && state !== '') {
                        countyField.val(county + ", " + state);
                        //stateField.val(state);
                        postalField.val(postal); //don't need this, but don't think it will harm
                        contact.val(""); //wipe this field so that it doesn't show up in the search url
                        disabled.prop('disabled', false); //undisable any disabled fields so views query works correctly
                        //$('#edit-name-or-location-0-wrapper input[name="name-or-location"][value="0"]').attr('checked','checked'); //reset this
                        //$('#views-exposed-form-find-a-rep-page-1').submit();
                    }
                    else if(county == "" && state !== '') {
                        var message = 'Location not specific enough, please re-enter.';
                        $('.message-box').html(message);
                        event.preventDefault();
                    }
                    else if (county == '' && state == '') { // use zip code instead
                        countyField.val(""); //wipe
                        //stateField.val(state);
                        postalField.val(postal);
                        disabled.prop('disabled', false); //undisable any disabled fields so views query works correctly
                        //@todo - do we want it to die here if the geocode doesn't have a county field?
                        //$('#views-exposed-form-find-a-rep-page-1').submit();
                    }
                }
                else {
                    var message = 'Invalid location, please re-enter.';
                    $('.message-box').html(message);
                    event.preventDefault();
                }
            });

        }
        else if(contact.val() !== "") {
            countyField.val(""); //wipe these fields
            //stateField.val("");
            postalField.val("");
            address.val("");
            disabled.prop('disabled', false); //undisable any disabled fields so views query works correctly
            //$('#views-exposed-form-find-a-rep-page-1').submit();
        }
        else {
            var message = 'No representative name or location has been provided.';
            $errorMessageBox = $('.section div.messages.error');
            if($errorMessageBox.length){
                $errorMessageBox.html(message);
            }else{
                $('#content-area').prepend('' + message + '');
            }
            event.preventDefault();
        }
    }); //end click function

Upvotes: 0

Views: 68

Answers (1)

Bojan Petkovski
Bojan Petkovski

Reputation: 6933

You need to attach a click event to the submit button and change the values there and in the submit the form

$('#submit_button').click(function(event) {
    event.preventDefault();
   // make the changes here and afterwards submit the form
    $('#views-exposed-form-find-a-rep-page-1').submit();
});

You can also try it like this

$('#views-exposed-form-find-a-rep-page-1').submit(function(event) {
    event.preventDefault();
   // make the changes here and afterwards submit the form
    $('#views-exposed-form-find-a-rep-page-1').submit();
});

Upvotes: 1

Related Questions