[RESOLVED]jquery open fancybox with imagebutton control

trying to use an imagebutton control to display fancybox (open a page) with parameter once clicked

seems it did not work with the following :

function RegisterFancyLinks() {
            $('iframe').fancybox({
                overlayShow: true,
                overlayColor: '#B2B2B2'
            });

        $(function () {
            var ajaxMng = Sys.WebForms.PageRequestManager.getInstance();
            ajaxMng.add_endRequest(RegisterFancyLinks);

            RegisterFancyLinks();
        });

 <asp:ImageButton ID="ibViewCustomerCredit" runat="server" ImageUrl="~/images/transmagglass.png" CssClass="iframe" />

if (cus.CustomerCode != "")
  {
       ibViewCustomerCredit.PostBackUrl = "InvoiceRatingSummary.aspx?customercode=" + strCustomerDetails[0].ToString();
  }

Hi csharp,

Thanks for your post.

ImageButton is the asp.net server side control, it will cause postback when you click it.

So if you want to execute some javascript code when the ImageButton clicked.

If so you can try below code to cancel the postback like below:

<script>
        function OpenFancy() {

            //your code to open fancybox
            //.........

        }
    </script>

<asp:ImageButton ID="ImageButton1" runat="server" ImageUrl="~/Images/loading1.gif" OnClientClick="javascript:OpenFancy();return false;" />

Hope this helps, thanks.

Best Regards!

tried the following, seems like it still does not pop up the fancybox

function RegisterFancyLinks() {
            $('.iframe').fancybox({
                overlayShow: true,
                overlayColor: '#B2B2B2'
            });

 <asp:ImageButton ID="ibViewCustomerCredit" runat="server" ImageUrl="~/images/transmagglass.png"  OnClientClick="javascript:RegisterFancyLinks();return false;" />

Hi csharp_start,

First you should make sure your RegisterFancyLinks method called when click the ImageButton.

 <script>
            function RegisterFancyLinks() {
                alert('fired');

                //$('.iframe').fancybox({
                //    overlayShow: true,
                //    overlayColor: '#B2B2B2'
                //});
            }

        </script>

        <asp:ImageButton ID="ibViewCustomerCredit" runat="server" ImageUrl="~/images/transmagglass.png"  OnClientClick="javascript:RegisterFancyLinks();return false;" />

If fired, what caused your problem is the juqery plugin "fancybox"

Thanks.

Best Regards!

Leave a Reply