PDA

View Full Version : Resolved Problem with setfocus()



forum_amnesiac
04-22-2009, 04:33 PM
I have a form in which I validate that the date is input in a set format, that the date is not before today and that it is a Monday.

All of the validation works perfectly.

If the value fails to pass any one of these validation tests I want to give an alert and return to the date field for re-input, I use a small function for this.

The problem I have is that although the alert is given, the focus does not return to the correct field, it goes to the next field in the form sequence. I use "tabindex" to ensure that the fields are initially presented in the sequence I want.

Here is my JS

function fieldFocus3(msg) {
alert(msg);
document.jaugeage.startDate.select();
document.jaugeage.startDate.focus();
return false;
}

function mondaycheck(datechosen, fridaydate) {
var dtCh= "/";
var pos1=datechosen.indexOf(dtCh);
var pos2=datechosen.indexOf(dtCh,pos1+1);
if (pos1==-1 || pos2==-1){
fieldFocus3("Veuillez écrire la date de début comme ceci jj/mm/aaaa");
jaugeage.startDate.value = "jj/mm/aaaa";
}
if (pos1!=-1 && pos2!=-1){
var parts = datechosen.split('/');
var passdate = new Date(parseFloat(parts[2]),(parseFloat(parts[1])-1),parseFloat(parts[0]),23,59,59,999);
var thisDay=passdate.getDay();
Testtoday = new Date();
if(passdate < Testtoday) {
fieldFocus3("La date ne peut pas être plus tôt qu'aujourd'hui");
jaugeage.startDate.value = "jj/mm/aaaa";
}
else {
var myDays= ["Dimanche","Lundi","Mardi","Mercredi","Jeudi","Vendredi","Samedi","Dimanche"];
var daychosen = myDays[thisDay];
if (daychosen != "Lundi") {
fieldFocus3("Lundi seul");
jaugeage.startDate.value = "jj/mm/aaaa";
}
else {
var mondate = new Date(passdate.valueOf());
var mody = mondate.getDate();
var monmo = mondate.getMonth()+1;
var monyr = mondate.getFullYear();
if (mody < 10){ mody = '0' + mody;}
if (monmo < 10){ monmo = '0' + monmo;}
var tuedate = new Date(passdate.valueOf() + (1 * 24 * 60 * 60 * 1000));
var tudy = tuedate.getDate();
var tuemo = tuedate.getMonth()+1;
var tueyr = tuedate.getFullYear();
if (tudy < 10){ tudy = '0' + tudy;}
if (tuemo < 10){ tuemo = '0' + tuemo;}
var weddate = new Date(passdate.valueOf() + (2 * 24 * 60 * 60 * 1000));
var wddy = weddate.getDate();
var wedmo = weddate.getMonth()+1;
var wedyr = weddate.getFullYear();
if (wddy < 10){ wddy = '0' + wddy;}
if (wedmo < 10){ wedmo = '0' + wedmo;}
var thurdate = new Date(passdate.valueOf() + (3 * 24 * 60 * 60 * 1000));
var thdy = thurdate.getDate();
var thurmo = thurdate.getMonth()+1;
var thuryr = thurdate.getFullYear();
if (thdy < 10){ thdy = '0' + thdy;}
if (thurmo < 10){ thurmo = '0' + thurmo;}
var fridate = new Date(passdate.valueOf() + (4 * 24 * 60 * 60 * 1000));
var frdy = fridate.getDate();
var frimo = fridate.getMonth()+1;
var friyr = fridate.getFullYear();
if (frdy < 10){ frdy = '0' + frdy;}
if (frimo < 10){ frimo = '0' + frimo;}
document.getElementById('beginDate').innerHTML = mody+"/"+monmo+"/"+monyr;
document.getElementById('beginDateField').value = mody+"/"+monmo+"/"+monyr;
document.getElementById('endDate').innerHTML = frdy+"/"+frimo+"/"+friyr;
document.getElementById('FridayDate').innerHTML = frdy+"/"+frimo+"/"+friyr;
document.getElementById('endDateField').value = frdy+"/"+frimo+"/"+friyr;
document.getElementById('thursDate').innerHTML = thdy+"/"+thurmo+"/"+thuryr;
document.getElementById('thursDateField').value = thdy+"/"+thurmo+"/"+thuryr;
document.getElementById('wedsDate').innerHTML = wddy+"/"+wedmo+"/"+wedyr;
document.getElementById('wedsDateField').value = wddy+"/"+wedmo+"/"+wedyr;
document.getElementById('tuesDate').innerHTML = tudy+"/"+tuemo+"/"+tueyr;
document.getElementById('tuesDateField').value = tudy+"/"+tuemo+"/"+tueyr;
return true;
}
}
}
}


Here is the relevant HTML

<form id="Jaugeage" action="html_mail_process.php" method="post" name="jaugeage">
<table width="100%">
</tr>
<td align="center"><b><i>PREVISIONS DE JAUGEAGE SEMAINE DU&nbsp;&nbsp;</i></b>
<input type="text" size="12" maxlength="12" value="jj/mm/aaaa" name="startDate" tabindex="10" onKeyDown="if(event.keyCode==13) event.keyCode=9;" onChange="mondaycheck(this.value, this.form.txtFri);"/>
</td>
</tr>
<tr>
<td align="center"><textarea cols="30" name="txtLundimorn" rows="5" tabindex="11"></textarea></td>
</tr>
</table>
</form>

Can anybody see what is causing the problem with returning to the date field, or offer me another solution.

clueful
04-23-2009, 01:47 AM
I
The problem I have is that although the alert is given, the focus does not return to the correct field, it goes to the next field in the form sequence.This is a common problem, solved by setting a timeout to focus the field. Having said that, alerting on blur (or on change) is generally regarded as hostile operation.