NIHVIVO-646 Autocomplete, remove author functionality

This commit is contained in:
rjy7 2010-06-29 16:15:51 +00:00
parent 6016d451a1
commit 37a85a5e97
3 changed files with 62 additions and 13 deletions

View file

@ -291,13 +291,17 @@ SPARQL queries for existing values. --%>
// Doesn't seem to need urlencoding to add as id attribute value // Doesn't seem to need urlencoding to add as id attribute value
//request.setAttribute("authorUri", URLEncoder.encode(author.getURI(), "UTF-8")); //request.setAttribute("authorUri", URLEncoder.encode(author.getURI(), "UTF-8"));
request.setAttribute("authorUri", author.getURI()); request.setAttribute("authorUri", author.getURI());
request.setAttribute("authorshipUri", authorship.getURI());
%> %>
<c:url var="authorHref" value="/individual"> <c:url var="authorHref" value="/individual">
<c:param name="uri" value="${authorUri}"/> <c:param name="uri" value="${authorUri}"/>
</c:url> </c:url>
<li> <c:url var="deleteAuthorshipHref" value="/edit/primitiveRdfDelete" />
<a id="${authorUri}" href="${authorHref}" class="existingAuthor">${author.name}</a> <c:url var="undoHref" value="/edit/addAuthorToInformationResource" />
<a href="" class="remove">Remove</a> <li class="author" id="${authorUri}">
<span class="authorName"><a href="${authorHref}" class="existingAuthor">${author.name}</a></span>
<a href="${deleteAuthorshipHref}" id="${authorshipUri}" class="remove">Remove</a>
<a href="${undoHref}" class="undo">Undo</a>
</li> </li>
<% <%

View file

@ -9,6 +9,7 @@
margin-bottom: .75em; margin-bottom: .75em;
} }
#authors a.existingAuthor { #authors a.existingAuthor {
display: inline-block; display: inline-block;
width: 15em; width: 15em;
@ -22,6 +23,7 @@
/* Hide elements not used in non-JS version of form */ /* Hide elements not used in non-JS version of form */
#showAddForm, #showAddForm,
a.remove, a.remove,
a.undo,
#selectedAuthor { #selectedAuthor {
display: none; display: none;
} }
@ -40,6 +42,7 @@ form h3 {
form a:link.cancel, form a:visited.cancel, form a:link.cancel, form a:visited.cancel,
#authors a:link.remove, #authors a:visited.remove, #authors a:link.remove, #authors a:visited.remove,
#authors a:link.undo, #authors a:visited.undo,
#showAddForm a:link.cancel, #showAddForm a:visited.cancel { #showAddForm a:link.cancel, #showAddForm a:visited.cancel {
color: #f70; color: #f70;
border-color: #f70; border-color: #f70;
@ -47,11 +50,16 @@ form a:link.cancel, form a:visited.cancel,
form a:hover.cancel, form a:hover.cancel,
#authors a:hover.remove, #authors a:hover.remove,
#authors a:hover.undo,
#showAddForm a:hover.cancel { #showAddForm a:hover.cancel {
color: #fff; color: #fff;
background: #f70; background: #f70;
} }
#authors a.undo {
margin-left: 1em;
}
#content form p.inline { #content form p.inline {
clear: left; clear: left;
margin-bottom: 0; margin-bottom: 0;

View file

@ -21,7 +21,8 @@ var addAuthorForm = {
this.form = $('#addAuthorForm'); this.form = $('#addAuthorForm');
this.showFormButtonWrapper = $('#showAddForm'); this.showFormButtonWrapper = $('#showAddForm');
this.showFormButton = $('#showAddFormButton'); this.showFormButton = $('#showAddFormButton');
this.removeLinks = $('a.remove'); this.removeAuthorshipLinks = $('a.remove');
this.undoLinks = $('a.undo');
this.submit = this.form.find(':submit'); this.submit = this.form.find(':submit');
this.cancel = this.form.find('.cancel'); this.cancel = this.form.find('.cancel');
this.labelField = $('#label'); this.labelField = $('#label');
@ -42,7 +43,9 @@ var addAuthorForm = {
// Show elements hidden by CSS for the non-JavaScript-enabled version. // Show elements hidden by CSS for the non-JavaScript-enabled version.
// NB The non-JavaScript version of this form is currently not functional. // NB The non-JavaScript version of this form is currently not functional.
this.removeLinks.show(); this.removeAuthorshipLinks.show();
this.undoLinks.hide();
this.bindEventListeners(); this.bindEventListeners();
@ -82,7 +85,8 @@ var addAuthorForm = {
addAuthorForm.hideFieldsForNewPerson(); addAuthorForm.hideFieldsForNewPerson();
}); });
// Prevent form submission when hitting enter in last name field // When hitting enter in last name field, if not an autocomplete
// selection, show first and middle name fields.
this.lastNameField.keydown(function(event) { this.lastNameField.keydown(function(event) {
if (event.keyCode === 13) { if (event.keyCode === 13) {
console.log('in keydown') console.log('in keydown')
@ -90,15 +94,46 @@ var addAuthorForm = {
return false; return false;
} }
}); });
this.removeAuthorshipLinks.click(function() {
$.ajax({
url: $(this).attr('href'),
type: 'POST',
data: {
deletion: $(this).attr('id')
},
dataType: 'json',
context: $(this), // context for callback
complete: function(request, status) {
var author = $(this).siblings('span.authorName');
var authorLink = author.children('a.existingAuthor');
var authorName = authorLink.html();
if (status === 'success') {
$(this).hide();
$(this).siblings('.undo').show();
author.html(authorName + ' has been removed');
author.css('width', 'auto');
author.effect("highlight", {}, 3000);
} else {
alert('Error processing request');
}
}
});
return false;
});
this.undoLinks.click(function() {
$.ajax({
url: $(this).attr('href')
});
return false;
});
}, },
onLastNameChange: function() { onLastNameChange: function() {
this.showFieldsForNewPerson(); this.showFieldsForNewPerson();
this.firstNameField.focus(); this.firstNameField.focus();
// This is persisting and showing old results in some cases unless we
// explicitly wipe it out.
$('ul.ui-autocomplete li').remove();
$('ul.ui-autocomplete').hide();
}, },
showFieldsForNewPerson: function() { showFieldsForNewPerson: function() {
@ -193,6 +228,8 @@ var addAuthorForm = {
addAuthorForm.initFormView(); addAuthorForm.initFormView();
return false; return false;
}); });
return false;
}, },
hideSelectedAuthor: function() { hideSelectedAuthor: function() {
@ -248,7 +285,7 @@ var addAuthorForm = {
getExistingAuthorUris: function() { getExistingAuthorUris: function() {
var existingAuthors = $('#authors .existingAuthor'); var existingAuthors = $('#authors li');
return existingAuthors.map(function() { return existingAuthors.map(function() {
return $(this).attr('id'); return $(this).attr('id');
}); });