بالنسبة لخاصية الحقول المطلوبة
وانا اخترتها بالنسبة لنموذجنا تكون كالتالي " الاسم مطلوب وعنوان الموضوع مطلوب ونص الموضوع مطلوب // بالنسبة للبريد لن يتم وضعه لان بالكود السابق ( التحقق من البريد ) يطلب اضافته اي البريد الان اصلاً مطلوب 
.
بنفس طريقة اضافة الجافا سكربت للبريد سنضيف جافا سكربت التحقق .
اخر مرة ظهر معنا الهيد كامل بعد اضافة جافا سكربت تحقق البريد كالتالي :
كود HTML:
<html lang="ar" dir=rtl>
<head>
<meta http-equiv="Content-Language" content="en-us">
<title>Contact Us</title>
<meta http-equiv="Content-Type" content="text/html; charset=windows-1252">
<script type="text/javascript">
var emailfilter=/^\w+[\+\.\w-]*@([\w-]+\.)*\w+[\w-]*\.([a-z]{2,4}|\d+)$/i
function checkmail(e){
var returnval=emailfilter.test(e.value)
if (returnval==false){
alert("يرجى ادخال البريد بصورة صحيحة.")
e.select()
}
return returnval
}
</script>
</head>
الان بعد كلمة </script> وهي وسم اغلاق الجافا سكربت للتحق من البريد . نضغط انتر اي بالسطر الذي يليه نلصق التالي :
كود HTML:
<script language="JavaScript">
function formCheck(formobj){
// Enter name of mandatory fields
var fieldRequired = Array("name", "subject" ,"text" );
// Enter field description to appear in the dialog box
var fieldDescription = Array("Your Name", "The Subject" , "Your Message");
// dialog message
var alertMsg = "Error, Please Fill The:\n";
var l_Msg = alertMsg.length;
for (var i = 0; i < fieldRequired.length; i++){
var obj = formobj.elements[fieldRequired[i]];
if (obj){
switch(obj.type){
case "select-one":
if (obj.selectedIndex == -1 || obj.options[obj.selectedIndex].text == ""){
alertMsg += " - " + fieldDescription[i] + "\n";
}
break;
case "select-multiple":
if (obj.selectedIndex == -1){
alertMsg += " - " + fieldDescription[i] + "\n";
}
break;
case "text":
case "textarea":
if (obj.value == "" || obj.value == null){
alertMsg += " - " + fieldDescription[i] + "\n";
}
break;
default:
}
if (obj.type == undefined){
var blnchecked = false;
for (var j = 0; j < obj.length; j++){
if (obj[j].checked){
blnchecked = true;
}
}
if (!blnchecked){
alertMsg += " - " + fieldDescription[i] + "\n";
}
}
}
}
if (alertMsg.length == l_Msg){
return true;
}else{
alert(alertMsg);
return false;
}
}
// -->
</script>
وساشرح اهم النقاط فيه
اول 8 اسطر هم الاسطر الي نحتاج نعدلهم فقط . لنستعرضهم ونشرحهم
كود HTML:
<script language="JavaScript">
function formCheck(formobj){
// Enter name of mandatory fields
var fieldRequired = Array("name", "subject" ,"text" );
// Enter field description to appear in the dialog box
var fieldDescription = Array("Your Name", "The Subject" , "Your Message");
// dialog message
var alertMsg = "Error, Please Fill The:\n";
السطر الرابع :
كود HTML:
var fieldRequired = Array("name", "subject" ,"text" );
وفيه تظهر اسماء الحقول المطلوبة بالترتيب بالشكل التالي
"name", "subject" ,"text"
اما السطر السادس فيحتوي على شرح هذا الام ويفضل كتابته كما مكتوب بالنموذج حتى تسهل على المرسل مثلا بالنموذج لدينا
الحقل name اسميناه ب الإسم لاحظ الصورة
والحصل subject اسميناه للزائر باسم موضوع الرسالة
والحقل text اسميناه باسم نص الرسالة
لذا يتم كتابة على الترتيب
"نص الرسالة", "موضوع الرسالة" ,"الإسم"
لتتطابق مع السطر الرابع اي نفس الترتيب
"name", "subject" ,"text"
"نص الرسالة", "موضوع الرسالة" ,"الإسم"
اخر سطر وهو السطر الثامن ويظهر رسالة الخطاً التي ستظهر للزائر مثال
كود HTML:
var alertMsg = "[COLOR=DarkRed]Error, Please Fill The[/COLOR]:\n";
او ممكن نكتبها باللغة العربية كالتالي
كود HTML:
var alertMsg = "[COLOR=DarkRed]يرجى تعبئة الحقول التالية :[/COLOR]:\n";
وبالتاكيد سيبحث عن الحقول الناقصة من المطلوبين ويعرض الشرح الذي قمنا بكتابته مثلا :
يرجى تعبئة الحقول التالية :
- الإسم
-موضوع الرسالة
- نص الرسالة
الان شرحنا الكود لنذعه كامل
كود HTML:
<html lang="ar" dir=rtl>
<head>
<meta http-equiv="Content-Language" content="en-us">
<title>Contact Us</title>
<meta http-equiv="Content-Type" content="text/html; charset=windows-1252">
<script type="text/javascript">
var emailfilter=/^\w+[\+\.\w-]*@([\w-]+\.)*\w+[\w-]*\.([a-z]{2,4}|\d+)$/i
function checkmail(e){
var returnval=emailfilter.test(e.value)
if (returnval==false){
alert("يرجى ادخال البريد بصورة صحيحة.")
e.select()
}
return returnval
}
</script>
</head>
<script language="JavaScript">
function formCheck(formobj){
// Enter name of mandatory fields
var fieldRequired = Array("name", "subject" ,"text" );
// Enter field description to appear in the dialog box
var fieldDescription = Array("Your Name", "The Subject" , "Your Message");
// dialog message
var alertMsg = "Error, Please Fill The:\n";
var l_Msg = alertMsg.length;
for (var i = 0; i < fieldRequired.length; i++){
var obj = formobj.elements[fieldRequired[i]];
if (obj){
switch(obj.type){
case "select-one":
if (obj.selectedIndex == -1 || obj.options[obj.selectedIndex].text == ""){
alertMsg += " - " + fieldDescription[i] + "\n";
}
break;
case "select-multiple":
if (obj.selectedIndex == -1){
alertMsg += " - " + fieldDescription[i] + "\n";
}
break;
case "text":
case "textarea":
if (obj.value == "" || obj.value == null){
alertMsg += " - " + fieldDescription[i] + "\n";
}
break;
default:
}
if (obj.type == undefined){
var blnchecked = false;
for (var j = 0; j < obj.length; j++){
if (obj[j].checked){
blnchecked = true;
}
}
if (!blnchecked){
alertMsg += " - " + fieldDescription[i] + "\n";
}
}
}
}
if (alertMsg.length == l_Msg){
return true;
}else{
alert(alertMsg);
return false;
}
}
// -->
</script>
طبعاً هذا كامل ( جافا سكربت التحقق من البريد + جافا سكربت التحقق من الحقول الناقصة )
باقي خطوة صغير وهي اضافة
كود HTML:
onsubmit="return formCheck(this);
بنفس الطريقة السابقة لنموج التحقق اي نبحث على زر submit وبالhtml نشوف خصائصة
ممكن نضيفها مباشرة بعد كود التحقق من البريد ليصبح بالشكل التالي
كود HTML:
<td><input type="submit" value="ارسال" name="B1" onClick="return checkmail(this.form.email)" onClick="return checkmail(this.form.myemail)" dir="rtl"><input type="reset" value="اعادة تعيين" name="B2" dir="rtl"></td>
ان شاء الله يكون الشرح واضح واي استفسار انا جاهز
ضوابط المشاركة
رد مع اقتباس