How not to send empty input value in GET-query

Question

I have a form like this

<form action="index.php" method="get">
  <input type="hidden" name="id" value="1">
  <input type="hidden" name="order_by" value="">
  <button type="submit">Submit</button>
</form>

It has some jQuery handlers to fill in "order_by" field. If I submit this form with empty "order_by" filed, I get an address like this: index.php?id=1&order_by=

What is the best way I can do to get following address after form submission if the "order_by" is empty: index.php?id=1 ?

On submit, check if it's empty and, if it is, remove it from the DOM. — GriffeyDog, Sep 11 '14 at 14:51
I don't use JavaScript for submission, just clean html form behaviour. — femalemoustache, Sep 11 '14 at 15:01
Does this answer your question? [How to prevent submitting the HTML form's input field value if it empty](https://stackoverflow.com/questions/8029532/how-to-prevent-submitting-the-html-forms-input-field-value-if-it-empty) — Francesco Frassinelli, Sep 23 '20 at 13:43

score 10 · Answer 1 · answered Sep 11 '14 at 15:06

10

you can disable empty fields so they don't get added as data

$('form').submit(function(e){
    var emptyinputs = $(this).find('input').filter(function(){
        return !$.trim(this.value).length;  // get all empty fields
    }).prop('disabled',true);    
});

answered Sep 11 '14 at 15:06

wirey00

33,517
7
54
65

2

This is the only answer so far that truly answers the OP's question, which was how to not set the empty values in the first place. I had the same problem, where I didn't want the URL to get polluted with optional fields from a search form. This worked like a charm! – CragMonkey Dec 22 '14 at 18:46

Man Programmer · Answer 2 · 2014-09-11T15:08:57.010

1

in php you can do like this

if(!isset($_GET['order_by']) || !$_GET['order_by'])
    return 'error msg';

or

if(empty($_GET['order_by']))
    return 'error msg';

change html like this

   <form action="index.php" method="get" onsubmit="return valid()">
  <input type="hidden" name="id" value="1">
  <input type="hidden" name="order_by" id="order_by" value="">
  <button type="submit">Submit</button>
  </form>

javascript:

  function valid(){
   if(!$('#order_by').val()){
       alert("Order by not found");
       return false;
    }
   return true;
 }

edited Sep 11 '14 at 15:08

answered Sep 11 '14 at 14:49

Man Programmer

5,300
2
21
21

I need to avoid initialization of $_GET['order_by'] if it's empty in form, not it's validation at php level. – femalemoustache Sep 11 '14 at 15:04

score 0 · Answer 3 · answered Mar 08 '16 at 20:32

$('form#formID').submit(function(e){
     var emptyinputs = $(this).find('select').filter(function(){
     return !$.trim(this.value).length;  
    }).prop('disabled',true);    

     var emptyinputs = $(this).find('input').filter(function(){
     return !$.trim(this.value).length;  
    }).prop('disabled',true);    
});

You can disable empty fields (both select and input) so they don't get added as data, and for a custom form id.

How not to send empty input value in GET-query

3 Answers3