مقدمه :
در اين مقاله قصد دارم به چگونگي تازه سازي ( Refresh ) يک صفحه والد ( Parent ) توسط يک صفحه فرزند ( Child ) بپردازم.
موضوع اين مقاله در حقيقت يک تکنيک مي باشد که شما بايد با توجه به نيازتان در برنامه هاي کاربردي خود ، آن را سفارشي سازي نماييد.
در ادامه به تشريح چگونگي تازه سازي يک صفحه والد توسط صفحه فرزند ، با استفاده از امکانات ASP.NET 2 و جاوا اسکريپت مي پردازم.
گاهي پيش مي آيد که شما در برنامه کاربردي تحت وب خود نياز داريد که برخي اطلاعات را در يک صفحه popup نمايش دهيد. فرض کنيد کارت خريدي نوشته ايد که کاربر با کليک کردن روي سبد خريد و يا ليست اقلام خريداري شده توسط خود ، جزئيات محصولات انتخاب شده را در يک صفحه popup مشاهده کند. در صفحه popup جديد کاربر مي تواند محصول انتخابي خود را از سبد خريد حذف نموده و يا تعداد اقلام را تغيير دهد .
در حالت عادي پس از اينکه کاربر تغييرات خود را در صفحات popup اعمال کرد ، صفحه والد تا زماني که تازه سازي نشود ، اطلاعات قبل از تغييرات را نشان مي دهد . در اينجا نياز است که همزمان با اعمال تغييرات در صفحه فرزند ، صفحه والد نيز تازه سازي شود.
معرفي :
در اين مقاله ما دو صفحه ايجاد خواهيم کرد به نام هاي Parent و Child .
صفحه Parent داراي يک Panel مي باشد که نام رنگ پس زمينه Panel را در رويداد Load خود از Web.config مي خواند . به طور پيش فرض نام رنگ ، "Red" مي باشد .
در صفحه Child ، نام اين رنگ را به "Blue" تغيير مي کند و صفحه والد تازه سازي مي شود و در نتيجه رنگ پس زمينه Panel در صفحه والد به آبي تغيير مي کند.
شروع از ابتدا :
يک پروژه جديد ASP.NET ايجاد کنيد. دوصفحه به نام هاي Panel و Child ايجاد کنيد.
در رويداد Load صفحه Parent ، کدهاي زير را بنويسيد.
|
if (!IsPostBack)
{
System.Configuration. ConfigurationManager.AppSettings["PageColor"] = "Red";
}
Style obj_Style = new Style();
obj_Style.BackColor = System.Drawing. Color.FromName(System.Configuration.ConfigurationManager.AppSettings["PageColor"]);
Panel1.ApplyStyle(obj_Style); |
همانطور که ملاحظه مي کنيد ابتدا کنترل مي کنيم اگر صفحه براي اولين باز اجرا مي شود ، نام رنگ مربوط به پس زمينه Panel را به مقدار "Red" تخصيص مي دهد . سپس نام رنگ را از Web.config خوانده و به يک شي از نوع Style تخصيص مي دهد و اين شي را به Panel اعمال مي کند. در نتيجه اگر براي اولين بار صفحه را اجرا کنيد ، رنگ پس زمينه Panel قرمز مي باشد.
اکنون زمان آن رسيده است که کدهاي جاوا اسکريپت مربوط به باز کردن صفحه Child به صورت popup ، را بنويسيم . اين کدها را در صفحه Parent بنويسيد.
|
< script language="javascript" type="text/javascript">
function OpenWindow(strChildPageUrl)
{
window.open (strChildPageUrl, 'NewPage','width=600px,height=600px,scrollbars=1');
}
</ script> |
اين تابع جاوااسکريپت نام صفحه فرزند را مي گيرد و آن را به صورت popup ، باز مي کند . در ضمن صفات مربوط به ارتفاع و عرض و اسکرول بار صفحه فرزند نيز مقدار دهي شده اند .اکنون يک هايپر لينک در صفحه Parent ايجاد مي کنيم که تابع فوق را فراخواني مي کند و نام صفحه Child.aspx را به آن ارسال مي کند
|
< a href="javascript:OpenWindow('Child.aspx')">Show Child</a> |
با استفاده از دستور زير مي توانيم صفحه Parent.aspx را از داخل صفحه Child.aspx تازه سازي کنيم.
|
window.opener.document.forms(0).submit(); |
در ASP.NET 2 ما مي توانيم کدهاي سمت مشتري را به Page.ClientScript اضافه کنيم . اکنون يک button به صفحه Child.aspx اضافه کنيد و کدهاي زير را د ررويداد کليک آن بنويسيد.
|
System.Configuration. ConfigurationManager.AppSettings["PageColor"] = "Blue";
string cRefreshParent = "<script language='javascript'>" + " window.opener.document.forms(0).submit();" + "</script>";
string cRefreshParentKey = "RefreshParentKey";
if (!this.Page.ClientScript.IsClientScriptBlockRegistered(cRefreshParentKey))
{
this.Page.ClientScript.RegisterClientScriptBlock(this.GetType(),
cRefreshParentKey, cRefreshParent);
} |
وظيفه اين دکمه اين است که نام رنگ موجود در Web.config را به "Blue" تغيير دهد. سپس کدهاي مربوط به تازه سازي صفحه والد نوشته شده است.
خوب کار تمام شد . اکنون صفحه Parent.aspx را اجرا کنيد . همانطور که مي بينيد رنگ پس زمينه Panel از Web.config خوانده مي شود ، به طور پيش فرض قرمز مي باشد. روي لينک Show Child کليک کنيد تا صفحه فرزند باز شود . روي دکمه Change Color در صفحه فرزند کليک کنيد. اکنون اگر به صفحه Parent دقت کنيد ، مي بينيد که رنگ پس زمينه Panel به آبي تغيير کرده است.
فايل مربوط به اين مقاله از لينک بالاي صفحه قابل دانلود مي باشد.