0

I am using a textarea tag to capture multi-line input in a HTML form but it is never captured with data from the other input fields! Why is this?

<form id="contact_form" method="POST">
<!-- form-item -->
    <div class="form-item form-item--half">
        <label class="form__label">email<span>*</span>
        </label>
        <input class="form-control" type="email" name="input" required placeholder=""/>
    </div><!-- End / form-item -->


    <!-- form-item -->
    <div class="form-item form-item--half">
        <label class="form__label">name<span>*</span>
        </label>
        <input class="form-control" type="text" name="input" required placeholder=""/>
    </div><!-- End / form-item -->


    <!-- form-item -->
    <div class="form-item">
        <label class="form__label">message<span>*</span>
        </label>
        <textarea class="form-control" required placeholder=""></textarea>
    </div><!-- End / form-item -->


    <!-- form-item -->
    <div class="form-item">
        <input class="md-btn btn-custom" type="submit" id="send_message_btn" value="Send message" >
        </input>
        <span id="success_message" style="margin-left: 25px; color: #4BB543; display: none;">&#x2713; Thanks for the email, we will be in touch promptly.</span>

    </div><!-- End / form-item -->      
</form>

I capture the content via a javascript function:

var message = "";
$("#send_message_btn").on("click", function() {
    message = $("#contact_form").serialize();
}

However the message field is never captured in the serialized message. Any help?

A_Matar
  • 2,210
  • 3
  • 31
  • 53

2 Answers2

2

The reason why is not being stored is because your textarea doesn't have a name attribute it should be like this

<textarea class="form-control" required placeholder="" name="message"></textarea>
ddiestra
  • 151
  • 1
  • 6
2

I don't see any name attribute set for the text area , also make sure your name attribute has different value for different fields.

KrishnaSingh
  • 696
  • 1
  • 7
  • 12