JSFiddle - React, Tailwind, and code Playground
HTML
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.3/jquery.min.js"></script>
<form id="myForm">
Note:
<br>
<textarea rows="4" cols="50" name="note" form="form">
</textarea>
<br/>
<input type="date" name="day" form="form">
<input type="submit" id="create" value="Submit" form="form">
</form>
JavaScript
$(document).ready(function() {
$("#create").click(function(event) {
event.preventDefault();
var values = {};
$.each($('#myForm input').serializeArray(), function(i, field) {
values[field.name] = field.value;
});
$.ajax({
type: "POST",
url: "/home/new",
data: values,
success: function(data, textStatus, jqXhr) {
//call "home/new" with data from html form as json and update current view with returned data
console.log("success");
},
error: function() {
alert("error");
}
});
});
});