javascript - When I use input type=button the value of it is not sent to the server - Stack Overflow

In a form I have a button as input/submit. When I submit the value of the button is send.
if I change to input/button instead and do the submit via JQuery i.e. $("form").submit() the form is submitted but the value of the button is not send. Why? How could I fix this?

<form name="myform" id="myform" action="http://localhost/mypage.html" method="POST" >    
<input type="button" id="btn" value="Actual value" name="save" >  
</form>   


$(document).ready(function() {   
 $("#btn").click( function() {   
     $("myform").submit();  
  }
}  

In a form I have a button as input/submit. When I submit the value of the button is send.
if I change to input/button instead and do the submit via JQuery i.e. $("form").submit() the form is submitted but the value of the button is not send. Why? How could I fix this?

<form name="myform" id="myform" action="http://localhost/mypage.html" method="POST" >    
<input type="button" id="btn" value="Actual value" name="save" >  
</form>   


$(document).ready(function() {   
 $("#btn").click( function() {   
     $("myform").submit();  
  }
}  

• javascript
• jquery
• html
• forms

Share Improve this question Follow edited Nov 14, 2023 at 20:35 isherwood 61.2k1616 gold badges122122 silver badges170170 bronze badges asked Aug 28, 2013 at 16:19 JimJim 19.6k4141 gold badges146146 silver badges266266 bronze badges 3

• 2 Because you are not submitting the form with the button click. – epascarello Commented Aug 28, 2013 at 16:20
• It should be a submit button to post the value of submit also – Manu M Commented Aug 28, 2013 at 16:22
• What would be wrong with the <input type="submit"> button? Please explain the reason why you want to use jQuery for submitting. – Bergi Commented Aug 28, 2013 at 16:52

Add a ment  | 

5 Answers 5

Sorted by: Reset to default 4

Buttons are not the same as inputs--that's why the button doesn't add to the form submission. You could add an input of type hidden with the value you want next to the button.

Otherwise you would have to use JavaScript to grab the button after the form has been submitted to get its value.

try with this code

$(document).ready(function() {   
 $("#btn").click( function() {   
     $("myform").submit();  
  });
});

You can use input="submit" button with preventDefault(); function if you want to conditionally check the form submission

$("#btn").click(function(event){        

        if(truePart){   
            $(this).unbind('click').click();        

        }else{
             event.preventDefault();
             alert("Please fill the required fields");              
        }
    });  

Try name="Actual Value" , then try accessing the value on server using POST['name'] , it will let you to have your actual value.

It looks like your javascript is syntactically incorrect.

Your code

$(document).ready(function() {   
    $("#btn").click( function() {   
        $("myform").submit();  
    }
} 

should look like this

$(document).ready(function() {   
    $("#btn").click(function() {   
        $("myform").submit();  
    });
});

You're missing two closing parentheses and two semicolons.

If that doesn't help, try this for your button:

<input type="submit" name="save" value="Actual Value" />

Make sure your server-side code is prepared to accept a save parameter, as well. Can't send code to something that doesn't want to receive it!