Submit Only Non Empty Fields From Form

Question

That is the form:

Solution 1:

Try this,

Include jQuery and use following snippet.

$(document).ready(function(){
    $("form").submit(function(){
        $("input").each(function(index, obj){
            if($(obj).val() == "") {
                $(obj).remove();
            }
        });
    });
});

Solution 2:

Something like this would be the plain javascript version:

<formid="theform"action=""method="GET"onsubmit="return removeEmpties()"><inputtype="text"name="para1"/><inputtype="text"name="para2"/><inputtype="submit"value="search"/></form><script>functionremoveEmpties() {
        var form = document.getElementById("theform");
        var inputs = form.children;
        var remove = [];
        for(var i = 0; i < inputs.length; i++) {
            if(inputs[i].value == "") {
                remove.push(inputs[i]);
            }
        }

        if(remove.length == inputs.length - 1)
          returnfalse;

        for(var i = 0; i < remove.length; i++) 
          form.removeChild(remove[i]);
        returntrue;
    }
</script>

Solution 3:

put onclick on submit button to call submitFunc() , rather than use form action:

<inputtype="button" onClick="submitFunc();" value="Pass Parameters"/>

js functions:

<scriptlanguage="javascript"type="text/javascript">functionsubmitFunc()
{
   loopRemove("text",3);
   document.testform.action = "file:///C:/Users/mwafi/Desktop/test.html";
   document.testform.submit();
}

functionloopRemove(startName,count)
{
  for(var i=1;i<=count;i++)
  {
    if(document.getElementById(startName+i).value=="")
    {
        var t = document.getElementById(startName+i);
        t.parentNode.removeChild(t);
    }
  }  
}

</script>

full code with HTML form:

<html><title>Pass non-empty parameters</title><head><scriptlanguage="javascript"type="text/javascript">functionsubmitFunc()
{
   loopRemove("text",3);
   document.testform.action = "http://www.google.com/";
   document.testform.submit();
}

functionloopRemove(startName,count)
{
  for(var i=1;i<=count;i++)
  {
    if(document.getElementById(startName+i).value=="")
    {
        var t = document.getElementById(startName+i);
        t.parentNode.removeChild(t);
    }
  }  
}

</script></head><bodyonload="document.testform.reset();"><formname="testform"><h3>Pass Non-empty parameters</h3>

  Parameter 1 : <inputtype="text"name="text1"id="text1" /><br>
  Parameter 2 : <inputtype="text"name="text2"id="text2" /><br>
  Parameter 3 : <inputtype="text"name="text3"id="text3" /><br><br><inputtype="button"onClick="submitFunc();"value="Pass Parameters"/><form></body></html>

remember don't use form action.

source: http://www.scriptsplash.com/2009/07/passing-only-non-empty-fields-on-form.html

JavaScript Test

Submit Only Non Empty Fields From Form

Solution 1:

Solution 2:

Solution 3:

Post a Comment for "Submit Only Non Empty Fields From Form"