ajax post data error [object HTMLCollection]

Question

I wrote this script to for a contact form on my website, everything works however instead of storing the data in me database all is get is
[object HTMLCollection] c an anyone tell me what this is? or what is going wrong? i have had a look on google but i cant find much information on it.

<script type="text/javascript">

    //when the button is clicked



    $(document).ready(function() {

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



        $('.small').hide();



              var name = $("input#name").val();

            if (name == "") {

          $("span#name").show();

          return false;

        }



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

            if (name == "") {

          $("span#email").show();

          return false;

        }



              var name = $("input#subject").val();

            if (name == "") {

          $("span#subject").show();

          return false;

        }



             var name = $("textarea#message").val();

            if (name == "") {

          $("span#message").show();

          return false;

        }







        var dataString = 'name='+ name + '&email=' + email + '&subject=' + subject + '&message=' + message;



            $.ajax({

          type: "POST",

          url: "/scripts/send_message.php",

          data: dataString,



          });

    $("#messagearea").load("console/new_message_profile.php?sent=1");

    });

    });

    </script>

You have the same variable names as `name` for all and you are trying to pass variables that aren't initialised in ajax — Namit, Mar 22 '12 at 14:01
Your code is hardly readable. Please consider proper indentation and spacing. — jrummell, Mar 22 '12 at 14:12

score 2 · Accepted Answer · edited May 23 '17 at 12:04

As @Namit mentioned, you use name as a variable everywhere. Building your string, email, subject and message are uninitialised.

They should give you an undefined - but no, due to a weird Internet Explorer behaviour (see Is there a spec that the id of elements should be made global variable?) these variables hold DOM elements. As you seem to have multiple elements with the same id (NEVER DO THAT), here a <span> and an <input>, the variables even seem to hold HTMLCollection objects. Which are casted to the string [object HTMLCollection], when you concat them with other strings.

score 0 · Answer 2 · answered Mar 22 '12 at 14:03

0

You're reusing the variable name for all the other fields as well. You need to change the field name to the respective input id.

var name = $("input#email").val();    // needs to be email 
var name = $("input#subject").val();  // needs to be subject

answered Mar 22 '12 at 14:03

aziz punjani

25,586
9
47
56

ajax post data error [object HTMLCollection]

2 Answers2