Reputation: 5121
I am using Django to enter some data into my database. After entering the data I want to edit it. Now, what I am trying is, the user should not go to any other page to change the data. So I have implemented a javascript method which edits the text on the front end.
How do I reflect the changes made by the user in the database?
The related code is given below:
<html>
{% csrf_token %}
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js">
</script>
<table id="table">
<tr>
<th>Name</th>
<th>Phone Number</th>
</tr>
{% for record in queryset %}
<tr>
<td onClick="clickable(this)"> {{record.first}} </td>
<td onClick="clickable(this)"> {{record.second}}</td>
</tr>
{%endfor%}
</table>
<script>
function clickable(ele)
{
var value = prompt("Enter the details");
if(value)
{
ele.id='edited'
ele.innerHTML = value;
//I want to send the request to my django view to edit the database here
//The data has been updated.
}
Upvotes: 0
Views: 1526
Reputation: 9828
You should send a Ajax request to your server using jQuery you are using. with Ajax request request you should send your updated data .
Simple Ajax request can be .
$('#click_place').click(function() { // when click is placed
$.ajax({ // create an AJAX call...
data: $(this).serialize(), // get the content here Ex. {'name': 'test', 'phone': '123'}
type: $(this).attr('method'), // GET or POST
url: $(this).attr('action'), // request url
success: function(response) { // on success..
// display your message
}
});
return false;
});
You can follow How to POST a django form with AJAX & jQuery .
http://coreymaynard.com/blog/performing-ajax-post-requests-in-django/ .
Edit : You can simply call below function at any event .
function myajaxhit() {
$.ajax({ // create an AJAX call...
data: $(this).serialize(), // get the content here Ex. {'name': 'test', 'phone': '123'}
type: $(this).attr('method'), // GET or POST
url: $(this).attr('action'), // request url
success: function(response) { // on success..
// display your message
}
});
}
just call myajaxhit() at any place . Please change it as per your requirement .
Upvotes: 1