Vaidation in POpup Window is not working properly

Question

I am having an issue in validating popup screen in my project.I am using validation group to validate the controls in popup .Our project standard is showing Red Foreground for controls which are not filled.Its worked in Normal screens but it is not working in popups ( ForeColor color Red )? Is any way to solve this? CLICKING ON 'btnExportLE ' button in same window the popup div will show.

<asp:Button ID="btnExportLE" runat="server" class="btnNew" Text="Export LE" OnClientClick="returnShowExpPopup();" />

CSS

.popups
{
    position: absolute;width: 550px; height: 430px;border-width: 0px;top: 240px;margin-left: 273px;
    background: #FFF;border-radius: 5px;box-shadow: 6px 6px 7px #4d4d4d;z-index: 10000100; border: 1px solid #CCCCCC;
}

JS Function

function ShowExpPopup()
{
document.getElementById('<%= dvExpPopUp.ClientID %>').style.display = "block";
document.getElementById("divBG").style.display = "block";
return false;
}

<div id="dvExpPopUp" runat="server" class="popups" style="display: none">
        <div class="popupTop">
            <table width="550px" style="height: 100%">
                <tr style="height: 10px;">
                    <td style="text-align: center; width: 510px;">
                        <asp:Label ID="Label1" runat="server" Text="Export LE" Font-Bold="true"></asp:Label>
                    </td>
                    <td style="text-align: right; width: 30px;">
                        <asp:LinkButton ID="lnkClose1" CssClass="lnkcancel" runat="server" ForeColor="Red"
                            OnClientClick="Clear();closeInfo();" Text=" X "></asp:LinkButton>
                    </td>
                </tr>
            </table>
        </div>
        <table width="550px" style="font: Arial; font-size: small;">
            <tr>
                <td width="10%">
                </td>
                <td width="25%">
                    <asp:Label ID="lblMandantCode" runat="server" Text="Mandant Code"></asp:Label>
                </td>
                <td colspan="3">
                    <asp:TextBox ID="txtMandantCode" runat="server" class="txtBox" Width="200px" TextMode="SingleLine"
                        MaxLength="3"></asp:TextBox>
                    <asp:RequiredFieldValidator ID="RVMandantCode" runat="server" ErrorMessage="*" ControlToValidate="txtMandantCode"
                        ForeColor="Red" ValidationGroup="V2"></asp:RequiredFieldValidator>
                </td>
                <td>
                </td>
            </tr>

            <tr>
                <td width="10%">
                </td>
                <td width="25%">
                </td>
                <td colspan="3">
                    <asp:ToolkitScriptManager ID="ToolkitScriptManager2" runat="server">
                    </asp:ToolkitScriptManager>
                    <asp:UpdatePanel ID="UpdatePanel1" runat="server" UpdateMode="Conditional">
                        <ContentTemplate>
                            <asp:Button ID="btnExport" runat="server" ValidationGroup="V2" Style="margin-bottom: 0px"
                                Text="Export" class="btnNew" OnClick="btnExport_Click" />
                            <asp:Button ID="btnExpClose" runat="server" Text="Close" class="btnNew" OnClientClick="Clear();closeInfo();"
                                OnClick="btnExpClose_Click" />
                                <br />
                            <asp:Label ID="lblResult" runat="server" Text="" class="errMsg"></asp:Label>
                            <asp:UpdateProgress ID="UpdWaitImage" runat="server" DynamicLayout="true" AssociatedUpdatePanelID="UpdatePanel1">
                                <ProgressTemplate>
                                    <asp:Image ID="imgProgress" ImageUrl="Images/loader.gif" runat="server" />
                                    <asp:Label ID="lblWait" runat="server" Text="Please Wait..." Font-Bold="true" ForeColor="#FE2E2E"></asp:Label>
                                </ProgressTemplate>
                            </asp:UpdateProgress>
                        </ContentTemplate>
                    </asp:UpdatePanel>
                </td>
            </tr>
        </table>
    </div>

`OnClientClick="returnShowExpPopup();"` should be `OnClientClick="return ShowExpPopup();"` there is a space missing. — शेखर, Nov 06 '14 at 05:15
Ok.Popuwindow is working fine.validation is also working .Instead of showing Error message (*) Iwant to show cotrol's foreground as Red. That is not working in popup window controls. — jithesh, Nov 06 '14 at 05:26
Have you used anything like Chromes Developer tools to inspect the element and see what sttles are applied to it and where the style is coming from? This will give you abetter indication of what is going wrong. — Jon P, Nov 06 '14 at 05:36

score 1 · Accepted Answer · edited May 23 '17 at 12:29

1

You need to use like below

OnClientClick="return ShowExpPopup();"

Edit 1

for changing the fore color of the control here is a similar question on SO
Change Text Box Color using Required Field Validator. No Extender Controls Please

edited May 23 '17 at 12:29

Community

1
1

answered Nov 06 '14 at 05:10

शेखर

17,412
13
61
117

It was my mistake which happend while copying the code. I have used 'OnClientClick="return ShowExpPopup();"' like this in my project ..Popupindow is working fine.validation is also working .Instead of showing Error message (*) Iwant to show cotrol's foreground as Red. That is not working in popup window controls – jithesh Nov 06 '14 at 05:32

score 1 · Answer 2 · answered Nov 06 '14 at 07:07

Thanks Shekhar for the link.Its Woking Fine....

function fnOnUpdateValidators()
{
   for (var i = 0; i < Page_Validators.length; i++)
   {
      var val = Page_Validators[i];
      var ctrl = document.getElementById(val.controltovalidate);
      if (ctrl != null && ctrl.style != null)
      {
         if (!val.isvalid)
            ctrl.style.background = '#FFAAAA';
         else
            ctrl.style.backgroundColor = '';
      }
   }

}

Page.ClientScript.RegisterOnSubmitStatement(this.GetType(), "val", "fnOnUpdateValidators();");

score 0 · Answer 3 · answered Nov 06 '14 at 05:34

0

Please try to display the validation message for pop up in pop itself. And use seperate validation group for main page and pop up. Suppose if you are using validationgrp1 for main page then use validationgrp2 for pop up. It think it will work out. Thanks & Regards, Aloy

answered Nov 06 '14 at 05:34

Aloy Banerjee

11
2

Thanks for your response.Actually The Error message is displaying in popup window . But Fore color of controls are not changing if it is not filled.That is my issue .I am using validation only in popup window. – jithesh Nov 06 '14 at 05:43

Vaidation in POpup Window is not working properly

JS Function

3 Answers3

Edit 1