ظپظٹ ط§ظ‚ظ„ ظ…ظ† 9 ط¯ظ‚ط§ط¦ظ‚ طھط¹ظ„ظ… ظƒظٹظپظٹط© ط§ظ„طھط*ظ‚ظ‚ ظ…ظ† ط§ظ„ط*ظ‚ظˆظ„ ط¨ط¨ط³ط§ط·ط© ظƒظ…ط§ ظٹظپط¹ظ„ظ‡ط§ ط§ظ„ظ…ط*طھط±ظپظٹظ† ط¨ظ€ JS


بسم الله الرحمن الرحيم

السلام عليكم ورحمه الله وبركاته

مثال تطبيقي




مشاهدة


[YOUTUBE]watch?v=sQhAVkQUOGE[/YOUTUBE]


http://www.youtube.com/watch?v=sQhAVkQUOGE


السورس

رمز PHP:
<code style="white-space:nowrap"> <code> <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>Validate !</title>
<meta http-equiv="content-type" content="text/html; charset=utf-8" />
</head>
<body>

<script type="text/javascript">

/** error msgs variables */
var emsg = 'Invailde name';
var emsg2 = 'username must be bigthan 3 chars';
var emsg3 = 'username must be lessthan 20 chars';

/** function to check the form befor submit */
function validate()
{
// get elements by ID's to check value and change styles and rules
var uname = document.getElementById("username").value;
var errormsg = document.getElementById("errormsg");
var ename = document.getElementById("username");

// check if username value is empty or null same way ^_^



if (uname == '' || uname == null)
{
errormsg.style.visibility = 'visible';
errormsg.innerHTML = emsg;
ename.style.border = '1px solid #FF0000';
return false;
}
// check length if lessthan 3
else if (uname.length <= 3)
{
errormsg.style.visibility = 'visible';
errormsg.innerHTML = emsg2;
ename.style.border = '1px solid #FF0000';
return false;
}
// check length if bigthan 20
else if (uname.length >= 20)
{
errormsg.style.visibility = 'visible';
errormsg.innerHTML = emsg3;
ename.style.border = '1px solid #FF0000';
return false;
}
// if ok return to submit and send query string
else
{
alert("welcome "+ uname);
return true;
}
}
</script>

<!-- HTML Login Form -->
<form onsubmit="return validate();" action="validate.html" method="post">
<input type="text" id="username" name="username" />
<span id="errormsg" style="color: red; visibility: hidden;"></span>
<input type="submit" value="Login !" />
</form>
<!-- HTML Login Form //-->

</body>
</html>
</code> </code>










©المشاركات المنشورة تعبر عن وجهة نظر صاحبها فقط، ولا تُعبّر بأي شكل من الأشكال عن وجهة نظر إدارة المنتدى©