oqapi/webgui
2
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

Improved Survey template so that bottom of page/submit button can be

Browse source 
skinned when questions don't validate. Added js to scroll page to
highest invalid question (e.g. lowest y-coord)
This commit is contained in:
Patrick Donelan 2009-04-28 00:37:51 +00:00
parent d7d10fff41
commit aa045b7abc
2 changed files with 39 additions and 6 deletions
Download patch file Download diff file Expand all files Collapse all files

BIN
docs/upgrades/packages-7.7.5/root_import_survey_default-questions.wgpkg Normal file
View file

Binary file not shown.

45
www/extras/wobject/Survey/administersurvey.js
View file

@ -5,8 +5,9 @@ if (typeof Survey === "undefined") {
(function(){ (function(){
var CLASS_INVALID = 'survey-invalid'; // For elements that fail input validation var INVALID_QUESTION_CLASS = 'survey-invalid'; // CSS class for questions that fail input validation
var CLASS_INVALID_MARKER = 'survey-invalid-marker'; // For default '*' invalid field marker var INVALID_SUBMIT_CLASS = 'survey-submit-invalid'; // CSS class for submit div when questions don't validate
var INVALID_QUESTION_MARKER = 'survey-invalid-marker'; // For default '*' invalid field marker
// All specially-handled question types are listed here // All specially-handled question types are listed here
// (anything else is assumed to be a multi-choice bundle) // (anything else is assumed to be a multi-choice bundle)
@ -50,6 +51,7 @@ if (typeof Survey === "undefined") {
function formsubmit(event){ function formsubmit(event){
var submit = 1;//boolean for if all was good or not var submit = 1;//boolean for if all was good or not
var lowestInvalidY = 0;
for (var i in toValidate) { for (var i in toValidate) {
if (YAHOO.lang.hasOwnProperty(toValidate, i)) { if (YAHOO.lang.hasOwnProperty(toValidate, i)) {
var answered = 0; var answered = 0;
@ -111,22 +113,36 @@ if (typeof Survey === "undefined") {
if (!answered) { if (!answered) {
submit = 0; submit = 0;
// Apply CLASS_INVALID to the parent question div for people who want to skin Survey // Apply INVALID_QUESTION_CLASS to the parent question div for people who want to skin Survey
YAHOO.util.Dom.addClass(q_parent_node, CLASS_INVALID); YAHOO.util.Dom.addClass(q_parent_node, INVALID_QUESTION_CLASS);
// Insert default '*' marker (can be hidden via CSS for those who want something different) // Insert default '*' marker (can be hidden via CSS for those who want something different)
node.innerHTML = "<span class='" + CLASS_INVALID_MARKER + "'>*</span>"; node.innerHTML = "<span class='" + INVALID_QUESTION_MARKER + "'>*</span>";
// Keep track of the lowest y-coord invalid question (to scroll to)
var qY = YAHOO.util.Dom.getY(q_parent_node);
lowestInvalidY = lowestInvalidY && lowestInvalidY < qY ? lowestInvalidY : qY;
} }
else { else {
YAHOO.util.Dom.removeClass(q_parent_node, CLASS_INVALID); YAHOO.util.Dom.removeClass(q_parent_node, INVALID_QUESTION_CLASS);
node.innerHTML = ''; node.innerHTML = '';
} }
} }
} }
var submitButton = document.getElementById('submitbutton');
var submitDiv = submitButton && YAHOO.util.Dom.getAncestorByTagName(submitButton, 'div');
if (submit) { if (submit) {
submitDiv && YAHOO.util.Dom.removeClass(submitDiv, INVALID_SUBMIT_CLASS);
YAHOO.log("Submitting"); YAHOO.log("Submitting");
Survey.Comm.callServer('', 'submitQuestions', 'surveyForm', hasFile); Survey.Comm.callServer('', 'submitQuestions', 'surveyForm', hasFile);
} }
else {
submitDiv && YAHOO.util.Dom.addClass(submitDiv, INVALID_SUBMIT_CLASS);
// Scroll page to the y-coord of the lowest invalid question
lowestInvalidY && scrollPage(lowestInvalidY, 1.5, YAHOO.util.Easing.easeOut);
}
} }
function goBack(event){ function goBack(event){
@ -134,6 +150,23 @@ if (typeof Survey === "undefined") {
Survey.Comm.callServer('', 'goBack'); Survey.Comm.callServer('', 'goBack');
} }
function scrollPage(to, dur, ease) {
var setAttr = function(a, v, u) {
window.scroll(0, v);
};
var anim = new YAHOO.util.Anim(null,
{ 'scroll' : {
from : YAHOO.util.Dom.getDocumentScrollTop(),
to : to }
},
dur, ease
);
anim.setAttribute = setAttr;
anim.animate();
}
function numberHandler(event, objs){ function numberHandler(event, objs){
var keycode = event.keyCode; var keycode = event.keyCode;