CODEWITHSUNDEEP
javascriptjqueryforms
AgelessEssence
AgelessEssence

Reputation: 6731

how to send non empty inputs when form submit is done with jQuery?

There is a way to send only non empty inputs (( those who value is not equal to "" )) when user do form submission?

i wanna to acheive this cuz my site offers forms to filter data, and use GET method to indicate query string in the url, but clearly something like this

site.mx/voucher/search/?id=1,2,3,4&date_from=&date_until&comment=&status=6

will be much more prettiest in this way

site.mx/voucher/search/?id=1,2,3,4&status=6

ty ;)

Upvotes: 0

Views: 383

Answers (3)

H Aßdøµ
H Aßdøµ

Reputation: 3055

You can do this by selecting only non empty fields using a CSS selector:

$("form#search :input[value!='']").serialize()

I can't comment due my reputation is still under 50, but can you show us how you submit the form?

Upvotes: 1

williambq
williambq

Reputation: 1125

If your form action is a 'GET' and you are using the browser's native form post/get action to do that, you can't rewrite your browser behaviour (well, maybe you can, but you can't control every one else's browser).

If you DO want to use ajax and manually call the submission form via js/ajax, you can rewrite your URL query string and post that cleaner version. Otherwise.....

Upvotes: 0

bdb.jack
bdb.jack

Reputation: 147

Based on what you're saying, you could possibly do something like this with jQuery:

jQuery(function() {
    jQuery(form).on('submit',function(e) {
        e.preventDefault();
        var urlSuffix = '';
        jQuery(this).find(input).each(function() {
            if(jQuery(this).val() !== '' && jQuery(this).val() !== null) {
                if(urlSuffix == '') {
                    urlSuffix += '?';
                } else {
                    urlSuffix += '&';
                }
                urlSuffix += jQuery(this).attr('name') + '=' + jQuery(this).val();
            }
        });
        window.location = 'site.mx/voucher/search/' + urlSiffix;
    });
});

This function first disables your form's "default" submit action, then adds all of the form's fields to the URL and redirects.

However the simpliest method is to simply point the form's action to: site.mx/voucher/search/ and change the method to "GET"

Upvotes: 2

Related Questions