Geek asks and answers

Access form elements using jquery and DOM

Here is the form

<form method="post">

    <input type="hidden" name="resulttype" value="Create">              
    <table>
        <tr>
            <td>Name</td>           
            <td><input type="text" id="name" value="Abhishek"/></td>
        </tr>
        <tr>
            <td>User Name</td>
            <td><input type="text" id="username" name="username" value="AbhishekSimion"></td>
        </tr>
        <tr>
            <td>Email</td>
            <td><input type="text" id="email" name="email" value="a@a.com"></td>
        </tr>
        <tr>
            <td>Department</td>
            <td><input type="text" id="department" name="department"></td>
        </tr>
        <tr><td colspan="2"><input type="button" id="button" value="Done!"></td></tr>
    </table>
</form>

here is the javascript part

var x = document.getElementById("name");
var email = $("input#email").val();  

var dataString = 'name='+ x + '&email=' + email;
$(function() {
$("#button").click(function() {
    callme();
    });
  });
function callme()
{
    alert(dataString);
    var msg = $.ajax({
        type: "POST",
        url: "/temp/AjaxPostSend",
        data: dataString,
        async: false,
        success: function(html){
          alert( "Data Saved: " + msg );
        }
     }).responseText;

}

Why am I getting the message " name = null & email = undefined " in my warning window? What is wrong here?

Note. I am using jQuery v1.5.2

0
source share
6 answers

At least the value emailshould work ...

In any case, do not create the string manually. Set the dataobject containing the values:

data: {name: $('#name').val(), email: $('#email').val()},
// or
data: $('#yourformID').serialize(),

In this way, jQuery will take care of proper escaping.

Also note that identifiers must be unique. If you have other elements with the same identifiers beyond the page, this will not work. Then changes the identifiers.

Update:

. :

var x = document.getElementById("name");
var email = $("input#email").val();  

var dataString = 'name='+ x + '&email=' + email;

. , (), , (), , - .

:

$(function() {
    $("#button").click(callme);

    function callme() {      
        $.ajax({
            type: "POST",
            url: "/temp/AjaxPostSend",
            data: {name: $('#name').val(), email: $('#email').val()},
            success: function(msg){
                alert( "Data Saved: " + msg );
            }
         });
    }

});

,

var msg = $.ajax({...}).responseText;

, Ajax . , callme() , Ajax. success.

: async: false, , , ;) . Ajax ( Sjax), .

+3

var myname = $('#name').val()
var mymail = $('#email').val();

DEMO

,

: {name: myname, email: mymail}

var msg = $.ajax({
        type: "POST",      
        url: "/temp/AjaxPostSend",
        data: { name: myname, email: mymail }
        async: false,
        success: function(html){
          alert( "Data Saved: " + msg );
        }
     }).responseText;

<input type="text" id="myname" name="myname" value="Abhishek"/>,  var myname = $('#myname').val()

POST

 data: $('#yourformID').serialize(),
+1

JavaScript, value.

var x = document.getElementById("name").value;

, , , .

var email = $("#email").val();

, ajax. . data: ...

var msg = $.ajax({
        type: "POST",
        url: "/temp/AjaxPostSend",
        data: $("form").serialize(),
        async: false,
        success: function(html){
          alert( "Data Saved: " + msg );
        }
     }).responseText;
+1

var x = document.getElementById("name");
var email = $("input#email").val();  


var x = $("#name");
var email = $("#email").val();

, :

var x = $("#name");
var email = $("#email").val();  
var dataString = 'name='+ x + '&email=' + email;

must be done before calling callme () as follows:

var dataString;
$(function() {
$("#button").click(function() {
    var x = $("#name");
    var email = $("#email").val();  
    dataString = 'name='+ x + '&email=' + email;
    callme();
    });
  });
0
source

Because the,

the value in 'x' is an object, not a string, and I think the syntax "$ (" input # email ") is incorrect. Try $(":input[id='email']").val()

0
source

Not sure why email gives you an undefined value, but for a name it should look like this:

var x = document.getElementById("name").value;

OR

var x = $('#name').val();
0
source

More articles:


All Articles