بسم الله الرحمن الرحيم
الصلاة والسلام على أشرف الأنبياء والمرسلين نبينا محمد وعلى آله وصحبه أجمعين ومن تبعهم بإحسان إلى يوم الدين أما بعد
السلام عليكم ورحمة الله وبركاته
إخواني في هذا الدرس سأقوم بشرح طريقة عمل نموذج مراسلة بإستخدام ASP .NET بلغة البرمجة #C
المصدر : http://www.abdulmalik.althari.com
هذا الدرس مستند على درس التصميم في قسم التصميم بإستخدام برنامج الفوتوشوب
لعمل تصميم نموذج مراسله مثل هذا

من هنا : /index.php?showtopic=114651
ولعمل الخطوات البرمجية وتنسيق النموذج في المتصفح تابع هذا الدرس :)
بسم الله نبدأ
---------------------
أفتح Visual Studio 2005

أكتب اسم المجلد وغير اللغة إلى #C

إفتح الملف اللي سويناه في درس التصميم عشان تاخذ كود الصفحه من التصميم المقطع وتنقله إلى ملف Default.aspx :)


في ملف index.html أنسخ الكود اللي بين <body>

وألصقه في ملف Default.aspx بين التاق <div> وأضغط على Design لتشاهد تصميم الصفحه

سيضهر لك التصميم بهذا الشكل

لا تتفاجئ , يجب عليك نسخ مجلد الصور داخل مجلد مشروعك , أفتح المجلد الذي تم تقطيع فيه التصميم وانسخ مجلد الصور images

ثم ألصقه في المشروع

ثم أعمل تحديث لصفحة التصميم

ليضهر بهذا الشكل :)

أضغط على المستطيل التالي ضغطه واحده ثم أختر Source ليضع المشر على صورة المستطيل التي حددتها

أنسخ عنوان الصوره وألصقها في تاق td الذي يمثل صف الصوره مثل هكذا ( لاحظ الصوره جيداً

يجب عليك إضافة خاصية background في td ثم قم بمسح تاق <img> الذي بداخل td كاملاً

الأن إذهب للتصميم سترى بأنه بإمكانك الكتابه في مكان الصوره مباشره وأصبحت كخلفيه :)

الأن اعمل نفس الطريقه السابقه في كل مكان تريده ان يكون خلفيه :) لتضع فيه الحقول
بعد ما تنتهي حدد المكان الذي ستضع فيه الحقل الأول ثم أضغط مرتين على الأدة TextBox

وهكذا لجميع الحقول
عند حقل نص الرساله أضف نفس الأداة السابقه ولكن عند Properties في خاصية TextMode أختر MultiLine ليكون متعدد الأسطر كم في الصوره

الأن جاء دور زر الإرسال , أضغط على الصوره مره واحده ثم أختر Source

إنسخ عنوان الصوره ثم إمسح التاق <img ..> كاملاً أو في صفحة التصميم اضغط على الصوره واضغط Delete

في مكان زر الإرسال أضف أداة ImageButton

ثم في الخيارات Properties في خاصية ImageUrl ألصق عنوان صورة الإرسال :)

الأن نريد أن نجعل الحقول متناسقه مع التصميم بحيث سنجعل حقل نص الرساله بدون إطارات , إتبع الصوره التاليه


الأن أصبح الحقل بدون حدود إطارات :)
هنا ستجد أن الحقل من اليسار إلى اليمين بحيث ان السكرول بار على اليمين ونريد أن نجعله على اليسار

في ال source أكتب في تاق td
dir="rtl"

لتجد أن السكرول بار أصبح على اليسار :)

الأن الحقول التي بسطر واحد مثل الاسم والبريد والعنوان يجب علينا تنسيقها , أتبع الصور التاليه



أختر لون الخلفيه Trasparent لتصبح شفافه :)

واعمل نفس الطريقه في باقي الحقول
الأن اضف Label جمب زر إرسال ليتم عرض النتيجه فيه :)

الأن أضغط مرتين على زر الإرسال ليضهر لك صفحة أكواد السي شارب

ثم تكتب هذا الكود كاملاً ليتم إرسال الرساله بالشكل الطبيعي , أرجوا أنك تراعي أسامي الحقول التي كتبتها في صفحة التصميم لكل حقل ID خاص به وهنا مكتوبه
SmtpClient smtpClient = new SmtpClient();
MailMessage message = new MailMessage();
try
{
MailAddress fromAddress = new MailAddress(txtEmail.Text, txtFrom.Text);
// You can specify the host name or ipaddress of your server
// Default in IIS will be localhost
smtpClient.Host = "localhost";
//Default port will be 25
smtpClient.Port = 25;
//From address will be given as a MailAddress Object
message.From = fromAddress;
// To address collection of MailAddress
message.To.Add(txtTo.Text);
message.Subject = txtSubject.Text;
//Body can be Html or text format
//Specify true if it is html message
message.IsBodyHtml = false;
// Message body content
message.Body = txtBody.Text;
// Send SMTP mail
smtpClient.Send(message);
lblStatus.Text = "تم إرسال الرساله بنجاح";
}
catch (Exception ex)
{
lblStatus.Text = "لم يتم إرسال الرساله , " + ex.Message;
}ويجب عليك في أعلى الصفحة تضيف هذا الكود وهو إستدعاء لباكج تبع البريد والإرسال
using System.Net.Mail;
والأن أرفع المشروع في سيرفر ASP لتقوم بتجربة النموذج ليتم إرسال الرساله بشكل سليم :)
الحمد لله إنتهى الدرس , أي إستفسارات انا موجود إن شاء الله تعالى
وأخيراً السلام عليكم ورحمة الله وبركاته
