What is the best way to get the fields from a HTML form, and send them to a Servlet using JQuery/Javascript?

Question

Using jQuery I've found solutions such as this:

$("#submit").click(function () {
    alert($('form1').serialize());
    $.post("submitForm", $("form1").serialize(), function (result) {
        if (result == "success") {
            alert("Record added!");
        } else {
            alert("Could not add Record!");
        }
    });
});

Here is the Full HTML of the method I had described above, Im trying to find the best way to get the data from the the HTML form and send it to the servlet "submitForm".

<html>
 <head>
<title>myForm</title>
<script src="//ajax.googleapis.com/ajax/libs/jquery/2.0.0/jquery.min.js"></script>
<script type="text/javascript">

    $("#submit").click(function () {
    alert($('form1').serialize());
    $.post("submitForm", $("wmform_174835").serialize(), function (result) {
        if (result == "success") {
            alert("Record added!");
        } else {
            alert("Could not add Record!");
        }
    });
});

</script>
</head>
<body>
<a href="submitForm">MyForm</a>
<form action="submitForm" method="POST" id="form1">
    <input type="text" value="12" name="ID"/>
    <input type="text" value="NameThatComesFirst" name="FirstName"/>
    <input type="text" value="NameThatComesLast" name="LastName"/>
    <input type=submit id="submit" value="submit"/>
</form>
</body>
</html>

Are you sure you're using the right selectors? `form1` isn't a normal tag name — Ian, May 08 '13 at 15:55
I'm unclear on the question; is there something *wrong* with that way? "Best" in terms of what? — Dave Newton, May 08 '13 at 15:57
@MohammadAdil Form1 wmform_174835 are supposed to be the same, they are both the HTML form. — imsofnbamf, May 08 '13 at 15:58
@user2358627 You still didn't answer the question. Is "form1" the form's `id` or `name` or `class` or what? You should look at http://api.jquery.com/category/selectors/ — Ian, May 08 '13 at 15:59
In [CSS selector](http://www.w3.org/TR/CSS2/selector.html) syntax, an ID is represented with `#` prefix. Your concrete problem has nothing to do with Java/Servlets. You'd have had exactly the same problem when using a different backend such as PHP/ASP/etc. — BalusC, May 08 '13 at 16:03

score 1 · Accepted Answer · answered May 08 '13 at 16:03

Try this -

   $(document).ready(function(){
     $("#submit").click(function () 
       var data = $('#form1').serialize();
       alert(data);
       $.post("submitForm", data, function (result) {
            if (result == "success") {
              alert("Record added!");
            } else {
                alert("Could not add Record!");
            }
       });
    });
   });

What is the best way to get the fields from a HTML form, and send them to a Servlet using JQuery/Javascript?

1 Answers1