getting scrollpane to scroll 'with' tabIndex

[mindfriction]

Ok, lets try again ;)

Cyanblue ive been working on the useability of the form and i just managed figure out how to get the tabIndex working properly, but how would i get the scrollpane component to scroll with the tabIndex? And also scroll to the first field detected to have invalid data? Could you please help/ give me a hint?

Here's a snippet of my script..


//instantiate tab index's
this._parent.tabEnabled=false;
this._parent.tabChildren=true;
firstName_txt.tabIndex=1;
lastName_txt.tabIndex=2;
street_txt.tabIndex=3;
suburb_txt.tabIndex=4;
postcode_txt.tabIndex=5;
state_txt.tabIndex=6;
contry_txt.tabIndex=7;
businessAreacode_txt.tabIndex=8;
businessPh_txt.tabIndex=9;
mobilePh_txt.tabIndex=10;
faxAreacode_txt.tabIndex=11;
faxPh_txt.tabIndex=12;
website_txt.tabIndex=13;
title_txt.tabIndex=14;
company_txt.tabIndex=15;
emailAddress_txt.tabIndex=16;
confirmEmailAddress_txt.tabIndex=17;
username_txt.tabIndex=18;
pass_txt.tabIndex=19;
confirmPass_txt.tabIndex=20;
question_txt.tabIndex=21;
answer_txt.tabIndex=22;
disagree_cmp.tabIndex=23;
agree_cmp.tabIndex=24;
submit_cmp.tabIndex=25;
reset_cmp.tabIndex=26;
Selection.setFocus("$firstName");
....
....
....

function processForm(component){

component.enabled=false;//disable submission button to stop accidental multiple submissions
required1_mc._visible = required2_mc._visible = required3_mc._visible = required4_mc._visible = required5_mc._visible = required6_mc._visible = required7_mc._visible = required8_mc._visible = required9_mc._visible = required10_mc._visible = required11_mc._visible = required12_mc._visible = required13_mc._visible = required14_mc._visible = required15_mc._visible = required16_mc._visible = required17_mc._visible = required18_mc._visible =false;
trace("processing form");
if((!$firstName.trim().length>0)
|| (!$lastName.trim().length>0)
|| (!$street.trim().length>0)
|| (!$suburb.trim().length>0)
|| (!$postcode.trim().length>0)
|| (!$state.trim().length>0)
|| (!$country.trim().length>0)
|| (!$businessAreacode.trim().length>0)
|| (!$businessPh.trim().length>0)
|| (!$title.trim().length>0)
|| (!$company.trim().length>0)
|| (($emailAddress.trim().isEmail() && confirmEmailAddress.trim().isEmail() && !($emailAddress.trim()==confirmEmailAddress.trim() )) || !$emailAddress.trim().isEmail() || !confirmEmailAddress.trim().isEmail())
|| (!$username.trim().length>0)
|| (($pass.trim().length>0 && confirmPass.trim().length>0 && !($pass.trim()==confirmPass.trim())) || !$pass.trim().length>0 || !confirmPass.trim().length>0)
|| (!$question.trim().length>0)
|| (!$answer.trim().length>0)){


if (!$firstName.trim().length>0){
trace("no first name");
required1_mc._visible=true;
}
if (!$lastName.trim().length>0){
trace("no last name");
required2_mc._visible=true;
}
if(!$street.trim().length>0){
trace("no street");
required3_mc._visible=true;
}
if(!$suburb.trim().length>0){
trace("no suburb");
required4_mc._visible=true;
}
if(!$postcode.trim().length>0){
trace("no postcode");
required5_mc._visible=true;
}
if(!$state.trim().length>0){
trace("no state");
required6_mc._visible=true;
}
if (!$country.trim().length>0){
trace("no country");
required7_mc._visible=true;
}
if (!$businessAreacode.trim().length>0) {
trace("no business areacode");
required8_mc._visible=true;
}
if (!$businessPh.trim().length>0) {
trace("no business ph");
required8_mc._visible=true;
}
if(!$title.trim().length>0) {
trace("no title");
required9_mc._visible=true;
}
if(!$company.trim().length>0) {
trace("no company");
required10_mc._visible=true;
}
if(($emailAddress.trim().isEmail() && confirmEmailAddress.trim().isEmail() && !($emailAddress.trim()==confirmEmailAddress.trim() )) || !$emailAddress.trim().isEmail() || !confirmEmailAddress.trim().isEmail()){
trace("no email");
required11_mc._visible=true;
required12_mc._visible=true;

}
if(!$username.trim().length>0){
trace("no username");
required13_mc._visible=true;
}
if(($pass.trim().length>0 && confirmPass.trim().length>0 && !($pass.trim()==confirmPass.trim())) || !$pass.trim().length>0 || !confirmPass.trim().length>0){
trace("bad pass");
required14_mc._visible=true;
required15_mc._visible=true;
}
if(!$question.trim().length>0){
trace("no question");
required16_mc._visible=true;
}
if(!$answer.trim().length>0){
trace("no answer");
required17_mc._visible=true;
}
this._parent._parent.openError("Please enter data correctly. Check fields denoted with arrows")
component.enabled=true;


}else if(agreementGroup.getValue()=="disagree"){
trace("user hasn't opt-in");
required18_mc._visible=true;
this._parent._parent.openError("You must accept on our terms and conditions as outlined at the bottom of this form to proceed");

component.enabled=true;
}else{
this._parent._parent.openStatus("submitting form please wait...", 2);
trace("All is Ok");
$recieveData = new LoadVars();
$sendData = new LoadVars();

$sendData.action="register";
$sendData.firstName=$firstName.trim();
$sendData.lastName=$lastName.trim();
$sendData.street=$street.trim();
$sendData.suburb=$suburb.trim();
$sendData.postcode=$postcode.trim();
$sendData.state=$state.trim();
$sendData.country=$country.trim();
$sendData.businessAreacode=$businessAreacode.trim( );
$sendData.businessPh=$businessPh.trim();
$sendData.mobilePh=$mobilePh.trim();
$sendData.title=$title.trim();
$sendData.faxAreacode=$faxAreacode.trim();
$sendData.faxPh=$faxPh.trim();
$sendData.company=$company.trim();
$sendData.website=$website.trim();
$sendData.emailAddress=$emailAddress1.trim();
$sendData.username=$username.trim();
$sendData.pass=$pass.trim();
$sendData.question=$question.trim();
$sendData.answer=$answer.trim();
$sendData.sendAndLoad("php/user.php",$recieveData,"POST");
$recieveData.onLoad = loadRegisterData;

}
};


Thanyou in advance

[mindfriction]

Well after some tedious 'very static' coding I cam up with something that works. But surely there is a better 'more optimised' method of achieving the same results :(


/*
processApp function validates all inout fields and indicates invalid fields
*/
function processForm(component){

component.enabled=false;//disable submission button to stop accidental multiple submissions
required1_mc._visible = required2_mc._visible = required3_mc._visible = required4_mc._visible = required5_mc._visible = required6_mc._visible = required7_mc._visible = required8_mc._visible = required9_mc._visible = required10_mc._visible = required11_mc._visible = required12_mc._visible = required13_mc._visible = required14_mc._visible = required15_mc._visible = required16_mc._visible = required17_mc._visible = required18_mc._visible =false;
trace("processing form");
if((!$firstName.trim().length>0)
|| (!$lastName.trim().length>0)
|| (!$street.trim().length>0)
|| (!$suburb.trim().length>0)
|| (!$postcode.trim().length>0)
|| (!$state.trim().length>0)
|| (!$country.trim().length>0)
|| (!$businessAreacode.trim().length>0)
|| (!$businessPh.trim().length>0)
|| (!$title.trim().length>0)
|| (!$company.trim().length>0)
|| (($emailAddress.trim().isEmail() && confirmEmailAddress.trim().isEmail() && !($emailAddress.trim()==confirmEmailAddress.trim() )) || !$emailAddress.trim().isEmail() || !confirmEmailAddress.trim().isEmail())
|| (!$username.trim().length>0)
|| (($pass.trim().length>0 && confirmPass.trim().length>0 && !($pass.trim()==confirmPass.trim())) || !$pass.trim().length>0 || !confirmPass.trim().length>0)
|| (!$question.trim().length>0)
|| (!$answer.trim().length>0)){

if(!$answer.trim().length>0){
trace("no answer");
required17_mc._visible=true;
scrollPos=answer_txt._y + answer_txt._height;
focus="$answer";
}
if(!$question.trim().length>0){
trace("no question");
required16_mc._visible=true;
scrollPos=question_txt._y + question_txt._height;
focus="$question";
}
if(($pass.trim().length>0 && confirmPass.trim().length>0 && !($pass.trim()==confirmPass.trim())) || !$pass.trim().length>0 || !confirmPass.trim().length>0){
trace("bad pass");
required14_mc._visible=true;
required15_mc._visible=true;
scrollPos=pass_txt._y + pass_txt._height;
focus="$pass";
}
if(!$username.trim().length>0){
trace("no username");
required13_mc._visible=true;
scrollPos=username_txt._y + username_txt._height;
focus="$username";
}
if(($emailAddress.trim().isEmail() && confirmEmailAddress.trim().isEmail() && !($emailAddress.trim()==confirmEmailAddress.trim() )) || !$emailAddress.trim().isEmail() || !confirmEmailAddress.trim().isEmail()){
trace("no email");
required11_mc._visible=true;
required12_mc._visible=true;
scrollPos=emailAddress_txt._y + emailAddress_txt._height;
focus="$emailAddress";
}
if(!$company.trim().length>0) {
trace("no company");
required10_mc._visible=true;
scrollPos=company_txt._y + company_txt._height;
focus="$company";
}
if(!$title.trim().length>0) {
trace("no title");
required9_mc._visible=true;
scrollPos=title_txt._y + title_txt._height;
focus="$title";
}
if (!$businessPh.trim().length>0) {
trace("no business ph");
required8_mc._visible=true;
scrollPos=businessPh_txt._y + businessPh_txt._height;
focus="$businessPh";
}
if (!$businessAreacode.trim().length>0) {
trace("no business areacode");
required8_mc._visible=true;
scrollPos=businessAreacode_txt._y + businessAreacode_txt._height;
focus="$businessAreacode";
}
if (!$country.trim().length>0){
trace("no country");
required7_mc._visible=true;
scrollPos=country_txt._y +country_txt._height;
focus="$country";
}
if(!$state.trim().length>0){
trace("no state");
required6_mc._visible=true;
scrollPos=state_txt._y + state_txt._height;
focus="$state";
}
if(!$postcode.trim().length>0){
trace("no postcode");
required5_mc._visible=true;
scrollPos=postcode_txt._y + postcode_txt._height;
focus="$postcode";
}
if(!$suburb.trim().length>0){
trace("no suburb");
required4_mc._visible=true;
scrollPos=suburb_txt._y + suburb_txt._height;
focus="$suburb";;
}
if(!$street.trim().length>0){
trace("no street");
required3_mc._visible=true;
scrollPos=street_txt._y +street_txt._height;
focus="$street";
}
if (!$lastName.trim().length>0){
trace("no last name");
required2_mc._visible=true;
scrollPos=lastName_txt._y + lastName_txt._height;
focus="$lastName";
}
if (!$firstName.trim().length>0){
trace("no first name");
required1_mc._visible=true;
scrollPos=firstName_txt._y + firstName_txt._height;
focus="$firstName";
//Selection.setFocus("$firstName");
}
this._parent.smoothScrollTo(0, scrollPos-this._parent.vScrollBar_mc.scrollThumb_mc._height) ;
Selection.setFocus(focus);
this._parent._parent.openError("Please enter all required information carefully. Check fields denoted with arrows")
component.enabled=true;


}else if(agreementGroup.getValue()=="disagree"){
trace("user hasn't opt-in");
this._parent._parent.openError("You must accept our terms and conditions as outlined at the bottom of this form before you can proceed");
required18_mc._visible=true;
this._parent.smoothScrollTo(0, (agree_cmp._y+this.agree_cmp._height) - this._parent.vScrollBar_mc.scrollThumb_mc._height) ;
Selection.setFocus(agree_cmp);
component.enabled=true;
}else{
this._parent._parent.openStatus("Submitting form please wait...");
trace("All is Ok");
$recieveData = new LoadVars();
$sendData = new LoadVars();

$sendData.action="register";
$sendData.firstName=$firstName.trim();
$sendData.lastName=$lastName.trim();
$sendData.street=$street.trim();
$sendData.suburb=$suburb.trim();
$sendData.postcode=$postcode.trim();
$sendData.state=$state.trim();
$sendData.country=$country.trim();
$sendData.businessAreacode=$businessAreacode.trim( );
$sendData.businessPh=$businessPh.trim();
$sendData.mobilePh=$mobilePh.trim();
$sendData.title=$title.trim();
$sendData.faxAreacode=$faxAreacode.trim();
$sendData.faxPh=$faxPh.trim();
$sendData.company=$company.trim();
$sendData.website=$website.trim();
$sendData.emailAddress=$emailAddress.trim();
$sendData.username=$username.trim();
$sendData.pass=$pass.trim();
$sendData.question=$question.trim();
$sendData.answer=$answer.trim();
$sendData.sendAndLoad("php/user.php",$recieveData,"POST");
$recieveData.onLoad = loadRegisterData;

}
};

[mindfriction]

Oh and the smoothTo function is one of Jesse's prototypes, which eases the scroller to a partuclar position. And here's that:


//by Jesses S
FScrollPaneClass.prototype.smoothScrollTo = function(x, y) {
if (_global.scrollInt == undefined) {
_global.scrollInt = setInterval(this, "doSmoothScrollTo", 60, x, y);
return true;
} else {
trace (_global.scrollInt)
return false
}
};
FScrollPaneClass.prototype.doSmoothScrollTo = function(x, y) {
the_sp = this;
var curScroll = the_sp.getScrollPosition();
var xDiff = curScroll.x-x;
var yDiff = curScroll.y-y;
var nextX = curScroll.x-(xDiff/10);
var nextY = curScroll.y-(yDiff/10);
the_sp.setScrollPosition(nextX, nextY);
if (Math.abs(curScroll.x-x)<=1 && Math.abs(curScroll.y-y)<=1) {
//trace("finished smooth scroll");
the_sp.setScrollPosition(x, y);
clearInterval(_global.scrollInt);
delete _global.scrollInt
}
};