I have a ForwardPosting.aspx page. It is a content page under the master page "MasterPages\MasterPage.master".
When its loading, the "MainFields" Div is shown normally. The "MainFields" Div markup code is the part bolded part along with its "MainFieldsDivStyle" CSS styling as following:
When the "ForwardPosting.aspx" page is loading I want to put a statement that fires "PopUpDiv" which showing a message "You can not forward..." with "OK" button". While the "PopUpDiv" is shown, the Background style turned to be fully grey. When the user press the "OK" button, the user redirected to another page.
The "PopUpDiv" markup:
When its loading, the "MainFields" Div is shown normally. The "MainFields" Div markup code is the part bolded part along with its "MainFieldsDivStyle" CSS styling as following:
<asp:ContentID="Content1"ContentPlaceHolderID="head"Runat="Server"><styletype="text/css">
.MainFieldsDivStyle
{
border-color: Black;
width: 75%;
border-style: solid;
margin-top: 22px;
background: rgb(219, 219, 219);
background: rgb(219, 219, 219);
}
.PopUpDivStyle
{
border-color: Black;
width: 50%;
border-style: solid;
margin-top: 22px;
background: rgb(219, 219, 219);
background: rgb(219, 219, 219);
}
.PopUpTableStyle
{
height:50px;
width:88px;
margin-left: 0px;
}
.StatusDDStyle
{
border: thin solid #000000;
background-color: #DADADA;
text-align:right;
}
.ErrorMessage
{
color: red;
text-align: right;
font-family: "Sakkal Majalla";
font-style: normal;
font-size: x-large;
}
.CellStyle
{
background-color:#7DE6FF;
border-color:Black;
border-style:solid;
border-width:1px;
}
.FileUploadStyle
{
direction:rtl;
}
.style2
{
font-size: 26px;
}
</style></asp:Content><asp:ContentID="Content2"ContentPlaceHolderID="CpMainContent"Runat="Server">
<scripttype="text/javascript">function textCounter(field, maxlimit) {
//Get the label object
var countfield = document.getElementById('<%=lblCharacterRemaining.ClientID %>');
//compare and check the textbox value crosed the max length limit or not
if (field.value.length > maxlimit) {
//Assing the remaining value
field.value = field.value.substring(0, maxlimit);
returnfalse;
}
else {
//Assign the values to label control
countfield.innerHTML = maxlimit - field.value.length;
}
}
function IsFileSelected() {
if (document.getElementById("<%=AttachmentsSelecter.ClientID%>").value == "") {
document.getElementById("<%=AttachmentsSelecter.ClientID%>").style.color = "Transparent";
document.getElementById("<%=AttachmentsSelecter.ClientID%>").style.backgroundColor = "Red";
}
else {
document.getElementById("<%=AttachmentsSelecter.ClientID%>").style.color = "black";
document.getElementById("<%=AttachmentsSelecter.ClientID%>").style.backgroundColor = "Green";
}
}
</script>
<divid="MainFields"runat="server"class="MainFieldsDivStyle">
<tableid="ReplyingForm"runat="server"width="98%"><tr><tdwidth="30%"style="text-align: right"></td><td></td><tdwidth="48%"height="50px"></td><td></td><tdwidth="10%"></td></tr><tr><td></td><td></td><tdalign="right"><asp:textboxID="SourceTxtBox"runat="server"Height="35px"style="font-family: 'Sakkal Majalla'; font-size: 22px; text-align: right; margin-top: 0px; border-style:solid; border-color:Black; "Width="500px"Enabled="False"></asp:textbox></td><tdalign="right"class="CellStyle"><asp:LabelID="FromLabel"runat="server"Text="مـــــــن"BorderStyle="None"BorderWidth="0px"ForeColor="Black"Height="35px"style="font-size: 26px; margin-right:5px; font-family: 'Sakkal Majalla'; text-align: right;"Width="110px"></asp:Label></td><td></td>
</tr><tr><td></td><td></td><tdalign="right">
<asp:DropDownListID="TargetName"runat="server"DataSourceID="SDS1"DataTextField="Name"DataValueField="Indx"Height="35px"style="font-family: 'Sakkal Majalla'; font-size: 22px; text-align: right; margin-top: 0px; margin-bottom: 0px; border-style:solid; border-color:Black;"Width="504px"BackColor="White"/>
</td><tdalign="right"class="CellStyle"><asp:LabelID="ToLabel"runat="server"Text="إلـــى"BorderStyle="None"BorderWidth="0px"ForeColor="Black"Height="30px"style="font-size: 26px;; margin-right:5px; font-family: 'Sakkal Majalla'; text-align: right;"BorderColor="Black"Width="110px"></asp:Label></td><td></td></tr>
<tr><td></td><td></td><tdalign="right"><asp:textboxID="RefNoTxtBox"runat="server"Height="35px"style="font-family: 'Sakkal Majalla'; font-size: 22px; text-align: right; margin-top: 0px; border-style:solid; border-color:Black; "Width="500px"Enabled="False"></asp:textbox></td><tdalign="right"class="CellStyle"><asp:LabelID="RefNoLabel"runat="server"Text="مرجع الرسالة"BorderStyle="None"BorderWidth="0px"ForeColor="Black"Height="35px"style="font-size: 26px; margin-right:5px; font-family: 'Sakkal Majalla'; text-align: right;"BorderColor="Black"Width="110px"></asp:Label></td><td></td></tr>
<tr><td></td><td></td><tdalign="right"><asp:textboxID="LetterIDTxtBox"runat="server"Height="35px"style="font-family: 'Sakkal Majalla'; font-size: 22px; text-align: right; margin-top: 0px; border-style:solid; border-color:Black; "Width="500px"Enabled="False"></asp:textbox></td><tdalign="right"class="CellStyle"><asp:LabelID="LetterIDLabel"runat="server"Text="رقم الرسالة"BorderStyle="None"BorderWidth="0px"ForeColor="Black"Height="30px"style="font-size: 26px; margin-right:5px; font-family: 'Sakkal Majalla'; text-align: right;"BorderColor="Black"Width="110px"></asp:Label></td><td></td></tr>
<tr><td></td><td></td><tdalign="right"><asp:textboxID="SubjectTxtBox"runat="server"Height="35px"style="font-family: 'Sakkal Majalla'; font-size: 22px; text-align: right; margin-top: 0px; border-style:solid; border-color:Black; "Width="500px"Enabled="False"></asp:textbox></td><tdalign="right"class="CellStyle"><asp:LabelID="SubjectLabel"runat="server"Text="الموضــوع"BorderStyle="None"BorderWidth="0px"ForeColor="Black"Height="35px"style="font-size: 26px; margin-right:5px; font-family: 'Sakkal Majalla'; text-align: right;"BorderColor="Black"Width="110px"></asp:Label></td><td></td></tr>
<tr><tdstyle="text-align: right"><asp:RequiredFieldValidatorID="CommentsRequiredValidator"runat="server"ErrorMessage="لم تقم بإدخال الملاحظات"ControlToValidate="CommentsTxtBox"CssClass="ErrorMessage"SetFocusOnError="True"Display="Dynamic">*</asp:RequiredFieldValidator></td>
<td></td><tdalign="right"><asp:TextBoxID="CommentsTxtBox"runat="server"TextMode="MultiLine"Height="100px"Width="500px"BorderColor="Black"BorderStyle="Solid"Style="font-size: 22px;
font-family: 'Sakkal Majalla'; text-align: right;"MaxLength="400"onkeyup="textCounter(this,400);"></asp:TextBox></td><tdalign="right"class="CellStyle"><asp:LabelID="CommentsLabel"runat="server"Text="الملاحظات"BorderStyle="None"BorderWidth="0px"ForeColor="Black"Height="35px"style="font-size: 26px; margin-right:5px; font-family: 'Sakkal Majalla'; text-align: right;"BorderColor="Black"Width="110px"></asp:Label></td><td></td></tr>
<tr><td></td><td></td><tdstyle="text-align: right"><asp:LabelID="lblCharacterRemaining"runat="server"Text="400"Height="35px"Style="font-family: Fanan;
font-size: 20px; text-align: center; margin-top: 0px; border-style: solid; border-color: Black;"Width="80px"BackColor="#F9F9F9"Enabled="False"BorderColor="Black"BorderStyle="Solid"BorderWidth="1px"></asp:Label></td><tdclass="CellStyle"></td><td></td></tr>
<tr><td></td><td></td><tdalign="right"><asp:DropDownListID="RAPDDL"runat="server"Height="35px"style="font-family: Fanan; font-size: 22px; text-align: center; margin-top: 0px; border-style:solid; border-color:Black; "Width="80px"DataSourceID="SDS2"DataTextField="Count"DataValueField="Count"></asp:DropDownList></td><tdalign="right"class="CellStyle"><asp:LabelID="RAPLabel"runat="server"Text="مهــــــلة الـــرد"BorderStyle="None"BorderWidth="0px"ForeColor="Black"Height="35px"style="font-size: 26px; margin-right:5px; font-family: 'Sakkal Majalla'; text-align: right;"BorderColor="Black"Width="110px"></asp:Label></td><td></td></tr>
<tr><td></td><td></td><tdalign="right"><asp:DropDownListID="ImportanceDD"runat="server"Height="32px"style="font-family: SC_AMEEN; font-size: 20px; text-align: center; margin-top: 0px; border-style:solid; border-color:Black;"Width="80px"DataSourceID="SDS3"DataTextField="Importance"DataValueField="ImportValue"></asp:DropDownList></td><tdalign="right"class="CellStyle"><asp:LabelID="Label1"runat="server"Text="الأهمية"BorderStyle="None"BorderWidth="0px"ForeColor="Black"Height="35px"style="font-size: 26px; margin-right:5px; font-family: 'Sakkal Majalla'; text-align: right;"BorderColor="Black"Width="110px"></asp:Label></td><td></td></tr>
<tr>
<tdstyle="text-align: right"><asp:RequiredFieldValidatorID="RequiredFieldValidator1"runat="server"ErrorMessage="لم تقم باختيار أي ملف مرفق"CssClass="ErrorMessage"ControlToValidate="AttachmentsSelecter"SetFocusOnError="True"Display="Dynamic">*</asp:RequiredFieldValidator></td><td><asp:CustomValidatorID="CustomValidator1"runat="server"ErrorMessage="نوع الملف المرفق الذي قمت باختياره غير صحيح"ControlToValidate="TmpTxt"OnServerValidate="AttachmentValidator1"CssClass="ErrorMessage"SetFocusOnError="True"Display="Dynamic">*</asp:CustomValidator></td><tdalign="right"style="text-align: center"><asp:FileUploadID="AttachmentsSelecter"runat="server"onchange="IsFileSelected()"Width="500px"BorderColor="Black"BorderStyle="Solid"Height="35px"BackColor="White"BorderWidth="2px"style="margin-left: 4px; font-size: 20px; font-family: Tahoma;"CssClass="FileUploadStyle"/><br/><asp:TextBoxID="RecTmpTxt"runat="server"Visible="False"Width="1px">Scratch</asp:TextBox><asp:TextBoxID="SubTmpTxt"runat="server"Visible="False"Width="1px">Scratch</asp:TextBox><asp:TextBoxID="TmpTxt"runat="server"Visible="False"Width="1px">Scratch</asp:TextBox></td><tdalign="right"class="CellStyle"><asp:LabelID="AttachmentLabel"runat="server"Text="المرفقات"BorderStyle="None"BorderWidth="0px"ForeColor="Black"Height="35px"style="font-size: 26px; margin-right:5px; font-family: 'Sakkal Majalla'; text-align: right;"Width="110px"></asp:Label></td><td></td></tr>
<tr><tdstyle="text-align: right"><asp:CustomValidatorID="SubmittedByValidator"runat="server"ErrorMessage="لم تقم بإدخال إسم الذي قام بالتسليم"ControlToValidate="SubTmpTxt"OnServerValidate="SubmittedByValidator_ServerValidate"CssClass="ErrorMessage"SetFocusOnError="True"Display="Dynamic">*</asp:CustomValidator></td><td></td>
<tdalign="right"><asp:textboxID="SubmittedByTxtBox"runat="server"Height="35px"style="font-family: 'Sakkal Majalla'; font-size: 22px; text-align: right; margin-top: 2px; border-style:solid; border-color:Black; "Width="500px"></asp:textbox></td><tdalign="right"class="CellStyle"><asp:LabelID="SubmittedByLabel"runat="server"Text="قام بالتسليم"BorderStyle="None"BorderWidth="0px"ForeColor="Black"Height="35px"style="font-size: 26px; margin-right:5px; font-family: 'Sakkal Majalla'; text-align: center;"></asp:Label></td><td></td></tr>
<tr><tdstyle="text-align: right"><asp:CustomValidatorID="ReceivedByValidator"runat="server"ErrorMessage="لم تقم بإدخال إسم الذي قام بالاستلام"ControlToValidate="RecTmpTxt"OnServerValidate="ReceivedByValidator_ServerValidate"CssClass="ErrorMessage"SetFocusOnError="True"Display="Dynamic">*</asp:CustomValidator></td><td></td>
<tdalign="right"><asp:textboxID="ReceivedByTxtBox"runat="server"Height="35px"style="font-family: 'Sakkal Majalla'; font-size: 22px; text-align: right; margin-top: 0px; border-style:solid; border-color:Black; "Width="500px"></asp:textbox></td><tdalign="right"class="CellStyle"><asp:LabelID="ReceivedByLabel"runat="server"Text="قام بالاستلام"BorderStyle="None"BorderWidth="0px"ForeColor="Black"Height="35px"style="font-size: 26px; margin-right:5px; font-family: 'Sakkal Majalla'; text-align: center;"></asp:Label></td><td></td></tr><tr><td></td><td></td><tdalign="center"><asp:ButtonID="PosttheForward"runat="server"BackColor="#6262FF"BorderColor="Black"BorderStyle="Solid"BorderWidth="1px"ForeColor="White"Height="40px"style="text-align: center; font-size: 24px; margin-top: 16px; margin-bottom: 20px; font-family: 'Sakkal Majalla';"Text="حــــول"Width="131px"/></td><td></td><td></td></tr>
</table>
<tableid="ValidationSummaryTable"runat="server"width="80%"><tr><tdrowspan="5"align="right"><asp:ValidationSummaryID="ValidationSummary1"runat="server"CssClass="ErrorMessage"DisplayMode="List"Height="91px"Width="80%"/></td></tr>
</table>
</div>
When the "ForwardPosting.aspx" page is loading I want to put a statement that fires "PopUpDiv" which showing a message "You can not forward..." with "OK" button". While the "PopUpDiv" is shown, the Background style turned to be fully grey. When the user press the "OK" button, the user redirected to another page.
The "PopUpDiv" markup:
<divid="PopUpDiv"runat="server"class="PopUpDivStyle"visible="false"><asp:PanelID="Panel1"runat="server"Width="600px"Height="150px"><br/><spanclass="style2">You can not forward the letter because the period finished.
You can only make replying.</span><brclass="style2"/><br/><asp:ButtonID="PopupButton"runat="server"Height="38px"Text="OK"Width="99px"style="color: #0066CC; font-weight: 700; font-size: medium"/></asp:Panel></div>
So how to preform it using the ModalPopupExtender of the AjaxToolkitControls?