litvinovg/vivo
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

NIHVIVO-1024 Implement educational training custom form as a single-step form. Merged two css files.

Browse source
This commit is contained in:
rjy7 2010-09-02 19:54:05 +00:00
parent 4cd669ab0a
commit 4587642a81
7 changed files with 84 additions and 74 deletions
Download patch file Download diff file Expand all files Collapse all files

1
productMods/edit/forms/addGrantRoleToPerson.jsp
View file

@ -269,7 +269,6 @@ PREFIX core: <${vivoCore}>
List<String> customCss = new ArrayList<String>(Arrays.asList(Css.JQUERY_UI.path(),
Css.CUSTOM_FORM.path(),
"/edit/forms/css/autocomplete.css",
"/edit/forms/css/customFormWithAutocomplete.css"
));
request.setAttribute("customCss", customCss);

5
productMods/edit/forms/addRoleToPersonTwoStage.jsp
View file

@ -355,7 +355,6 @@ public static Log log = LogFactory.getLog("edu.cornell.mannlib.vitro.webapp.jsp.
List<String> customCss = new ArrayList<String>(Arrays.asList(Css.JQUERY_UI.path(),
Css.CUSTOM_FORM.path(),
"/edit/forms/css/autocomplete.css",
"/edit/forms/css/customFormWithAutocomplete.css"
));
request.setAttribute("customCss", customCss);
@ -388,6 +387,7 @@ public static Log log = LogFactory.getLog("edu.cornell.mannlib.vitro.webapp.jsp.
<h2>${titleVerb}&nbsp;${roleActivityTypeLabel} entry for <%= subjectName %></h2>
<%-- DO NOT CHANGE IDS, CLASSES, OR HTML STRUCTURE IN THIS FORM WITHOUT UNDERSTANDING THE IMPACT ON THE JAVASCRIPT! --%>
<form id="addRoleForm" action="<c:url value="/edit/processRdfForm2.jsp"/>" >
<p class="inline"><v:input type="select" label="${roleActivityTitleCase} Type ${requiredHint}" name="roleActivityType" disabled="${disabledVal}" id="typeSelector" /></p>
@ -435,7 +435,8 @@ public static Log log = LogFactory.getLog("edu.cornell.mannlib.vitro.webapp.jsp.
var customFormData = {
acUrl: '${acUrl}',
editMode: '${editMode}',
submitButtonTextType: 'compound'
submitButtonTextType: 'compound',
defaultTypeName: 'activity' // used in repair mode, to generate button text and org name field label
};
</script>
<% } %>

21
productMods/edit/forms/css/autocomplete.css
View file

@ -1,21 +0,0 @@
/* $This file is distributed under the terms of the license in /doc/license.txt$ */
.acSelection {
display: none;
}
.acSelectionInfo {
background-color: #d9d9d9;
padding: .5em 1em;
}
/* jQuery UI autocomplete */
ul.ui-autocomplete {
font-size: .95em;
}
li.ui-menu-item a.ui-corner-all {
text-align: left;
padding-left: .25em;
}

30
productMods/edit/forms/css/customFormWithAutocomplete.css
View file

@ -1,5 +1,26 @@
/* $This file is distributed under the terms of the license in /doc/license.txt$ */
.acSelection {
display: none;
margin-top: 2em;
}
.acSelectionInfo {
background-color: #d9d9d9;
padding: .5em 1em;
}
/* jQuery UI autocomplete */
ul.ui-autocomplete {
font-size: .95em;
}
li.ui-menu-item a.ui-corner-all {
text-align: left;
padding-left: .25em;
}
/* Although Javascript hides these on page load, hide here as well to avoid the flash on page load.
This needs to be removed to support a non-JS version of the form. */
.fullViewOnly,
@ -16,11 +37,12 @@
margin-right: 1em;
}
.acSelection {
margin-top: 2em;
}
.verifyMatch {
margin-left: .5em;
}
#content form h4 {
margin-top: 1em;
margin-bottom: .75em;
}

36
productMods/edit/forms/js/customFormWithAutocomplete.js
View file

@ -86,12 +86,15 @@ var customForm = {
this.editMode = 'add'; // edit vs add: default to add
}
if (!this.typeSelector.length || this.editMode == 'edit' || this.editMode == 'repair') {
if (!this.formSteps) { // Don't override formSteps specified in form data
if (!this.typeSelector.length || !this.fullViewOnly.length || this.editMode === 'edit' || this.editMode === 'repair') {
this.formSteps = 1;
// there may also be a 3-step form - look for this.subTypeSelector
} else {
}
else {
this.formSteps = 2;
}
}
this.bindEventListeners();
@ -145,13 +148,19 @@ var customForm = {
this.setButtonText('new');
this.setLabels();
if( this.formSteps > 1 ){ // NB includes this.editMode == 1
if (this.formSteps > 1) { // includes this.editMode == 1
this.cancel.unbind('click');
this.cancel.click(function() {
customForm.clearFormData(); // clear any input and validation errors
customForm.initFormTypeView();
return false;
});
// In one-step forms, if there is a type selection field, but no value is selected,
// hide the acSelector field. The type selection must be made first so that the
// autocomplete type can be determined. If a type selection has been made,
// unhide the acSelector field.
} else if (this.typeSelector.length) {
this.typeSelector.val() ? this.acSelectorWrapper.show() : this.acSelectorWrapper.hide();
}
},
@ -189,9 +198,9 @@ var customForm = {
customForm.undoAutocompleteSelection();
// If no selection, go back to type view. This prevents problems like trying to run autocomplete
// or submitting form without a type selection. Exception: in repair editMode, stay in full view,
// else we lose the role information.
(typeVal.length || customForm.editMode == 'repair') ? customForm.initFormFullView() : customForm.initFormTypeView();
// or submitting form without a type selection. Exception: if formSteps == 1 (e.g., a one-step form,
// or a two-step form in repair editMode) stay in full view, else we lose the role information.
(typeVal.length || customForm.formSteps === 1) ? customForm.initFormFullView() : customForm.initFormTypeView();
});
@ -383,9 +392,7 @@ var customForm = {
// mode, it's easier to specify the text here than in the jsp.
setLabels: function() {
var newLabelTextForNewInd,
// if this.acType is empty, we are in repair mode with no activity type selected.
// Prevent the labels from showing 'Select one' by using the generic term 'Activity'
typeText = this.acType ? this.typeName : 'Activity';
typeText = this.getTypeNameForLabels();
this.labelFieldLabel.html(typeText + ' ' + this.baseLabelText);
@ -412,9 +419,7 @@ var customForm = {
return;
}
// if this.acType is empty, we are in repair mode with no activity type selected.
// Prevent the labels from showing 'Select one' by using the generic term 'Activity'
typeText = this.acType ? this.typeName : 'Activity';
typeText = this.getTypeNameForLabels();
// Creating new related individual
if (newOrExisting === 'new') {
@ -433,6 +438,13 @@ var customForm = {
}
this.button.val(buttonText);
},
getTypeNameForLabels: function() {
// If this.acType is empty, we are either in a one-step form with no type yet selected,
// or in repair mode in a two-step form with no type selected. Use the default type
// name specified in the form data (this.typeName is 'Select one').
return this.acType ? this.typeName : this.capitalize(this.defaultTypeName);
}
};

19
productMods/edit/forms/personHasEducationalTraining.jsp
View file

@ -373,7 +373,6 @@ core:dateTimePrecision (DateTimeValue : DateTimeValuePrecision)
List<String> customCss = new ArrayList<String>(Arrays.asList(Css.JQUERY_UI.path(),
Css.CUSTOM_FORM.path(),
"/edit/forms/css/autocomplete.css",
"/edit/forms/css/customFormWithAutocomplete.css"
));
request.setAttribute("customCss", customCss);
@ -388,9 +387,13 @@ core:dateTimePrecision (DateTimeValue : DateTimeValuePrecision)
<form action="<c:url value="/edit/processRdfForm2.jsp"/>" >
<p class="inline"><v:input type="select" label="Organization Type ${requiredHint}" name="orgType" disabled="${disabledVal}" id="typeSelector" /></p>
<v:input type="select" label="Degree" id="degree" />
<div class="fullViewOnly">
<v:input type="text" label="Major Field of Degree ${requiredHint}" id="majorField" size="30" />
<v:input type="text" label="Year ${yearHint}" id="year" size="4" />
<p class="inline"><v:input type="select" label="Organization Type ${requiredHint}" name="orgType" disabled="${disabledVal}" id="typeSelector" /></p>
<p><v:input type="text" id="relatedIndLabel" name="orgLabel" label="Name ${requiredHint}" cssClass="acSelector" disabled="${disabledVal}" size="50" /></p>
@ -407,17 +410,10 @@ core:dateTimePrecision (DateTimeValue : DateTimeValuePrecision)
<v:input type="hidden" id="org" cssClass="acUriReceiver" /> <!-- Field value populated by JavaScript -->
</div>
<v:input type="select" label="Degree" id="degree" />
<v:input type="text" label="Major Field of Degree ${requiredHint}" id="majorField" size="30" />
<v:input type="text" label="Year ${yearHint}" id="year" size="4" />
<v:input type="text" label="Department or School Name within the Organization" id="dept" size="50" />
<v:input type="text" label="Supplemental Information" id="info" size="50" />
<p>e.g., <em>Postdoctoral training</em> or <em>Transferred</em></p>
</div>
<p class="submit"><v:input type="submit" id="submit" value="${submitButtonText}" cancel="true"/></p>
@ -430,7 +426,8 @@ core:dateTimePrecision (DateTimeValue : DateTimeValuePrecision)
var customFormData = {
acUrl: '${acUrl}',
editMode: '${editMode}',
submitButtonTextType: 'compound'
submitButtonTextType: 'compound',
defaultTypeName: 'organization'
};
</script>

2
productMods/edit/forms/personHasPositionHistory.jsp
View file

@ -301,7 +301,6 @@
List<String> customCss = new ArrayList<String>(Arrays.asList(Css.JQUERY_UI.path(),
Css.CUSTOM_FORM.path(),
"/edit/forms/css/autocomplete.css",
"/edit/forms/css/customFormWithAutocomplete.css"
));
request.setAttribute("customCss", customCss);
@ -320,6 +319,7 @@
<div class="fullViewOnly">
<%-- <p> needed to create wrapper for show/hide --%>
<p><v:input type="text" id="relatedIndLabel" name="orgLabel" label="Name ${requiredHint}" cssClass="acSelector" disabled="${disabledVal}" size="50" /></p>
<%-- Store these values in hidden fields, because the displayed fields are disabled and don't submit. This ensures that when