Search jQuery

jQuery Forum

in Using jQuery • 3 years ago

Hello, everyone! I'm currently experiencing a problem where I don't know how to send text data via post and files.

Here is my code:

$(".form").submit(function(e) {
e.preventDefault(); // avoid to execute the actual submit of the form.
var url = $(this).attr("action"); // the script where you handle the form input.
$.ajax({
type: "POST",
url: url,
data: $("#form").serialize(), // serializes the form's elements.
success: function(data)
{
// var obj = jQuery.parseJSON( data );
alert(data); // show response from the php script.
}
});
});

And, here my HTML code:

<form class="form" id="form" action="http://localhost:8888/api/addPost.php" method="POST">
<div class="list">
<label class="item item-input">
<input type="text" placeholder="Title" class="AddPosttitle" name="title">
</label>
<label class="item item-input">
<input class="description" type="text" placeholder="Simple Description (max 60 caracters)" maxlength="60" name="description">
</label>
<label class="item item-input">
<div>
<span id='button_upload'>Image : </span>
<input type='file' class="img" name="img">
</div>
</label>
<label class="item item-input">
<textarea placeholder="Full description" class="full" name="full"></textarea>
</label>
<div class="padding">
<button class="button button-block button-positive submit-btn" type="submit">
Submit
</button>
</div>
</div>
</form>

Basicaly, it returns me the text, but not the file, and I don't want to do 2 ajax requests