Lets Code
Lets Code

Reputation: 773

How to pass textfield data from html to servlet without using forms

I am making an online shopping website. I want to provide an option to user that he/she can select different shipping address :-

Shipping Details

         <input type="button" value="Same as billing address"   style="color: #FFFFFF;" class="link-style" onclick="test();"  />
             <table cellpadding="20">
                    <tr>
                        <td >Name : * </td>
                        <td><input type="text" id="name" name="name" /></td>

                    </tr>
                     <tr>
                        <td>Contact Number : </td>
                        <td><input type="text" name="cno" id="cno"  /></td>
                    </tr>
                    <tr>
                        <td>Address : * </td>
                        <td><input type="text" name="address "id="address" /></td>
                    </tr>

                    <tr>
                        <td>City : *</td>
                        <td><input type="text" name="city" id="city"  /></td>
                    </tr>
                    <tr>
                        <td>State : * </td>
                        <td><input type="text" name="state" id="state" /></td>
                    </tr>
                    <tr>
                        <td>Country : *</td>
                        <td><input type="text" name="country" id="country" /></td>
                    </tr>


                </table>                

if user clicks on button then all fields are disabled. Otherwise he/she can fill diffrent shipping address. Problem is i don't want to use forms here. How to pass these parameters to a jsp or servlet in session or post? I already tried AJAX but i am unable to work with it properly

function setValue() {
    alert("hi");
    var name = document.getElementById("name").value;
    var cno = document.getElementById("cno").value;
    var address = document.getElementById("address").value;
    var city = document.getElementById("city").value;
    var state = document.getElementById("state").value;
    var country = document.getElementById("country").value;
    var xmlhttp = new XMLHttpRequest();

    xmlhttp.open("post", "test.jsp", true);
    xmlhttp.setRequestHeader("Content-type", "application/x-www-form-      urlencoded");
    xmlhttp.send("name=" + name);
    xmlhttp.send("cno=" + cno);
    xmlhttp.send("address=" + address);
    xmlhttp.send("city=" + city);
    xmlhttp.send("state=" + state);
    xmlhttp.send("country=" + country);



}

Test.jsp is not getting the parameters.

Upvotes: 1

Views: 1084

Answers (2)

Mr.G
Mr.G

Reputation: 3559

try like this:

var inputParam='{"name":"'+name+'","cno":"'+cno+'","address":"'+address+'","city":"'+city+'","state":"'+state+'","country":"'+country+'"}';

$.ajax({
        type: "POST",
        url: your base_url,
        data: {inputParam:inputParam,module :'your module name'},
        dataType: "json",
        async:false,
        success: function(msg)
        {
             console.log(msg);
        }
    });

Upvotes: 0

Kevin Bowersox
Kevin Bowersox

Reputation: 94469

You must only call xmlhttp.send once, which requires you to concatenate the request parameters.

 xmlhttp.send("name="+name+"&cno="+cno+"&address="+address+"&city="+city+"&state=" + state + "&country="+country);

Upvotes: 1

Related Questions