ansaurus

Question

Triggering FancyBox from ASP.Net Codebehind

Answer 1

+1 A:

after your linkbutton refreshes the page (postback), then you want to inject some script into your page.

Your page should have something like this already set

<a href="#" id="hidden_link" style="display:none;"></a>
<script type="text/javascript">
    function LaunchFancyBox() { 
          $("#hidden_link").fancybox().trigger('click'); 
    } 
</script>

Then you would inject some script at the bottom of the page from your button click handler.

So at the bottom of your page you will add something like

<asp:Literal runat="server" ID="Literal1" />

Then in your button click event handler you will have

Public Sub Button1_Click()
    Literal1.Text = "<script>$(document).ready(LaunchFancyBox());</script>"
End Sub

no.6 on their blog helps explain this as well, however they're launching it on page load ever time so they're non injecting script. Because you want to do it on postback, you need to do the script injection.

rockinthesixstring 2010-07-10 17:56:08

Thanks for the reply rockinthesixstring, I am trying this, but getting a javascript error pointing at your first script i.e. in the LaunchFancyBox() definition. It says "Object expected". Sorry can't figure out what is wrong. By injecting script, you mean using ScriptManager.RegisterStartupScript ?

Ali 2010-07-10 18:52:58

no what I mean is you would put a literal control at the very bottom of your page that contains NOTHING on `Page_Load`. Then when you click your button, you add a string `Literal1.Text="<script>$(document).ready(LaunchFancyBox());</script>"`

rockinthesixstring 2010-07-10 18:59:48

I've edited my answer. Sorry I can't test the script portion as I'm not in front of my IDE. The concept is still the same however.

rockinthesixstring 2010-07-10 19:03:25

It should probably be function LaunchFancyBox{.....}

markt 2010-07-10 19:14:02

thanks @markt, I've made the necessary edit.

rockinthesixstring 2010-07-10 19:24:56

sometimes I forget the basics when I'm not in developer mode... :(

rockinthesixstring 2010-07-10 19:25:20

thanks rockinthesixstring and markt, but this is giving me a javascript error on page, saying "loading is null or not an object". In debug mode, it stops at: fancybox_abort = function() { loading.hide();inside the fancybox-1.3.1.js

Ali 2010-07-10 19:47:52

that's in your code somewhere. not sure where it's coming from since my example doesn't include `fancybox_abort`. Get your fancy box working as expected with the click of a button, then just replace the clickable button with the hidden button and inject the script that I sent.

rockinthesixstring 2010-07-10 19:57:43

it does work on the click of a button, but not when when I inject your code.fancybox_abort is not in my code. It is inside the fancybox-1.3.1.js file.

Ali 2010-07-10 20:33:51

Answer 2

+1 A:

Solved. Just some minor adjustments to rockin's reply. Had to place

  <script language="javascript" type="text/javascript">$(document).ready(function() {

$("#hidden_link").fancybox({
    'title'          : 'Test Document',
    'titleShow'     : true,
    'titlePosition' : 'over',
    'titleFormat'   : 'formatTitle',
    'type'          :   'iframe',
    'width'         :   '98%',
    'height'        :   '98%',
    'hideOnOverlayClick': false,
    'hideOnContentClick' : false,
    'overlayOpacity': 0.7,
    'enableEscapeButton' : false
});

});

In the head tag, and Injected the code below:

 protected void SomeButton_Click(object sender, EventArgs e)
    {

        hidden_link.Attributes["href"] = "some_file.pdf";
        Literal1.Text = "<script>jQuery(document).ready(function() {$(\"#hidden_link\").trigger('click');});</script>";
    }

Thanks rockinthesixstring for suggesting the right direction!

Ali 2010-07-11 13:20:08

ansaurus

tags:

views:

answers:

Triggering FancyBox from ASP.Net Codebehind

related questions