الإرشادات التفصيلية: إنشاء موقع ويب ذو Ajax ممكنة .

Visual Studio 2010

هذه الإرشادات التفصيلية بإنشاء موقع ويب ASP.NET أساسية مع صفحة ويب يوضح بعض ميزات مكتبة AJAX ASP.NET المضمنة في Visual Studio. سيتم إنشاء تطبيق عرض صفحات ببيانات الموظفين من قاعدة بيانات نموذج AdventureWorks. يستخدم التطبيقUpdatePanel تحكم لتحديث جزء فقط من الصفحة التي تم تغييرها، بدون فلاش الصفحة التي تحدث مع إعادة النشر. ويشار إلى ذلك باسم تحديث الصفحة جزئياً. يستخدم التطبيق عينة أيضاً UpdateProgress عنصر تحكم لعرض رسالة حالة أثناء معالجة تحديث الصفحة جزئياً.

لتنفيذ الإجراءات في بيئة التطوير الخاصة بك التي تحتاجها:

  • Microsoft Visual Studio 2005 أو Microsoft Visual Web Developer Express.

  • قاعدة بيانات نموذج AdventureWorks. يمكن تحميل قاعدة بيانات AdventureWorks وتثبيتها من مركز التنزيل لـ Microsoft. (ابحث عن "SQL Server 2005 نماذج و نماذج قواعد البيانات (ديسمبر ٢٠٠٦)").

إذا كنت قد قمت بالفعل بإنشاء موقع ويب في Visual Web Developer (على سبيل المثال، وذلك باتباع الخطوات المذكورة في الإرشادات التفصيلية: إنشاء صفحة ويب أساسية في ‏‫Visual Web Developer) ، يمكنك استخدام هذا الموقع ثم انتقل إلى الجزء التالي إنشاء صفحة رئيسية. وإلا، إنشاء موقع ويب جديد أو صفحة باتباع الخطوات التالية.

لإنشاء موقع ويب نظام الملفات

  1. فتحVisual Web Developer.

  2. On the File menu, click NewWeb Site.

    The موقع ويب جديديظهر مربع الحوار .

  3. ضمنتثبيت Visual Studio القوالب, click موقع ويب ASP.NET.

  4. في موقع ، أدخل اسم المجلد حيث تريد الحفاظ على صفحات موقع ويب الخاص بك.

    على سبيل المثال، اكتب اسم المجلد C:\WebSites.

  5. في اللغة ، انقر فوق لغة البرمجة التي كنت تفضل العمل.

  6. انقر فوق موافق.

    Visual Web Developer إنشاء صفحة جديدة باسم Default.aspx والمجلد.

بعد إنشاء موقع ويب إنشاء صفحة ويب ASP.NET اتصال يتضمن UpdatePanel عنصر التحكم. قبل إضافة UpdatePanel التحكم إلى الصفحة, يجب عليك إضافة ScriptManager عنصر التحكم. The UpdatePanel عنصر تحكم يستند ScriptManager تحكم لإدارة التحديثات الصفحة جزئياً.

لإنشاء صفحة ويب ASP.NET الجديدة

  1. في "مستكشف الحلول" انقر بزر الماوس الأيمن فوق اسم الموقع ومن ثم انقر فوق إضافة عنصر جديد.

    The إضافة عنصر جديديتم عرض مربع الحوار .

  2. ضمنتثبيت Visual Studio القوالب, select نموذج ويب.

  3. اسم صفحة جديدة Employees.aspx وامسح وضع رمز في ملف منفصل خانة الاختيار.

  4. حدد اللغة التي تريد استخدامها.

  5. انقر فوق إضافة.

  6. التبديل إلى طريقة العرض "تصميم".

  7. في ملحقات AJAX انقر نقراً مزدوجاً فوق علامة التبويب الأدوات، ScriptManager تحكم لإضافته إلى الصفحة.

    البرنامج التعليمي لـ UpdatePanel
  8. اسحبUpdatePanel التحكم في مربع الأدوات وأسقطه أسفل ScriptManager عنصر التحكم.

    البرنامج التعليمي لـ UpdatePanel

The UpdatePanel عنصر تحكم يقوم بإجراء تحديثات صفحات الجزئي ويعرّف المحتوى الذي يتم تحديثه بشكل مستقل عن باقي الصفحة. في هذا الجزء من الإرشادات التفصيلية تتم إضافة عنصر تحكم ربط البيانات التي تعرض البيانات من قاعدة بيانات AdventureWorks.

لإضافة محتوى إلى عنصر تحكم UpdatePanel

  1. من البيانات اسحب علامة تبويب الأدوات، GridView التحكم في منطقة قابلة للتحرير UpdatePanel عنصر التحكم.

  2. في مهام GridView القائمة انقر فوقتنسيق تلقائي.

  3. في تنسيق تلقائي لوحة ضمنتحديد نظام, select ملون ثم انقر فوقموافق.

  4. في مهام GridView القائمة حدد<مصدر بيانات جديد > from the اختر مصدر البيانات قائمة.

    The تكوين مصدر البياناتيتم عرض معالج .

  5. ضمنأين سيحصل التطبيق على البيانات من, select قاعدة البيانات ثم انقر فوقموافق.

  6. في تكوين مصدر البيانات معالج اختر اتصال البيانات الخاص بك الخطوة، بتكوين اتصال بقاعدة بيانات AdventureWorks ثم انقر فوق التالي.

  7. للحصول على تكوين تحديد كشف حساب الخطوة حددتحديد عبارة SQL مخصصة أو إجراء مخزن ثم انقر فوقالتالي.

  8. في حدد التبويب تعريف تقرير مخصص أو الإجراءات المخزّنة الخطوة قم بإدخال عبارة SQL التالية:

    SELECT FirstName, LastName FROM HumanResources.vEmployee ORDER BY LastName, FirstName
    
    
  9. انقر فوق Next.

  10. انقر فوق Finish.

  11. في مهام GridView القائمة حددتمكين ترحيل الصفحات خانة الاختيار.

  12. حفظ التغييرات ومن ثم اضغط CTRL + F5 لعرض الصفحة في مستعرض.

    لاحظ وجود لا وميض على الصفحة عند تحديد صفحات مختلفة من البيانات. وهذا لأن الصفحة لا تنفيذ إلى إعادة النشر ويتم تحديث الصفحة بالكامل في كل مرة.

The UpdateProgress يعرض عنصر التحكم رسالة حالة أثناء محتوى جديد UpdatePanel يتم الآن طلب التحكم.

لإضافة عنصر تحكم UpdateProgress إلى الصفحة

  1. من ملحقات AJAX اسحب علامة تبويب الأدوات، UpdateProgress التحكم إلى الصفحة وقم بإفلاته أسفل UpdatePanel عنصر التحكم.

  2. حددUpdateProgress التحكم في ثم في الإطار "خصائص" بتعيين AssociatedUpdatePanelID خاصية UpdatePanel1.

    وهذا يقوم بربط UpdateProgress التحكم مع UpdatePanel عنصر التحكم الذي قمت بإضافته سابقاً.

  3. في المنطقة القابلة للتحرير UpdateProgress عنصر تحكم نوع الحصول على الموظفين... .

  4. حفظ التغييرات ومن ثم اضغط CTRL + F5 لعرض الصفحة في مستعرض.

    إذا كان هناك أي تأخير بينما يتم تشغيل استعلام SQL الصفحة كما تقوم بإرجاع البيانات UpdateProgress يعرض الرسالة التي قمت بإدخالها في عنصر التحكم UpdateProgress عنصر التحكم.

إذا كان التطبيق الخاص بك يقوم بتحديث كل صفحة من البيانات بسرعة, قد لا تشاهد المحتوى UpdateProgress التحكم في الصفحة. The UpdateProgress يعتمد التحكم DisplayAfter يتم عرض الخصائص التي تتيح لك تعيين مهلة قبل عنصر التحكم. يؤدي ذلك إلى منع عنصر التحكم يومض في المستعرض في حالة حدوث التحديث لف سريع جداً. بشكل افتراضي، يتم تعيين التأخير إلى 500 ميلي ثانية (.5 ثانية) ، مما يعني التي UpdateProgress لن يتم عرض عنصر التحكم إذا كان التحديث وقتًا أقل من نصف ثانية.

في بيئة تطوير إضافة تأخير زائفة إلى التطبيق الخاص بك للتأكد من UpdateProgress يعمل عنصر التحكم بالشكل المطلوب. هذا هو خطوة اختيارية وهو فقط من أجل اختبار التطبيق الخاص بك.

لإضافة تأخير التطبيق عينة

  1. داخلUpdatePanel عنصر تحكم حدد GridView عنصر التحكم.

  2. في الإطار "خصائص" ، انقر فوق أحداث الزر.

  3. انقر نقراً مزدوجاً فوق PageIndexChanged حدث إنشاء معالج أحداث.

  4. قم بإضافة التعليمة البرمجية التالية إلى PageIndexChanged لإنشاء تأخير الثانية ثلاثة artificially معالج الأحداث:

    
    //Include three second delay for example only.
    System.Threading.Thread.Sleep(3000);
    
    
    
    ملاحظة ملاحظة

    معالج الخاص PageIndexChanged يقدم الحدث عن قصد تأخير هذه الإرشادات التفصيلية. في التدريب العملي عدم تقديم تأخير. بدلاً من ذلك، ستكون التأخير الناتج من حركة مرور الملقم أو رمز الخادم وقتاً طويلاً معالجة مثل استعلام قاعدة بيانات تشغيلها لفترة طويلة.

  5. حفظ التغييرات ومن ثم اضغط CTRL + F5 لعرض الصفحة في مستعرض.

    بسبب وجود الآن تأخير الثانية ثلاثة كل مرة يتم فيها الانتقال إلى صفحة جديدة من البيانات, ستكون قادراً على مشاهدة UpdateProgress عنصر التحكم.

إضافات المجتمع

إضافة
إظهار: