شروع آموزش های asp.net

[Payam.Hayati 15]

سلام

دوستان قبل از شروع درس ها لطفا" برنامه های زیر رو در سیستم به ترتیب نصب کنید :

1. SQL Server 2012 Enterprise

2. Visual Studio 2013

3. DW-Drean Weaver

دوستانی که می خواهند برنامه ها رو دانلود کنند،نسخه های Express مورد اول و دوم رو میتونید از سایت microsft و نسخه Free برنامه DW رو از اینجا دانلود کنید.

پیشنهاد می کنم با توجه به حجم برنامه ها آنها رو تهیه کنید.

-------------------------------------------------------------------------

توجه داشته باشید اگر از سرویس های آپاچی و CMS ها همچون جوملا استفاده می کنید با نصب برنامه های فوق IIS ویندوز و سایر سرویس های مورد نیاز ویندوزی به صورت اتوماتیک فعال خواهند شد و و اجازه فعالیت سرویس های آپاچی را نخواهند داد،البته راهکارهایی برای استفاده از هر دو هست.

-------------------------------------------------------------------------

در این آموزش ها فرض بر این است که کاربر C#,html,css را می داند.

اگر مدیران صلاح بدونند مشکلات کاربران در خصوص انجام پروژه در تایپیک دیگری ادامه پیدا کند اگر نه در همینجا پاسخگو هستم.

قصد آموزش سی شارپ رو ندارم اگر در فهم کدها مشکل داشتید بپرسید توضیح میدم،موارد کاربردی رو در قالب مثال به صورت آموزشی،تصویری قرار میدم.

ویرایش شده در تیر 93 توسط Payam.Hayati

[Payam.Hayati 15]

درس اول : معرفی محیط

پس از نصب برنامه آیکن اجرایی را در All Program پیدا کنید :

اولین بار که برنامه رو اجرا کنید پنجره زیر نمایش داده می شود،گزینه ابتدایی را انتخاب کنید :

برای ایجاد یک پروژه وب جدید تصاویر زیر را دنبال کنید :

بعد از ایجاد در قسمت Solution Explorer نام پروژه وب ایجاد شده و فایل Web.config را مشاهده خواهید کرد :

در تب Properties ویژگیها و امکاناتی برای ویرایش پروژه وب وجود دارد :

برای اضافه کردن یک صفحه وب (WebPage) بر روی نام پروژه کلیک راست می کنیم و مسیر را طبق تصاویر ادامه می دهیم :

به صورت پیشفرض نام صفحه وب Default هست :

نکته : اولویت در لود شدن صفحات با فایل Default می باشد ، مثلا" اگر شما دو فایل با نام های index.aspx و Default.aspx در پروژه یا هاست ویندوز داشته باشید اولویت با فایل Default.aspx می باشد،البته می توانید تنظیمات رو در IIS ویندوز و پنل هاست تغییر بدید که لزومی نمیبینم در آموزش ها مطرح بشه.

بعد از ایجاد وب فرم ، دو حالت نمایش وجود دارد Design که حالت گرافیکی هست و Source که حالت کد می باشد :

در سمت چپ برنامه --> Toolbox ابزارهای توسعه دهنده وب فرم در این قسمت قرار دارند :

برای اضافه کردن آیتم ها به حالت Design می رویم و با درگ کردن آیتم انتخابی آن را به پروژه اضافه می کنیم :

پایان درس اول

[Payam.Hayati 15]

درس دوم : نصب SQL Server

بنا به اهمیت درس دوم رو به مراحل نصب SQL Server پرداختم،به سادگی نصب سایر برنامه ها نیست و برای بار اول نیاز به راهنمایی دارد.

PDF آموزشی نصب SQL Server 2008.

نکته : تمامیه مراحل نصب برای ورژن 2012 نیز به همین شکل هست با این تفاوت که در زمان نصب در قسمت Server Configuration نیاز به ویریاش فیلدها همانند 2008 نیست ( Page 19 فایل PDF).

ویرایش شده در تیر 93 توسط Payam.Hayati

[Payam.Hayati 15]

درس سوم : MasterPage ( صفحه اصلی)

صفحات اصلی به شما اجازه می دهند ظاهر و ساختار یکسانی برای سایر صفحات و یا گروهی از صفحات به وجود آورید.

فرض کنید پروژه ای دریافت کرده اید که قرار است 10 وب فرم برای آن ایجاد شود ، دیزاین و تغییرات در قسمت های هدر و فوتر و در برخی قسمت های دیگر بسته به نوع پروژه و درخواست مشتری ثابت می باشد حال اگر بخواهیم برای تمامیه فایل ها کدهای این نواحی را کپی کنیم علاوه بر بالارفتن حجم کدها از نظر اشکال زدایی به مشکل برخورد خواهیم کرد ، به همین منظور از MasterPage ها یا صفحات اصلی استفاده می کنیم.

MasterPage باید قبل از اضافه کردن WebForm ها ایجاد شود.

ایجاد یک صفحه اصلی :

1.فعالسازی پنجره Solution Explorer.

2.کلیک راست بر روی نام پروژه و طی کردن مسیر زیر:

Add-->Master Page

بعد از ایجاد،کدهای این صفحه به نمایش در خواهد آمد ، کدهایی رو که نیاز داریم شامل :

کد خط اول :

<%@ Master Language="C#" AutoEventWireup="true" CodeFile="MasterPage.master.cs" Inherits="MasterPage" %>

که در آن را تغیری ایجاد نمی کنیم.

و کد میانی (خطوط 13-15) :

        <asp:ContentPlaceHolder id="ContentPlaceHolder1" runat="server">

       </asp:ContentPlaceHolder>

که آن را Cut کرده و درون یک Notepad ذخیره می کنیم.

ما بقی خطوط را حذف می کنیم.

حال کدهای قالب که همان فایل های html و css هستند را به پروژه بدین شکل اضافه می کنیم :

فایل Css قالب را کپی کنید ، بر روی نام پروژه کلیک راست و Paste کنید. (فایل Css شما به پروژه اضافه خواهد شد و در پنجره Solution Explorer می توانید آن را مشاهده کنید).

کدهای فایل html قالب رو کپی و در فایل MasterPage ایجاد شده بعد از خط اول Paste کنید.

برای اینکه بتوانید تغییرات مورد نظر رو انجام بدید کدهایی را که در Notepad ذخیره کرده بودیم در داخل کلاس مربوط html قرار می دهیم :

بدین شکل قسمت مورد نظر قابل ویرایش می شود، برای اینکه بتوان خروجی را مشاهده کرد باید یک وب فرم با تابعیت MasterPage ساخته شده ایجاد کرد،زیرا MasterPage بدون وب فرم کارآیی ندارد و قابل اجرا نیست.

برای اضافه کردن یک وب فرم با تابعیت MasterPage بعد از کلیک راست بر روی نام پروژ ، Add new Item و WebForm همانند تصویر عمل می کنیم :

نتیجه در خروجی :

قسمت هایی که در آن آیکن دست (ایست) وجود دارد قابل ویرایش نیست و فقط قسمتی رو که با خط سبز مشخص شده است می توان ویرایش کرد.

تمرین :

یک قالب html طراحی کنید که شامل Header ، Content و Footer باشد ، آن را به پروژه وب خود با تابعیت MasterPage اضافه کنید و قسمت های Header و Footer را قابل ویرایش کنید.

[Vahid Taheri 74]

با تشکر فراوان از شما بخاطر این حرکت زیبا :25:

تاپیک "سوالات و مشکلات پیرامون زبان برنامه نویسی asp.net" برای طرح سوالات پیرامون این تاپیک ایجاد شد.

تاپیک مهم شد

برچسب آموزش به تاپیک اضافه شد

اگر پستی رو خواتسید به تاپیک سوالات و مشکلات منتقل کنید ، به بنده یا یکی از مدیران بگید تا انجام بدیم و کاربران بتونند به راحتی از این تاپیک نهایت بهره رو ببرند.

موفق باشید

[Payam.Hayati 15]

درس چهارم : نمایش تاریخ شمسی

برای نمایش تاریخ شمسی باید کلاس Globalization را به کلاس های موجود اضاف کنیم ، 2 تا label به فرم اضافه کنید ، وارد قسمت کدنویسی سی شارپ شوید (هر وب فرمی که ایجاد می کنید یک فایل سی سارپ با آن ایجاد می شود که در زیر مجموعه آن قرار می گیرد).

کلاس Globalization را به سایر کلاس ها اضافه می کنیم :

using System.Globalization;

در رویداد Page_load کدهای زیر را می نویسیم :

        PersianCalendar p = new PersianCalendar();
       Label1.Text = p.GetYear(DateTime.Now) + "/" + p.GetMonth(DateTime.Now) + "/" + p.GetDayOfMonth(DateTime.Now);

       Label2.Text = DateTime.Now.ToLongTimeString();

نتیجه در خروجی :

تمرین :

یک وب فرم ایجاد کنید و مراحل گفته شده را انجام دهید.

[Payam.Hayati 15]

درس پنجم : استفاده از MessageBox

به صورت پیشفرض امکان نمایش MessageBox در پروژه های وب وجود ندارد برای اضافه کردن آن باید مراحل زیر را انجام دهیم :

برای استفاده از Reference ایجاد شده باید کلاس آن را به سایر کلاس ها در وب فرم اضافه کنیم :

using System.Windows.Forms;

کد نمایش MessageBox را در قسمت موردنظر وارد می کنیم :

 MessageBox.Show("محتوای پنجره","عنوان",MessageBoxButtons.OK,MessageBoxIcon.Hand);

من اینجا در load_form قرار دادم شما میتونید یک Button رو به فرم اضافه کنید بر روی آن دابل کلیک کنید و کد رو بنویسید یا بر روی سایر ابزارها.

نتیجه در خروجی :

تمرین :

یک وب فرم ایجاد کنید یک button به فرم اضافه کنید و مراحل فوق را انجام دهید ، سایر حالت های نمایش MessageBox را جستجو و در پروژه اعمال کنید.

[Payam.Hayati 15]

درس ششم : حرک بین صفحات

برای حرکت از یک صفحه به صفحات دیگر می توان از ابزارهای Hyperlink و image استفاده کرد کافیه اونها رو صفحه خود انتقال بدیم در قسمت Properies آدرس-url را برابر صفحه هدف تنظیم کنیم،اما اگر بخواهیم از سایر ابزارها استفاده کنیم مثلا" دکمه از کد زیر استفاده می کنیم :

 Response.Redirect("Default.aspx");

تمرین :

پروژه ای ایجاد کنید که شامل سه وب فرم باشد که از یک MasterPage استفاده می کنند،بر روی هر وب فرم دکمه های حرکت به سایر وب فرم ها را ایجاد کنید.

[Payam.Hayati 15]

درس هفتم : ایجاد بانک اطلاعاتی و جدول در SQL

برنامه SQL Server رو باز کنید (گاهی هنگام اتصال - Connect با پیام خطا و عدم اتصال مواجه می شوید ، برای حل این مشکل اینجا رو ببینید).

بعد از Connect شدن در سمت چپ بر روی پوشه Databases کلیک راست کنید و New Database را انتخاب کنید :

در پنجره باز باید یک نام برای دیتابیس انتخاب کنید در اینجا من نام دیتابیس را Bingo قرار دادم،مسیر ذخیره سازی بانک های اطلاعاتی در قسمت Path قابل مشاهده می باشد :

پس از ایجاد نام بانک اطلاعاتی ایجاد شده در لیست قابل مشاهده است ( اگر مشاهده نکردید با کلید F5 قسمت مربوطه رو refresh کنید).

می خواهیم جدولی رو به بانک اطلاعاتی اضافه کنیم ، مسیر تصویر :

فیلدها و نوع داده ای آن را در جدول ایجاد می کنیم سپس جدول را ذخیره می کنیم (Ctrl+s) نام پیشفرض برای ذخیره جدول Table_1 می باشد آن را قبول می کنیم :

حال فیلد b_id را می خواهیم به عنوان کلید اصلی در جدول تعیین کنیم روی آن کلیک راست می کنیم و گزینه Set Primary Ket را انتخاب می کنیم :

سپس در قسمت Column Properies قسمت Identity Specification مقدار Is Indentity را برابر Yes قرار میدیم این کار به این علت است که به صورت اتوماتیک مقدار b_id از عدد یک شروع شده و با هر بار اضافه شدن یک رکورد از اظلاعات مقدار آن نیز افزایش پیدا می کنید در واقع حکم عنوان ردیف را در جدول بازی می کند.

برای نمایش و ویرایش محتوای فیلدهای ایجاد شده در جدول بر روی نام جدول کلیک راست می کنیم و آیتم Edit Top 200 Rows را انتخاب می کنیم :

نکته : نباید به b_id مقداری دهید این فیلد بر اساس توضیحات و تنظیمات موارد فوق به صورت اتوماتیک مقدار می گیرد.

تمرین-1 : در مورد نوع های داده ای در SQL تحقیق کنید.

تمرین-2 : یک بانک اطلاعاتی با مشخصات آموزش داده شده ایجاد کنید.

در درس بعدی نحوه درج اطلاعات در بانک اظلاعاتی و جدول ساخته شده در این مثال را توضیح خواهم داد.

[Payam.Hayati 15]

درس هشتم : دریافت اطلاعات از کاربر از طریق فرم و ثبت آن در جدول بانک اطلاعاتی

در درس قبلی (هفتم) نحوه ساخت بانک اطلاعاتی ، جدول و ایجاد کلید اصلی رو فراگرفتیم،حال می خواهیم فرمی در پروژه ایجاد کنیم که اطلاعات وارد شده در فیلدهای فرم را دریافت و در جدول بان اطلاعاتی ایجاد شده ذخیره کند.

راه های مختلفی برای اتصال بانک اطلاعاتی به برنامه وجود دارد که معمولا به خاطر راحتی کار دانشجویان از مراحل wizard خود VisualStudio استفاده می کنند،اما wizard قدرت مانور را از برنامه نویس می گیرد،من کلاسی رو نوشتم که بعد از اضافه کردن آن به پروژه به راحتی می توانیم با بانک اطلاعاتی رابطه برقرار کنیم ، همچنین در این روش در کاهش حجم کوئری های را خواهیم داشت.

آموزش رو مرحله به مرحله با هم جلو میریم :

مرحله اول :

یک پروژه وب جدید ایجاد کنید و آیتم ها رو مطابق تصویر در وب فرم قرار بدید،آیتم جدید GridView می باشد که در Toolbox تب Data وجود دارد :

مرحله دوم :

یک پوشه App_Code به پروژه اضافه کنید،برای این کار بر روی نام پروژه کلیک راست می کنیم و مسیر زیر را دنبال می کنیم :

Add-->Add ASP.Net Folder-->App_Code

بعد از ایجاد پوشه فایل کلاس رو داخلش کپی می کنیم،دریافت فایل کلاس

مرحله سوم :

بر روی دکمه دابل کلیک می کنیم،در قسمت نام کلاس ها دستور استفاده از کلاس نوشته شده در برنامه رو قرار میدیم :

using sql;

در رویداد کلیک دکمه کدهای زیر را می نویسیم :

sqlserver sqls = new sqlserver(".", "Bingo");

       sqls.update("insert into Table_1 values('" + TextBox1.Text + "','" + TextBox2.Text + "','" + TextBox3.Text + "','" + TextBox4.Text + "')");
       GridView1.DataSource = sqls.select("select * from Table_1");
       GridView1.DataBind();

تصویر :

حالا پروژه رو اجرا و تست کنید،نتیجه :

نکته :

1. اگر در کوئری نوشتن اشتباهی به وجود بیاد برنامه از کلاس نوشته شده خطا می گیرد ، این رو بدونید که مشکل از کوئری های نوشته شده شما در برنامست،کلاسی رو که نوشتم بارها در پروژه ها ازش استفاده کرده ام و هم اکنون هم استفاده می کنم 100% بدون مشکل هست.

2.برای نمایش محتوای دریافت شده در جدول بانک اطلاعاتی بعد از ثبت یک بار با کلیدهای Ctrl+R جدول را Refresh کنید :

تمرین :

با استفاده از MastrPage و کدهای HTML,CSS یک فرم زیبا طراحی کنید و تمامیه مراحل فوق رو در قالب یک پروژه ایجاد و نتیجه کار رو ببینید.

[Payam.Hayati 15]

درس نهم : نمایش محتویات جدول در ابزارهای label و TextBox

با ذکر یک مثال شروع می کنیم،یک بانک اطلاعاتی به نام Test ایجاد کردم و یک جدول به نام Table_1 درون آن قرار دادم،ستون ها و رکوردهای جدول :

این هم وب فرم ایجاد شده که شامل یک label ، یک TextBox و یک Button می باشد :

کدهایی که باید درون رویداد کلیک Button نوشته شود + کلاس هایی که به فرم اضافه می شوند :

نتیجه در خروجی :

توضیحات :

در رویداد کلیک بعد از خط اول که مربوط به کانکشن بانک اطلاعاتی هست،در خط دو یک جدول داده ساخنم که اسمش رو dt گذاشتم ، مقدارش هم تمام رکوردهای جدولمون.

در خط سوم به label مقداری برابر انتخاب های کل محتویات جدول به شرط اینکه ردیف رکورد آن صفر باشد و نام ستون برابر name باشد.

خط چهارم همانند خط سوم می باشد با این تفاوت که شماره ردیف رکورد و ابزار نمایش تغییر کرده است.(نمایش در TextBox).

نکته :

ردیف رکورد همانطور که در تصویر اول مشخص شده است از صفر شروع می شود.

تمرین

1.مثال نامبرده شده در آموزش را پیاده سازی کنید.

2.نحوه نمایش اطاعات جدول بانک اطلاعاتی را در سایر ابزارها همچون Dropdown بیابید و به صورت عملی تمرین کنید.

[Payam.Hayati 15]

درس دهم : استفاده از ViewState در قالب یک مثال (شمارش تعداد دانلود و یا کلیک های کاربر) :

یک button و یک label به فرم خودتون اضافه کنید :

<%@ Page Language="C#" AutoEventWireup="true" CodeFile="Default.aspx.cs" Inherits="_Default" %>

<!DOCTYPE html>

<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
   <title></title>
</head>
<body>
   <form id="form1" runat="server">
   <div>
       <asp:Button ID="Button1" runat="server" Text="Button" OnClick="Button1_Click" />
       <asp:Label ID="Label1" runat="server" Text="Label"></asp:Label>
   </div>
   </form>
</body>
</html>

بر روی button دابل کلیک کنید و کدهای زیر را در آن قرار بدید :

       int counter;
       if (ViewState["Counter"]==null)
       {
           counter = 1;
       }
       else
       {
           counter = (int)ViewState["Counter"] + 1;
       }
       ViewState["Counter"] = counter;
       Label1.Text = "Counter: " + counter.ToString();}

نتیجه در خروجی :

[ATTACH=CONFIG]7568[/ATTACH]

توضیحات :

ViewState یکی از رایج ترین مکان ها برای ذخیره سازی اطلاعات به کار می رود.

یکی از بزرگترین محدودیت های ViewState این است که تنها در یک صفحه قابل استفاده بوده و اطلاعاتی که در آن قرار می دیم تنها در همان صفحه حفظ می شود.در صورت نیاز به انتقال اطلاعات از متدهای QueryString استفاده می کنیم.(در درس های آینده توضیح خواهم داد).

در کدها ابتدا یک متغیر از نوع شمارشی یا int تعریف شده در مرحله بعدی آن را در ViewState قرار دادیم و مقدار خالی بودن آن را (null) بررسی کردیم که اگر خالی باشد (صفر باشد) مقدار 1 در آن قرار بگیرید در غیر این صورت 1 واحد به آن اضافه شود ، در نهایت خروجی در یک برچسب (label) بعد از هر کلیک بر روی دکمه نمایش داده شود.

تمرین :

- مثال نامبرده شده را پیاده سازی کنید.

- یک مجموعه نرم افزارهای کاربردی جهت دانلود ایجاد کنید و برای هر برنامه یک button قرار بدید که با کلیک بر روی آن ها تعداد دانلودها در برچسب نمایش داده شود.

[hamid80 10]

سلام اموزش ها ادامه داره یا تمام شده ؟

[particular 15]

آموزش ها متاسفانه ادمه نداشت . اما من توصیه میکنم

[h=2]آموزش مدل ASP.Net MVC[/h]رو یاد بگیرید .

[Payam.Hayati 15]

سلام عزیزان سعی می کنم آموزش ها رو ادامه بدم به خاطر تاخیر در روند آموزش پوزش می خواهم.

در مورد تکنولوژی MVC دوستان می توانند فیلم های آموزشی تهیه شده در نت توسط گروه های مختلف را مشاهده کنند از جمله این سایت(فیلم ها رایگان می باشند).

ابتدا به یک سوال که ممکن هست الآن در ذهن خیلی ها پیش آمده باشد جواب دهم.

1.ASP.NET WebForm یا ASP.NET MVC؟

اسکات گاتری یکی از مسئولین بلند پایه مایکروسافت در این باره می گوید :

" Different customers look for different programming approaches, and a lot love WebForms and think it is great.

Others love MVC and think it is great.That is why we are investing in both."

همه چیز بستگی به مشتری دارد که کدام یک از اینها بهتر هست هر طراح و برنامه نویس تمایلات خود را برای اجرا و پیاده سازی پروژه دارد و روش خود را دنبال می کند.خیلی ها وب فرم رو فکر می کنند عالی هست خیلی های دیگر بر این عقیده اند که MVC بهتر است.به همین خاطر هست که مایکروسافت هر دو تکنولوژی را گسترش می دهد.

متاسفانه در سایت های فارسی زبان من فقط مزایای MVC رو نسبت به WebForm دیدم.نمی خواهم وارد مقایسه شوم هر شخص بسته به علاقه می تواند راه خود را انتخاب کند.

2.برای یادگیری MVC اگر از قبل WebForm کار کرده باشیم سریعتر آن را فرا خواهیم گرفت؟

خیر،ساختار MVC کاملا" با WebForm متفاوت هست و یادگیری هر کدام شما را در یادگیری دیگری کمک نخواهد کرد ، جزء زبان برنامه نویسی مشترک که اغلب C# می باشد.

3.استخدامی ها و بازار کدام بیشتر است؟

در ایران شرکت ها برای استخدام ، تقریبا" تمامیه تخصص های روز را از شما طلب می کنند ، 2 هفته یا یک ماه به صورت آزمایشی از شما کار می کشند در نهایت اگر ببینند بیشتر از پولی که به شما می دهند سود نصیبشان می شود با حداقل شرایط شما را در قراردادهای کوتاه مدت استعمار می کنند.

اینکه هر دو را یا بگیرید بد نیست اما پیشنهاد می کنم زمانی که حرفه ای شدید کسب و کار خودتان را راه اندازی کنید یا در شرکت های شناخته شده و دارای شرایط مناسب مشغول به کار بشید.

[Payam.Hayati 15]

درس یازدهم : استفاده از کیبورد مجازی

مزایا و معایب کیبورد مجازی رو در نت می تونید دنبال کنید من مستقیم میرم سر اصل مطلب.

این بسته رو دانلود کنید.

بسته رو از حالت فشرده خارج کنید، شامل فایل های زیر است :

[ATTACH=CONFIG]9218[/ATTACH]

در برنامه ویژوال همانند دروس قبلی یک پروژه سایت خالی ایجاد و یک وب فرم به پروژه اضافه کنید و فایل های پوشه virtual keyboard رو در قسمت Solution کپی کنید :

[ATTACH=CONFIG]9219[/ATTACH]

در قسمت CodeDesign وارد سورس شوید و در قسمت head کدها ر همانند تصویر بنویسید :

[ATTACH=CONFIG]9220[/ATTACH]

از طریق ابزار ToolBox یک دکمه به فرم اضافه کنید ، در نهایت کدهای شما همانند تصویر زیر خواهد بود:

[ATTACH]9221[/ATTACH]

نتیجه در خروجی :

[ATTACH=CONFIG]9222[/ATTACH]

تمرین :

- مثال نامبرده شده را پیاده سازی کنید و مقادیر وارد شده را به کمک دروس پیشین در جدول بانک اطلاعاتی ذخیره کنید ، سپس اطلاعات ذخیره شده را در ابزار GrideView به نمایش در بیاورید.

[Payam.Hayati 15]

درس دوازدهم : Ajax

در Net. ابزاری برای برنامه نویسان قرار گرفته است که بدون درگیر شدن مسقیم با کدها می توانند از این تکنولوژی در صفحات وب خود استفاده کنند ، اینکه Ajax چیست را می توانید در نت جستجو کنید اما در یک تعریف کلی و خلاصه Ajax ما را قادر می سازد تا بخش هایی از صفحه را بدون بارگذاری کل صفحه (refresh) به روز رسانی کنیم.

یک پرژوه وب جدید ایجاد و یک وب فرم در آن قرار بدید.

وب فرم را به حالت Design ببرید ، در قسمت ToolBox بخش Ajax Extensions آیتم Script Manager را با بالاترین نقطه وب فرم درگ کنید ، این Script برای اجرای موارد Ajax الزامی می باشد.

[ATTACH]9224[/ATTACH]

نکته : اگر از MasterPage در پروژه استفاده می کنید با اضافه کردن ScriptManager به آن تمامیه صفحات زیر مجموعه آن را به ارث می برند و دیگر نیاز نیست به هر وب فرم آن را اضافه کنیم.

حال نوبت به اضافه کردن UpdatePanel می باشد ، تمامیه محتوایی را که می خواهیم از تکنولوژی Ajax برای آنها استفاده کنیم در این پنل قرار می دهیم.

[ATTACH]9225[/ATTACH]

در UpdatePanel یک TextBox ، Label و Button قرار بدید.

[ATTACH]9226[/ATTACH]

سپس بر روی Button دابل کلیک کنید ، کد زیر را در رویداد Button بنویسید.

Label1.Text = TextBox1.Text;

حال برنامه را اجرا کنید ، با وارد کردن محتوا در TextBox و کلیک بر روی Button محتوای TextBox در Label نمایش داده می شود.آگردقت کنید این کار بدون بازسازی (Refresh) صفحه وب ما انجام می شود.

[ATTACH=CONFIG]9227[/ATTACH]

تمرین : مثال فوق را یک بار با ابزارهای Ajax و یک بار بدون آن ایجاد و نتیجه را بررسی کنید.

فایل تمرین پیوست شد.

موفق باشید.

[Payam.Hayati 15]

درس دوازدهم : بارگزاری (Upload) تصویر و نمایش آن در ابزار Image

یک پروژه وب جدید ایجاد کنید و یک پوشه به نام img_agahi در آن ایجاد کنید سپس یک وب فرم به پروژه اضافه کنید و ابزارهای زیر را در آن قرار بدید:

file upload,image,button

[ATTACH=CONFIG]9230[/ATTACH]

بر روی دکمه send دابل کلیک کنید و کدهای زیر را بنویسید :

string patch1 = "";
       if (FileUpload1.HasFile && FileUpload1.PostedFile.ContentLength < 512000)
       {
           string filename1 = FileUpload1.FileName;
           FileUpload1.PostedFile.SaveAs(Server.MapPath("~\\img_agahi\\" + filename1));
           patch1 = "~\\img_agahi\\" + filename1;
Image1.ImageUrl = patch1;
       }

در شرط بررسی کردیم اگر فایلی برای آپلود وجود داشته باشد که اندازه آن کمتر از 512 کیلوبایت باشد دستورات درون شرط اجرا شوند ، درون شرط نام و آدرس فایل را گرفته ایم و به ابزار Image داده ایم تا تصویر را نمایش دهد.

نتیجه :

[ATTACH]9231[/ATTACH]

[Payam.Hayati 15]

این درس از اهمیت زیادی برخوردار هست پیشنهاد می کنم با دقت مطالب را دنبال کنید.(این آموزش از تجربیات بنده حقیر هست که در هیچ منبع آموزشی فارسی زبان رایگان حال حاضر وجود ندارد.)

درس سیزدهم : ساخت یک CMS ( ذخیره تصاویر در پوشه و بانک اطلاعاتی و نمایش آنها )

در پروژه ها اغلب ما فقط نام تصویر را در بانک ذخیره می کنم و خود تصویر را در پوشه ای مشخص بارگذاری می کنیم به این خاطر که ذخیره کردن تصاویرباعث می شود در یک مدت کوتاه حجم دیتابیس بالا رود و باعث کندی در روند پردازش ها شود.

فقط در سایت هایی که تصاویر از نظر امنیتی مهم و تعداد آنها نیز اندک می باشد می توانیم تصاویر را از طریق روش باینری در بانک ذخیره کنیم. (اگر عمری بود آموزش این روش را هم قرار خواهم داد).

در این پروژه قرار است ما از طریق صفحه مدیریت یک تصویر را بارگذاری (آپلود) کنیم ، نام تصویر را در بانک ذخیره می کنیم و محل فیزیکی تصویر را در پوشه ای تعیین می کنیم ، سپس تصویر بارگذاری شده را در صفحه اصلی سایت نمایش می دهیم.

کاربرد :

فرض کنید یک سایت دارید که در آن یک بنر تبلیغاتی یا هدر وجود دارد می خواهید از طریق صفحه مدیریت تصویر را تغییر دهید همانند یک CMS که دارای پنل مدیریت می باشد و تغییرات محتوا در سایت از طریق آن انجام می شود، همانند جوملا!.

شروع کار :

- یک پروژه وب ایجاد کنید.

- دو وب فرم به نام های Admin,Default به پروژه اضافه کنید.

- پوشه ای به نام img_agahi در پروژه بسازید.

- یک بانک اطلاعاتی به نام Agahi در SQL ایجاد کنید که شامل یک جدول با نام Table_1 با فیلدهای a_id,a_img باشد ، فیلد a_id را به عنوان کلید اصلی در نظر بگیرید و مقدار Identity آن در Properties را Yes کنید.نوع داده ای فیلد a_id را int و فیلد a_img را nvarchar(100) در نظر بگیرید.(در دروس قبل آموزش داده شده است).

[ATTACH]9236[/ATTACH]

یک ساختار ساده با Css ایجاد کردم برای صفحه اصلی که در آن یک لینک برای رفتن به صفحه مدیریت و یک باکس برای نمایش تصویر قرار داده ام :

صفحه مدیریت همانند درس قبل هست با این تفاوت که لینک به صفحه اصلی هم درآن قرار دارد (Admin.aspx) :

وارد قسمت کدنویسی سی شارپ (CodeBehind) صفحه Admin.aspx می شویم ، کلاس های زیر را به page اضافه می کنیم:

using System.Data.SqlClient;
using System.IO;

کلاس اول برای استفاده از توابع کتابخانه ای بانک اطلاعاتی SQL و کلاس دوم برای فایل های ورود و خروجی هست که ما در اینجا برای ابزار Upload به آن نیاز داریم.

در بالای رویداد Page_Load این قطعه کد را بنویسید :

SqlConnection con = new SqlConnection("Data Source=localhost; Initial Catalog=Agahi; Integrated Security=TRUE ");

در محیط دیزاین صفحه ادمین بر روی دکمه send دابل کلیک کنید و کدهای زیر را بنویسید :

//تعریف یک متغیر جهت ذخیره سازی نام تصویر
       string filename1 = "";
       //بررسی مجود بودن تصویر برای بارگذاری و اینکه حجم آن بالای 512 کیلو بایت نباشد ، اگر شرط برقرار بود نام فایل را در متغیر و تصویر را در پوشه نامبرده شده ذخیره کند
       if (FileUpload1.HasFile && FileUpload1.PostedFile.ContentLength < 512000)
       {
           filename1 = FileUpload1.FileName;
           FileUpload1.PostedFile.SaveAs(Server.MapPath("~\\img_agahi\\" + filename1));
       }


       //باز کردن کانکشن بان اطلاعاتی ک در بالا تعریف شده است
       con.Open();
       //نوشتن کوئری جهت ذخیره سازی نام تصویر از متغیر در فیلد جدول
       string Query = "insert into Table_1 (a_img) values ('" + filename1 + "') ";
       //اجرای کوئری
       SqlCommand com = new SqlCommand(Query, con);
       com.ExecuteNonQuery();
       //بستن کانکشن
       con.Close();
       //نمایش تصویر ذخیره شده در ابزار iamge 
       //آدرس فیزیکی تصویر را به صورت دستی داده ایم و نام را از بانک اطلاعاتی می خوانیم
       Image1.ImageUrl = @"\img_agahi\" + filename1;
       //قطعه کد ترکیبی جاوا اسکریپت جهت نمایش پیغام تصویر ذخیره شد
       Page.ClientScript.RegisterClientScriptBlock(typeof(Page), "Alert", "alert('تصویر ذخیره شد.')", true);

در نهایت کدهای ما به شکل زیر خواهد بود:

using System;
using System.Collections.Generic;
using System.Linq;
using System.Web;
using System.Web.UI;
using System.Web.UI.WebControls;
using System.Data.SqlClient;
using System.IO;

public partial class Admin : System.Web.UI.Page
{

   SqlConnection con = new SqlConnection("Data Source=localhost; Initial Catalog=Agahi; Integrated Security=TRUE ");


   protected void Page_Load(object sender, EventArgs e)
   {

   }
   protected void Send_Click(object sender, EventArgs e)
   {
       //تعریف یک متغیر جهت ذخیره سازی نام تصویر
       string filename1 = "";
       //بررسی مجود بودن تصویر برای بارگذاری و اینکه حجم آن بالای 512 کیلو بایت نباشد ، اگر شرط برقرار بود نام فایل را در متغیر و تصویر را در پوشه نامبرده شده ذخیره کند
       if (FileUpload1.HasFile && FileUpload1.PostedFile.ContentLength < 512000)
       {
           filename1 = FileUpload1.FileName;
           FileUpload1.PostedFile.SaveAs(Server.MapPath("~\\img_agahi\\" + filename1));
       }


       //باز کردن کانکشن بان اطلاعاتی ک در بالا تعریف شده است
       con.Open();
       //نوشتن کوئری جهت ذخیره سازی نام تصویر از متغیر در فیلد جدول
       string Query = "insert into Table_1 (a_img) values ('" + filename1 + "') ";
       //اجرای کوئری
       SqlCommand com = new SqlCommand(Query, con);
       com.ExecuteNonQuery();
       //بستن کانکشن
       con.Close();
       //نمایش تصویر ذخیره شده در ابزار iamge 
       //آدرس فیزیکی تصویر را به صورت دستی داده ایم و نام را از بانک اطلاعاتی می خوانیم
       Image1.ImageUrl = @"\img_agahi\" + filename1;
       //قطعه کد ترکیبی جاوا اسکریپت جهت نمایش پیغام تصویر ذخیره شد
       Page.ClientScript.RegisterClientScriptBlock(typeof(Page), "Alert", "alert('تصویر ذخیره شد.')", true);

   }
}

حال به صفحه اصلی یا Default.aspx می رویم وارد قسمت کدنویسی سی شارپ می شویم کلاس های زیر را به صفحه اضافه می کنیم :

using System.Data.SqlClient;
using System.IO;
using System.Data;

در بالای رویداد Page_Load این قطعه کد را بنویسید :

SqlConnection con = new SqlConnection("Data Source=localhost; Initial Catalog=Agahi; Integrated Security=TRUE ");

در رویداد Page_Load این صفحه کدهای زیر را می نویسیم :

con.Open();
       //کوئری انتخاب آخرین رکورد ثبت شده در جدول
       SqlDataAdapter da = new SqlDataAdapter("SELECT TOP 1 a_img FROM Table_1 ORDER BY a_id DESC;", con);
       //دیتاست را یک جدول مجازی در نظر بگیرید ما اینجا از کلاس دیتاست یک شی یا جدول به نام دی اس ساختیم
       DataSet ds = new DataSet();
       //جدول مجازی ساخته شده را پر می کنیم با کوئری نوشته شده در دی ا(da)
       //نام جدول مجازی را temp قرار دادم
       da.Fill(ds, "Temp");
       con.Close();
       //بررسی می کنم آیا رکوردی وجود دارد یا خیر
       if (ds.Tables[0].Rows.Count > 0)
       {
           //مسیر رو که دستی وارد کردیم نام تصویر رو هم از جدول مجازی به صورت زیر پیدا می کنیم و به مسیر متصل می کنیم
           //نمایش تصویر در ابزار image
           Image1.ImageUrl = @"\img_agahi\" + ds.Tables[0].Rows[0][0].ToString();
       }

در نهایت کدهای ما در این صفحه به صورت زیر خواهد بود :

using System;
using System.Collections.Generic;
using System.Linq;
using System.Web;
using System.Web.UI;
using System.Web.UI.WebControls;
using System.Data.SqlClient;
using System.IO;
using System.Data;

public partial class _Default : System.Web.UI.Page
{
   SqlConnection con = new SqlConnection("Data Source=localhost; Initial Catalog=Agahi; Integrated Security=TRUE ");
   protected void Page_Load(object sender, EventArgs e)
   {
       con.Open();
       //کوئری انتخاب آخرین رکورد ثبت شده در جدول
       SqlDataAdapter da = new SqlDataAdapter("SELECT TOP 1 a_img FROM Table_1 ORDER BY a_id DESC;", con);
       //دیتاست را یک جدول مجازی در نظر بگیرید ما اینجا از کلاس دیتاست یک شی یا جدول به نام دی اس ساختیم
       DataSet ds = new DataSet();
       //جدول مجازی ساخته شده را پر می کنیم با کوئری نوشته شده در دی ا(da)
       //نام جدول مجازی را temp قرار دادم
       da.Fill(ds, "Temp");
       con.Close();
       //بررسی می کنم آیا رکوردی وجود دارد یا خیر
       if (ds.Tables[0].Rows.Count > 0)
       {
           //مسیر رو که دستی وارد کردیم نام تصویر رو هم از جدول مجازی به صورت زیر پیدا می کنیم و به مسیر متصل می کنیم
           //نمایش تصویر در ابزار image
           Image1.ImageUrl = @"\img_agahi\" + ds.Tables[0].Rows[0][0].ToString();
       }

   }
}

پروژه را اجرا کنید و نتیجه را ببینید :

تمرین :

این پروژه را در خانه پیاده سازی کنید ، یعی کنید کدها را به جای کپی کردن بنویسید.

حتمن برای شما سوال پیش آمده که این چه صفحه مدیریتی هست که همه می توانند دسترسی داشته باشند!در درس بعد با اضافه کردن صفحه لاگین برای ورود به مدیریت پروژه را کاملتر می کنیم.

التماس دعا.

[yummy 10]

با سلام و احترام

چطور می توانیم اطلاعات خودمون را از طریق web servise مربوط به asp.net روی سایت جوملایی نمایش بدیم؟می تونیم از طریق api این کارو انجام بدیم؟ افزونه ای در جوملا وجود داره برای این موضوع؟

[saber 208]

در در 5/20/2022 در 23:30، yummy گفته است :

با سلام و احترام

چطور می توانیم اطلاعات خودمون را از طریق web servise مربوط به asp.net روی سایت جوملایی نمایش بدیم؟می تونیم از طریق api این کارو انجام بدیم؟ افزونه ای در جوملا وجود داره برای این موضوع؟

از طریق api میتونید انجام بدید توی تاپیک خودتون هم پاسخ دادم سوالی داشتید توی اون تاپیک پیگیری کنید