CODEWITHSUNDEEP
c#jqueryasp.netcustom-controlsfancybox
mrkhton
mrkhton

Reputation: 1

Custom control with jquery, what to do next?

I'm currently developing a web application and creating some custom controls. I have created a custom "modal button", that inherits from a web control and and INamingContainer, the control uses emebedded resources to register client side code (FancyBox jQuery), the modal button displays an Iframe within the modal and works fine on a my Default.aspx page.

The Problem:

I have tried to declare another "modal button" control on another page however the modal pop up fails to postback. I have researched the error, and found that the _DoPostBack wasn't being generated on this page. therefore I added the the method: this.Page.ClientScript.GetPostBackClientHyperlink(this, "");. This generated the _doPostBack function and caused the post back however the modal fails to open the second time!

Heres my client side script thats generated in my custom control method override CreateChildControls():

      // http://fancybox.net/
            StringBuilder jQueryInclude = new StringBuilder();
            jQueryInclude.Append("$(document).ready(function () { ");

            // Uses ".class" selector 
            jQueryInclude.AppendFormat("$('.{0}').fancybox( ", this.ModalViewID);
            jQueryInclude.Append(" { ");
            jQueryInclude.Append("    'titlePosition': 'outside',");
            jQueryInclude.Append("     'modal': 'true', ");
            jQueryInclude.Append("     'transitionIn': 'elastic', ");
            jQueryInclude.Append("     'transitionOut': 'fade', ");
            jQueryInclude.Append(" }); ");
            jQueryInclude.Append("});");

            var closeMethod = String.Format("{0}_CloseDialog()", close.ClientID);

            jQueryInclude.Append(" function METHOD_NAME { ").Replace("METHOD_NAME", closeMethod);
            jQueryInclude.Append("    $.fancybox.close(); ");
            jQueryInclude.AppendFormat(" __doPostBack('<%= {0}  %>', '' )", close.ClientID); // Postback on close to reload iframe
            jQueryInclude.Append("   } ");

            close.OnClientClick = closeMethod;
//user preference else all modals will be same 
            Page.ClientScript.RegisterClientScriptBlock(typeof(ModalButton),  String.Format("{0}_fancyBox", this.ModalViewID), jQueryInclude.ToString(), true);

What I need to Know:

How can ensure this custom "modalbutton" generates the _DoPostBack Function and also opens again when its been posted back.

Thanks in advance

Upvotes: 0

Views: 362

Answers (1)

mrkhton
mrkhton

Reputation: 1

Turns out the postback was forcing the page to generate the ChildControls again but without ModalViewID which wasn't stored in Viewstate of my custom control, therefore generating "pony" jquery! To fix it I added a simple check on my create child controls method to return if modalviewid == null or empty, I could also assign my modalViewID to viewstate.

Thanks Anyhow

Upvotes: 0

Related Questions