Grow your CSS skills. Land your dream job.

JQuery Open New File Button

  • # July 9, 2009 at 5:47 pm

    I’m trying to set up a simple inline thickbox window for agreeing to the terms of use for a download file. I found styling the box to hold the TOS content statement rather easy, but don’t know how to set up a second button that closes the thickbox AND points the user at a zip file to begin download.

    The coding snippit for the "Cancel" button that they click when they don’t agree is below. I want to add a second button that begins the download process, and also closes the thickbox popup.

    > <div id="hiddenModalContent" style="display:none">
    > <p>Big-long terms of service statement for file you want to download.</p>
    > <p style="text-align:center"><input type="submit" id="Close" value="&nbsp;&nbsp;Cancel&nbsp;&nbsp;" onclick="tb_remove()" /></p>
    > </div>

    Since the downloading file is a zip file, I don’t think that I have to get very fancy with the coding, because the browser should automatically show the OS Save/Open menu when you direct them to that link? Any ideas on how I can do this? Thanks.

    Fagan

    # July 13, 2009 at 2:22 pm

    I found a solution that works for now. There is something about the content being part of a thick-box inline modal window that precludes using javascript functions that are not already embedded entirely within the JQuery/Thickbox js files.

    Since I’m a javascript beginner, and want to cut down on the amount of coding that I need to do when I need to post new files only twice per year, I kept it super simple.

    I took an idea from another forum about changing the type from "submit" to "button", and used onlclick="window_open()" to just open the new file. It works in IE6-8, and the last couple of versions of Firefox/Safari/Opera (we have clients with older GIS/database software that require older browsers and older versions of java to function).

    Code:

    The first button above uses a simple window.open() command attached to a button (not submit), without linking to another function located anywhere on the site (on the web page, JQuery, or other js scripts).

    Code:

    The second button uses the native Thickbox/JQuery tb_remove() function to close the window if they dissagree. The native "close window" command at the top of thickbox modal window allows them to close the modal window after they download the file.

    Since I’m trying to get the user to download a zip file, the OS-based "Save/Open" automatically window pops up whenever you link directly to the zip file.

    I know that this is sloppy, but it seems to work. Any reasons why I should not use it? I would prefer to do a straight-up asp page hooked to a database, but was over-ruled by my boss (pop-up blocking issues, they WANT a modal content window).

    Thanks.

Viewing 2 posts - 1 through 2 (of 2 total)

You must be logged in to reply to this topic.

*May or may not contain any actual "CSS" or "Tricks".