jquery serialize returns an empty string

Question

I got a problem when using the serialize() jQuery function:

<form role="form" id="enter-image-detail-form" method="post">
  <div class="form-group">
    <input type="text" class="form-control" id="image-name" placeholder="Enter image name" value="test">
  </div>
  <button type="submit" class="btn btn-default btn-success btn-block">Save</button>
</form>

$('body').on('submit', '#enter-image-detail-form', function(e){
  console.log( $(this).serialize() );
  e.preventDefault();
});

It returns an empty string. Thanks in advance.

@T.J.Crowder you're right, my bad.

Rory McCrossan
– Rory McCrossan

2017-02-23 15:53:29 +00:00
Commented Feb 23, 2017 at 15:53 — Rory McCrossan
– Rory McCrossan, Commented Feb 23, 2017 at 15:53

Pranav C Balan · Accepted Answer · 2017-02-23 14:25:23Z

6

You need to add name attribute for form elements since serialize() method generates form elements which has name attribute.

<input name="image-name" type="text" class="form-control" id="image-name" placeholder="Enter image name" value="test">
<!--   ^^^^^^^^^^^^^^^^^                                                  --->

From docs :

For a form element's value to be included in the serialized string, the element must have a name attribute.

answered Feb 23, 2017 at 14:25

Pranav C Balan

115k25 gold badges172 silver badges195 bronze badges

Sign up to request clarification or add additional context in comments.

1 Comment

cjatstackoverflow Over a year ago

Thanks for the help!

Collectives™ on Stack Overflow

jquery serialize returns an empty string

1 Answer 1

1 Comment

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

1 Comment

Your Answer

Sign up or log in

Post as a guest

Related