var peopleFormId = 'people-form'; var peopleListId = 'people-list'; var peopleFormQuery = '#' + peopleFormId; var peopleListQuery = '#' + peopleListId; function insertPeopleList(parent) { parent.append( '\ \ \ \ \ \ \
NombreApellido
' ); } function insertPeopleForm(parent) { parent.append( '
\ \ \ \ \ \
' ); } function createPersonRow(person) { return '\ ' + person.name + '\ ' + person.surname + '\ \ Edit\ \ \ Delete\ \ '; } function formToPerson() { var form = $(peopleFormQuery); return { 'id': form.find('input[name="id"]').val(), 'name': form.find('input[name="name"]').val(), 'surname': form.find('input[name="surname"]').val() }; } function rowToPerson(id) { var row = $('#person-' + id); return { 'id': id, 'name': row.find('td.name').text(), 'surname': row.find('td.surname').text() }; } function personToForm(person) { var form = $(peopleFormQuery); form.find('input[name="id"]').val(person.id); form.find('input[name="name"]').val(person.name); form.find('input[name="surname"]').val(person.surname); } function isEditing() { return $(peopleFormQuery + ' input[name="id"]').val() != ""; } function disableForm() { $(peopleFormQuery + ' input').prop('disabled', true); } function enableForm() { $(peopleFormQuery + ' input').prop('disabled', false); } function showErrorMessage(jqxhr, textStatus, error) { alert(textStatus + ": " + error); } function resetForm() { $(peopleFormQuery)[0].reset(); $(peopleFormQuery + ' input[name="id"]').val(''); $('#btnSubmit').val('Crear'); } function addRowListeners(person) { $('#person-' + person.id + ' a.edit').click(function() { personToForm(rowToPerson(person.id)); $('input#btnSubmit').val('Modificar'); }); $('#person-' + person.id + ' a.delete').click(function() { if (confirm('Está a punto de eliminar a una persona. ¿Está seguro de que desea continuar?')) { deletePerson(person.id, function() { $('tr#person-' + person.id).remove(); }, showErrorMessage ); } }); } function appendToTable(person) { $(peopleListQuery + ' > tbody:last') .append(createPersonRow(person)); addRowListeners(person); } function initPeople() { $.getScript('js/dao/people.js', function() { listPeople(function(people) { $.each(people, function(key, person) { appendToTable(person); }); }); $(peopleFormQuery).submit(function(event) { var person = formToPerson(); if (isEditing()) { modifyPerson(person, function(person) { $('#person-' + person.id + ' td.name').text(person.name); $('#person-' + person.id + ' td.surname').text(person.surname); resetForm(); }, showErrorMessage, enableForm ); } else { addPerson(person, function(person) { appendToTable(person); resetForm(); }, showErrorMessage, enableForm ); } return false; }); $('#btnClear').click(resetForm); }); };