remove parameters from request URL

Question

I am submitting a large form. It has many fields with unspecified values, which translate to field=&field2=&field3....

I don't want these in the GET url. Only keep fields with non-empty value.

I figured out a way to do it with jquery:

$('#form').live('submit', function() {
    $('input[value=""]', '#form').remove();
});

which I thought would do exactly what I wanted.

But apparently I am missing something, because this selects and removes inputs with entered text as well, not just the empty ones.

The above selector (before remove()) contains <input type="text" class="input-medium" name="field1" id="field1" value>, so it looks as if there is no value set. There is a value set though, as confirmed by $('input[name="field1"]').val(), which correctly returns the text that is also visible on screen.

What's up with that? Any ideas?

Using jquery 1.7.2, Chrome 18.0.1025.168.

VisioN · Accepted Answer · 2013-08-23 18:14:31Z

3

Please use filtering of fields, since [value=""] selector checks the default states of the inputs.

$('#form').on('submit', function() {
    $(':input', this).filter(function() {
        return this.value.length == 0;
    }).remove();
});

DEMO: http://jsfiddle.net/bCskH/

UPDATE: In order not removing input fields you can simply disable them:

$('#form').on('submit', function() {
    $(':input', this).filter(function() {
        return this.value.length == 0;
    }).prop('disabled', true);
});

The effect will be the same, however IMHO much nicer :)

DEMO: http://jsfiddle.net/bCskH/1/

edited Aug 23, 2013 at 18:14

answered May 5, 2012 at 13:41

VisioN

146k35 gold badges287 silver badges291 bronze badges

Sign up to request clarification or add additional context in comments.

1 Comment

user124114 Over a year ago

the prop() effect is indeed better than remove(), thanks!

William Calvin · Accepted Answer · 2012-05-05 13:47:47Z

2

You can use jquery selector and serialize() to select only input that has value here is the example

<form id="test">
    <input name="field1" value="Test"><br/>
    <input name="field2" value=""><br/>
    <input name="field3" value="value"><br/>
    <input id="btn" type="button" value="submit"/>
</form>


$('#btn').on('click',function() {
    alert($('#test input[value != ""]').serialize());
});

also I doubt, .live() will work in jquery 1.7 use .on() instead. See this link and it says it has been deprecated

answered May 5, 2012 at 13:47

William Calvin

6256 silver badges19 bronze badges

Comments

ThiefMaster · Accepted Answer · 2012-05-05 13:38:42Z

1

[value=".."] accesses the attribute which is not synced with the current value. Besides that, you cannot specify a selector as context - so move #form into the main selector and use .filter() to restrict the matched elements to empty ones:

$('#form input').filter(function() {
    return !$(this).val();
});

answered May 5, 2012 at 13:38

ThiefMaster

320k85 gold badges608 silver badges648 bronze badges

Collectives™ on Stack Overflow

remove parameters from request URL

3 Answers 3

1 Comment

Comments

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

3 Answers 3

1 Comment

Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Related