Click here to Skip to main content
16,012,352 members
Please Sign up or sign in to vote.
0.00/5 (No votes)
See more: , +
Hello ,

First , I read this article : ASP.NET AJAX Control Toolkit ModalPopupExtender Control in Action[^]


I added a Modal Popup extender in my project. In aspx page , i added this :

<%@ Register Assembly="AjaxControlToolkit" Namespace="AjaxControlToolkit" TagPrefix="cc1" %>

and this :


XML
<asp:ImageButton ID="ImageButton1" runat="server" CssClass="search_img" ImageUrl="images/search.png" ></asp:ImageButton>


<asp:scriptmanager id="ScriptManager1" runat="server">
</asp:scriptmanager>


<cc1:modalpopupextender id="ModalPopupExtender1" runat="server"
    cancelcontrolid="btnCancel" okcontrolid="btnOkay"
    targetcontrolid="ImageButton1" popupcontrolid="Panel1"
    popupdraghandlecontrolid="PopupHeader" drag="true"
    backgroundcssclass="ModalPopupBG">
</cc1:modalpopupextender>

<asp:panel id="Panel1" style="display: none" runat="server">
    <div class="HellowWorldPopup">
                <div class="PopupHeader" id="PopupHeader">Header</div>
                <div class="PopupBody">
                    <p>This is a simple modal dialog</p>
                </div>
                <div class="Controls">
                    <input id="btnOkay" type="button" value="Done" />
                    <input id="btnCancel" type="button" value="Cancel" />
        </div>
        </div>
</asp:panel>




My problem is , when i click my imagebutton ,it's just like refresing page. And there is no modalpopup. Am i missing something ?



Because of my hosting , i can't change trust level. For this reason i can't use this ajax tool. Thanks for your help.
Posted
Updated 9-Aug-14 9:42am
v2

Get rid of scriptmanager and try toolkitscriptmanager ajaxtoolkit control does not support script manager
 
Share this answer
 
XML
<head runat="server">
    <title></title>
    <style type="text/css">
        .ModalPopupBG
{
    background-color: #666699;
    filter: alpha(opacity=50);
    opacity: 0.7;
}

.popup_Container {
    background-color:#fffeb2;
    border:2px solid #000000;
    padding: 0px 0px 0px 0px;
}

.popupConfirmation
{
    width: 300px;
    height: 600px;
}

.popup_Titlebar {
    //background: url(Images/titlebar_bg.jpg);
    background-color:black;
    height: 29px;
}

.popup_Body
{
    padding:15px 15px 15px 15px;
    font-family:Arial;
    font-weight:bold;
    font-size:12px;
    color:#000000;
    line-height:15pt;
    clear:both;
    padding:20px;
}
.Container
{
    margin:auto;
    min-height:400px;
    background:#ffffff;
    max-width:500px;
    min-width:500px;
    border:solid 1px #d4d4d4;
    padding:0 20px 20px 20px;
}

.ToolBar
{
    border:solid 1px #d4d4d4;
    padding:10px;
    margin-bottom:20px;
}

.GridContainer
{
    background:#ECF5FB;
    min-height:600px;
    border:solid 1px #d4d4d4;
}


.TitlebarLeft
{
    float:left;
    padding-left:5px;
    padding-top:5px;
    font-family:Arial, Helvetica, sans-serif;
    font-weight:bold;
    font-size:12px;
    color:#FFFFFF;
}
.TitlebarRight
{
    background-color:black;
    background-position:right;
    background-repeat:no-repeat;
    height:28px;
    width:28px;
    float:right;
    cursor:pointer;
    margin-right:0px;
    margin-top:1px;
}

.popup_Buttons
{
    margin:10px;
}
    </style>
</head>
<body>
    <form id="form1" runat="server">
    <div style="min-height: 700px;">
        <asp:ScriptManager ID="ScriptManager1" runat="server">
        </asp:ScriptManager>
        <asp:Button ID="Button1" runat="server" Text="Click here to show the modal" />
        <cc1:ModalPopupExtender ID="ModalPopupExtender1" BackgroundCssClass="ModalPopupBG"
            runat="server" CancelControlID="imgClose" OkControlID="btnOkay" TargetControlID="Button1"
            PopupControlID="Panel1" Drag="true" PopupDragHandleControlID="PopupHeader">
        </cc1:ModalPopupExtender>
        <div id="Panel1" style="display: none;">
            <div class="popup_Container">
                <div class="popup_Titlebar" id="PopupHeader">
                    Header
                </div>
                <div class="popup_Body">
                    <%--<p>
                        This is a simple modal dialog
                    </p>--%>

                </div>
                <div class="popup_Buttons">
                    <input id="btnOkay" value="Done" type="button" />
                </div>
            </div>
        </div>
    </div>
    </form>
</body>



follow above code
 
Share this answer
 
v2
Comments
kozmikadam 5-Aug-14 9:31am    
Same error unfortunately
TrushnaK 5-Aug-14 9:36am    
Do not re post answer rather than improve your previous answer..
ClimerChinna 6-Aug-14 0:29am    
previous post is modified code of the question
current post is the code which i have executed in my project
thats why I have posted both of the answers.
ClimerChinna 6-Aug-14 0:33am    
copy above code as it is and use it in new webpage and try, please tell me if there are any errors, i have used above code in my project for popup window its working fine.
Place script manager on top and try like:-
XML
<asp:ImageButton ID="ImageButton1" runat="server" CssClass="search_img" ImageUrl="images/search.png" OnClientClick="return ShowModalPopup()"></asp:ImageButton>


<asp:scriptmanager id="ScriptManager1" runat="server">
</asp:scriptmanager>


<cc1:modalpopupextender id="ModalPopupExtender1" runat="server"
    cancelcontrolid="btnCancel" okcontrolid="btnOkay"
    targetcontrolid="ImageButton1" popupcontrolid="Panel1"
    popupdraghandlecontrolid="PopupHeader" drag="true"
    backgroundcssclass="ModalPopupBG">
</cc1:modalpopupextender>

<asp:panel id="Panel1" style="display: none" runat="server">
    <div class="HellowWorldPopup">
                <div class="PopupHeader" id="PopupHeader">Header</div>
                <div class="PopupBody">
                    <p>This is a simple modal dialog</p>
                </div>
                <div class="Controls">
                    <input id="btnOkay" type="button" value="Done" OnClientClick="return HideModalPopup()"/>
                    <input id="btnCancel" type="button" value="Cancel" OnClientClick="return HideModalPopup()"/>
        </div>
        </div>
</asp:panel>





wrote javascript like:-
XML
<script type="text/javascript">
        function ShowModalPopup() {
            $find("ModalPopupExtender1").show();
            return false;
        }
        function HideModalPopup() {
            $find("ModalPopupExtender1").hide();
            return false;
        }
    </script>
 
Share this answer
 
v2
Comments
kozmikadam 5-Aug-14 9:16am    
Tried. Still refreshing page.
ClimerChinna 5-Aug-14 9:17am    
have you tried solution 3
kozmikadam 5-Aug-14 9:20am    
yes , i tried.
ClimerChinna 5-Aug-14 9:21am    
still there are errors?
kozmikadam 5-Aug-14 9:26am    
yes. same error.
You should try using ToolkitScriptManager instead of ScriptManager.


--Amy
 
Share this answer
 
Comments
kozmikadam 5-Aug-14 9:11am    
Hi Amy , Please check comment's of solution 2. I tried already ToolkitScriptManager but this time i saw another errors.
_Amy 5-Aug-14 9:20am    
Check your assembly version. Add Ajax ddl once again(delete previous one).
kozmikadam 5-Aug-14 9:38am    
I delete all ajax dll file. And after added again. Nothing change.
_Amy 5-Aug-14 9:44am    
Try checking CopyLocal property of ddl.
Right click on ddl --> go to properties --> set the CopyLocal to true.
kozmikadam 5-Aug-14 9:56am    
So how can i do this ? In solution explorer there isn't properties for right click.
My project is not local also. It's online.
Use below code in place of your code ,


XML
<asp:scriptmanager id="ScriptManager1" runat="server">
</asp:scriptmanager>
 <asp:ImageButton ID="ImageButton1" runat="server" CssClass="search_img" ImageUrl="images/search.png" ></asp:ImageButton>

<cc1:modalpopupextender id="ModalPopupExtender1" runat="server"
    cancelcontrolid="btnCancel" okcontrolid="btnOkay"
    targetcontrolid="ImageButton1" popupcontrolid="Panel1"
    popupdraghandlecontrolid="PopupHeader" drag="true"
    backgroundcssclass="ModalPopupBG">
</cc1:modalpopupextender>
 <div id="Panel1" style="display: none;" >

    <div class="HellowWorldPopup">
                <div class="PopupHeader" id="PopupHeader">Header</div>
                <div class="PopupBody">
                    <p>This is a simple modal dialog</p>
                </div>
                <div class="Controls">
                    <input id="btnOkay" type="button" value="Done" />
                    <input id="btnCancel" type="button" value="Cancel" />
        </div>
        </div>
</div>



add all CSS classes which are available in your referred link,and use class names exactly.
 
Share this answer
 
v5
Hello ,
Replace your ScriptManager with ToolkitScriptManager and check the issue.
<ajaxtoolkit:toolkitscriptmanager id="ToolkitScriptManager1"  runat="server" enablescriptglobalization="true">
</ajaxtoolkit:toolkitscriptmanager>


thanks
 
Share this answer
 
v2
Comments
kozmikadam 5-Aug-14 5:54am    
Hello , I tried this now. It's says : Unknown server tag 'AjaxToolkit:ToolkitScriptManager'.

So i change it like this : <cc1:ToolkitScriptManager id="ToolkitScriptManager1" runat="server" enablescriptglobalization="true">


And this time it's giving an another error like: "Unable to load one or more of the requested types. Retrieve the LoaderExceptions property for more information."
Animesh Datta 5-Aug-14 6:00am    
<configsections>

put this in web config file
<sectiongroup name="system.web.extensions">
type="System.Web.Configuration.SystemWebExtensionsSectionGroup,
System.Web.Extensions, Version=3.5.0.0, Culture=neutral,
PublicKeyToken=31BF3856AD364E35">
kozmikadam 5-Aug-14 6:06am    
In which tag ?
Animesh Datta 5-Aug-14 6:17am    
check
http://www.codeproject.com/Questions/675968/Unable-to-load-one-or-more-of-the-requested-types
kozmikadam 5-Aug-14 6:33am    
<configsections>

<sectiongroup name="system.web.extensions" type="System.Web.Configuration.SystemWebExtensionsSectionGroup,
System.Web.Extensions, Version=3.5.0.0, Culture=neutral,
PublicKeyToken=31BF3856AD364E35">



It's giving this error : Unable to load one or more of the requested types. Retrieve the LoaderExceptions property for more information

In this line :



Line 69:
Line 70:
Line 71: <cc1:ToolkitScriptManager id="ToolkitScriptManager1" runat="server" enablescriptglobalization="true">
Line 72:
Line 73:

This content, along with any associated source code and files, is licensed under The Code Project Open License (CPOL)



CodeProject, 20 Bay Street, 11th Floor Toronto, Ontario, Canada M5J 2N8 +1 (416) 849-8900