PDA

Click to See Complete Forum and Search --> : Javascript and dynamic DIV display

sgalmeida
01-07-2004, 07:48 AM
Greetings,

I have a PHP function that outputs a Javascript function that verifies if a certain field is a digit or not. I want to, if it is not a digit, a DIV is shown with a custom message (is prettier than an JS alert). If I do this the way you can see bellow, I loose the page I was seeing; on source page I see only the DIV from isDigito(valor,campo) uutput. How can I do to not loose the rest of the page?
How can I do, using Javascript, do display DIV without loosing the rest of the page?

Thanks
Sérgio


<?
function JS_isDigito(){
?>
<script LANGUAGE='JavaScript'>
<!-- Begin
function isDigito(valor,campo){
var digits='0123456789'
var temp

for (var i=0;i<valor.value.length;i++){
temp=valor.value.substring(i,i+1)
if (digits.indexOf(temp)==-1){
/*alert("O campo '"+campo+"' deve ser preenchido apenas com números!")
valor.value=""
valor.focus()
*/

document.write("<div id=\"Alert\" style=\"position:absolute; width:300px; height:141px; z-index:1; overflow: hidden; left: 357px; top: 354px; visibility: visible;\"> ");
document.write("<table width=\"300\" border=\"0\" cellspacing=\"0\" cellpadding=\"0\">");
document.write("<tr>");
document.write("<td><img src=\"img/AlertTopo.gif\" width=\"300\" height=\"15\"></td>");
document.write("</tr>");
document.write("</table>");
document.write("<table width=\"300\" border=\"0\" cellpadding=\"0\" cellspacing=\"0\" background=\"img/AlertMeio.gif\">");
document.write("<tr>");
document.write("<td height=\"30\"><div align=\"center\"><? echo $GLOBALS['divAlertMinutesText']; ?></div></td>");
document.write("</tr>");
document.write("<tr>");
document.write("<td height=\"30\"><div align=\"center\">");
document.write("<input name=\"Submit22\" type=\"submit\" class=\"op\" onClick=\"MM_showHideLayers('Alert','','hide')\" value=\"Fechar\">");
document.write("</div></td></tr><tr> <td>&nbsp;</td></tr></table>");
document.write("<table width=\"300\" border=\"0\" cellspacing=\"0\" cellpadding=\"0\">");
document.write("<tr> <td><img src=\"img/AlertBaixo.gif\" width=\"300\" height=\"15\"></td>");
document.write("</tr></table></div>");


return false
}
}
return true;
}
// End -->
</script>
<?
}
?>
Pittimann
01-07-2004, 08:17 AM
Hi!

Due to the fact that I don't know your form, I left out the arguments for the function.

You could try it like that:

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<title>Untitled</title>
</head>
<body>
<script language="JavaScript" type="text/javascript">
<!--
function isDigito(){
var digits='0123456789'
var temp
for (var i=0;i<document.forms[0].textfield.value.length;i++){
temp=document.forms[0].textfield.value.substring(i,i+1)
if (digits.indexOf(temp)==-1){
document.getElementById("Alert").style.visibility="visible";
return false
}
}
return true;
}
//-->
</script>
<form onSubmit="return isDigito()">
<input type="text" name="textfield">
<input type="submit" value="click">
</form>
<div id="Alert" style="position:absolute; width:300px; height:141px; z-index:1; overflow: hidden; left: 357px; top: 354px; visibility: hidden;">
<table width="300" border="0" cellspacing="0" cellpadding="0">
<tr>
<td><img src="img/AlertTopo.gif" width="300" height="15"></td>
</tr>
</table>
<table width="300" border="0" cellpadding="0" cellspacing="0" background="img/AlertMeio.gif">
<tr>
<td height="30"><div align="center"><? echo $GLOBALS['divAlertMinutesText']; ?></div></td>
</tr>
<tr>
<td height="30"><div align="center">
<input name="Submit22" type="submit" class="op" onClick="MM_showHideLayers('Alert','','hide')" value="Fechar">
</div></td></tr><tr> <td> </td></tr></table>
<table width="300" border="0" cellspacing="0" cellpadding="0">
<tr> <td><img src="img/AlertBaixo.gif" width="300" height="15"></td>
</tr></table></div>
</body>
</html>

Cheers - Pit