آموزش پیشرفته ASP.Net Web Forms طراحی پنل مدیریت نوع خبر

به نام خدا. در جلسه پیشین ما برای فرم index نوع خبر (NewsType) ، یک header ایجاد کردیم و در سطر بعدی دو ستون ایجاد کردیم که در یکی از ستون ها List Group رو قرار میدادیم و در ستون دیگه گریدویو رو نمایش میدادیم.برای گریدیو مون یک دکمه برای ویرایش گذاشتیم که این دکمه روبروی هر سطر گریدویو gridview ، نمایش داده میشد.در این جلسه میخواهیم کدهای مربوط به دکمه ویرایش رو بنویسیم به این صورت که با کلیک کاربر روی دکمه ویرایش ، فرم (Action.aspx) شبیه به مودال دیالوگ (modal dialog box) باز میشه و کاربر میتونه یک رکورد رو حذف یا ویرایش کنه.برای اینکار ابتدا داخل asp:Content ای که متعلق به هدر (header) سایت هست ، داخل تگ اسکریپت (script) فانکشن جاواسکریپت زیر رو مینویسیم: function OpenPage(ID) { window.open("Actions.aspx?ID="+ID,"mypage","width=600,height=500,left=400"); } فانکشن بالا باعث میشه وقتی کاربر روی دکمه ویرایشی که مقابل هر رکورد گریدویو قرار داره ، کلیک کرد ، فرم Action.aspx بصورت یک پنجره مودال دیالوگ باز شه و آیدی (ID) رکورد مورد نظر بصورت یک پارامتر ورودی به فرم Action.aspx ارسال بشه تا کاربر بتون تو فرم Action.aspx رکورد مورد نظر رو حذف یا ویرایش کنه. قدم بعدی ما کدهای html css و بوت استرپ فرم Action.aspx رو مینویسیم.ابتدا وارد مسترپیج ActionMasterPage میشیم و بوت استرپ رو به مسترپیج مون اضافه میکنیم تا فقط با یکبار انجام این کار ، بوت استرپ در تمام فرم هایی که از فرم مسترپیج ارث بری میکنند در دسترس باشه.بنابراین بوت استرپ رو بالای asp:ContentPlaceHolder اضافه میکنیم چون اگر بوت استرپ رو پایین asp:ContentPlaceHolder اضافه کنید فقط خود مسترپیج میتونه از قابلیت های بوت استرپ استفاده کنه اما اگر بوت استرپ رو بالای asp:ContentPlaceHolder اضافه کنید علاوه بر خود مسترپیج ، تمام فرم هایی که از مسترپیج ارث بری میکنند نیز میتونن از قابلیت های بوت استرپ استفاده کنن.بعد از اینکه بوت استرپ رو به مسترپیج مون اضافه کردیم ، داخل قسمت body مسترپیج مون یک پنل از نوع panel-primary اضافه میکنیم.وارد فرم Action.aspx میشیم و داخل قسمت asp:Content مربوط به body ، داخل panel-primary یک input type="text" برای موع خبر قرار میدیم ، برای اینکه کاربر حنما مجبور باشه یک مقدار رو تو اینپوت باکس وارد کنه هم یک asp:RequiredFieldValidator هم استفاده میکنیم.سه تا asp:Button هم برای دکمه های جدید ، ویرایش و حذف اضافه میکنیم.با استفاده از تگ a یک دکمه هم برای بازگشت ایجاد میکنیم تا کاربر با کلیک روی اون باعث شه تا فرم Action.aspx بسته شه از این رو داخل asp:Content ای که متعلق به هدر (header) فرم Action.aspx هست ، داخل تگ اسکریپت (script) فانکشن جاواسکریپت زیر رو مینویسیم و در onclickتگ a فراخوانیش میکنیم: function ClosePage() { window.close(); window.opener.location.reload(); } کد بالا باعث میشه وقتی کاربر روی دکمه تگ a کلیک کرد ، فرم Action.aspx بسته شه و فرم قبلی یعنی فرم Index.aspx یکبار ریلود شود تا تغییرات صورت گرفته اعم از حذف یا ویرایش در فرم Index.aspx نیز اعمال شود.

• #تحصیلات_و_یادگیری
• #آموزش_modal_dialog_در_جاوا_اسکریپت
• #مودال_دیالوگ_در_aspnet
• #ساخت_پنجره_دیالوگ_در_aspnet
• #پنل_مدیریت_در_aspnet
• #آموزش_رایگان_aspnet