Make alias form a bit more HTML friendly

This commit is contained in:
Alexandre Iooss 2020-08-23 00:33:36 +02:00
parent 342d3910c7
commit 0ba77fb8f0
3 changed files with 55 additions and 49 deletions

View File

@ -1,37 +1,43 @@
/**
* On form submit, create a new alias
*/
function create_alias (e) {
// Do not submit HTML form
e.preventDefault();
$("#alias_input").on('keypress',function(e) {
if(e.which == 13) {
$("#alias_submit").click();
}
});
function create_alias(note_id){
$.post("/api/note/alias/",
{
"csrfmiddlewaretoken": CSRF_TOKEN,
"name": $("#alias_input").val(),
"note": note_id
}
).done(function(){
$("#alias_table").load(location.pathname+ " #alias_table");
addMsg("Alias ajouté","success");
})
.fail(function(xhr, textStatus, error){
errMsg(xhr.responseJSON);
});
// Get data and send to API
const formData = new FormData(e.target);
$.post("/api/note/alias/", {
"csrfmiddlewaretoken": formData.get("csrfmiddlewaretoken"),
"name": formData.get("name"),
"note": formData.get("note")
}).done(function () {
// Reload table
$("#alias_table").load(location.pathname + " #alias_table");
addMsg("Alias ajouté", "success");
}).fail(function (xhr, _textStatus, _error) {
errMsg(xhr.responseJSON);
});
}
// on click of button "delete" , call the API
function delete_button(button_id){
$.ajax({
url:"/api/note/alias/"+button_id+"/",
method:"DELETE",
headers: {"X-CSRFTOKEN": CSRF_TOKEN}
})
.done(function(){
addMsg('Alias supprimé','success');
$("#alias_table").load(location.pathname + " #alias_table");
})
.fail(function(xhr,textStatus, error){
errMsg(xhr.responseJSON);
});
}
/**
* On click of "delete", delete the alias
* @param Integer button_id Alias id to remove
*/
function delete_button (button_id) {
$.ajax({
url: "/api/note/alias/" + button_id + "/",
method: "DELETE",
headers: { "X-CSRFTOKEN": CSRF_TOKEN }
}).done(function () {
addMsg('Alias supprimé', 'success');
$("#alias_table").load(location.pathname + " #alias_table");
}).fail(function (xhr, _textStatus, _error) {
errMsg(xhr.responseJSON);
});
}
$(document).ready(function () {
// Attach event
document.getElementById("form_alias").addEventListener("submit", create_alias);
})

View File

@ -6,15 +6,15 @@
<h3 class="card-header text-center">
{% trans "Note aliases" %}
</h3>
<div class="card-body text-center">
<div class="input-group">
<input id="alias_input" type="text" class="form-control">
<div class="card-body">
<form class="input-group" method="POST" id="form_alias">
{% csrf_token %}
<input type="hidden" name="note" value="{{ object.note.pk }}">
<input type="text" name="name" class="form-control">
<div class="input-group-append">
<button id="alias_submit" class="btn btn-success" onclick="create_alias({{ object.note.pk }})">
{% trans "Add" %}
</button>
<input type="submit" class="btn btn-success" value="{% trans "Add" %}">
</div>
</div>
</form>
</div>
{% render_table aliases %}
</div>

View File

@ -6,15 +6,15 @@
<h3 class="card-header text-center">
{% trans "Note aliases" %}
</h3>
<div class="card-body text-center">
<div class="input-group">
<input id="alias_input" type="text" class="form-control">
<div class="card-body">
<form class="input-group" method="POST" id="form_alias">
{% csrf_token %}
<input type="hidden" name="note" value="{{ object.note.pk }}">
<input type="text" name="name" class="form-control">
<div class="input-group-append">
<button id="alias_submit" class="btn btn-success" onclick="create_alias({{ object.note.pk }})">
{% trans "Add" %}
</button>
<input type="submit" class="btn btn-success" value="{% trans "Add" %}">
</div>
</div>
</form>
</div>
{% render_table aliases %}
</div>