I am stuck on trying to fetch data using AjAX. Below is the code for a HTML form that has an input value. The data value gets pushed to a python handler via a submit button. On the server side, the python handler stores the data in the database.
Now I need to fetch the data from the database first via AJAX and display if there is an existing value. The data consists of a "yes or no" status, so pretty simple. But I don't know how to fetch the data using ajax, and properly set the input value based on data fetched. The question, how would I call a handler via Ajax to return a value?
<html>
<script language="javascript" src="https://code.jquery.com/jquery-1.11.1.min.js" type="text/javascript"></script>
<script language="javascript" type="text/javascript">
send_data = function(status) {
$.ajax({
url: "/Subscription",
dataType: "json",
data: {'status' : status},
type: "POST",
cache: false
}).done(function(data, status, xml) {
var obj = jQuery.parseJSON(data);
alert(obj.success);
}).fail(function(jqXHR, textStatus, errorThrown) {
}).always(function() {
});
}
$(document).ready(function() {
$("#subscription").submit(function() {
send_data($("#switch-1").prop('checked') ? 'yes' : 'no');
return false;
});
});
</script>
</head>
<body>
<form id="subscription" action="" method="post">
<label class="mdl-switch mdl-js-switch mdl-js-ripple-effect" for="switch-1">
<input type="checkbox" id="switch-1" class="mdl-switch__input" id="status" name="status" />
<span class="mdl-switch__label">blemtorp@google.com subscription status is: << subscription >> </span>
<input type="submit" value="Submit" /></label>
</form>
</body>
</html>
Thanks so much. Any hints will be so helpful.
</div>