Sunday, March 27, 2011

Asp. net and Javascript pop up windows

I am writing an intranet application and am considering the use of a pop up window. What are your thoughts on it? I am not worried about accessibility since it's an intranet app.

The scenario is such as I need to be able to have the same code be used in a server page as well as in the middle of a process; which is why I decided when using it in the middle of the process, it's best to have it as a pop up window to running out of the real estate on the screen.

Any thoughts on this? I am hesitant to use a pop up window in such a manner as I usually only use it for error messages. Thanks in advance.

From stackoverflow
  • The usual argument against popup windows is that they are unreliable. The user may have disabled script initiated popups, I know I have.
    In a controlled environment, such as an inranet, you may be able to be guaranteed that this is not the case, but even so, why risk it, there is an alternative.
    Instead of popping up a new window just insert a new, absolutely positioned <div> into the document and insert your content into that using ajax or even an <iframe>. There are lots of examples/libraries on the web.
    Thickbox for jQuery for example. There are of course scripts that don't require libraries.

  • I don't completely understand what you're trying to do, but I think a popup window might be somewhat of an issue if the user's browser automatically blocks popup windows. Plus, if you were trying to run a process in the popup window, the user could close it and no longer have a way to check on the process.

    Would it be possible to use Ajax to call back to a web service that gives the page information about the process? You could give the user a way to make the Ajax call to check on the status of the process or just have it continually polling in the background.

    Edit:

    You said you weren't too familiar with Ajax. For the most part, there are libraries to handle all the of hard details. I'll recommend jQuery because that's what I've been using for a while now.

    If you go the Ajax route you'll be able to contain everything on one page and make the updates you need to make when the Ajax call is successful. Depending on how you write the code, it should be pretty reusable if you do it right. It really depends on how specific the your needs on each page.

    Take a look at the jQuery documentation though. It may have what you need already built into it. Otherwise, someone else might be able to suggest some reasons why their favorite JavaScript library works better for what you're trying to do.

  • I was trying to avoid AJAX, simply because I have never used and dont have the time frame to learn it now. However, I am not totally opposed to it.

    In short what I need to do is for the pop up window interact back with the page. Imagine that on the page I am building the links of the chain. Each link has unique properties. When user clicks on "ADD LINK" button, I was thinking have a pop up window with the little form and a Save button. The only issue with this is that a pop up needs to interact with the page...we need to know when something has been saved or not saved.

    A div on the same page is one way. A pop up is yet another way. Another catch is that this code (adding new link) needs to be reusable, because I am also going to have a page that just creates new links. Is it possible w/o Ajax? I imagine that this scenario has been done before.

  • I think you might want to do something like this:

    Inside of the parent page:

    <input id="btnShowModal" runat="server" type="button" value='Show Modal' onclick="ShowModal()" />
    
    function ShowModal()
    {
       var retVal = window.showModalDialog("MyPopup.aspx?param1=value","","center=yes;dialogWidth=200px;dialogHeight=200px;status:0;help:0")
    
       if(retVal !=  "" && retVal != undefined)
       {
           //This code will be executed when the modal popup is closed, retVal will contain the value assigned to window.returnValue               
        }
    }
    

    Inside of the modal popup:

    <input id="btnSave" runat="server" type="button" value='Save' onclick="Save()" />
    
    function Save()
    {
       window.returnValue = "Whatever you want returned to the parent here"
       window.close()
    }
    
    rp : Be aware that showModalDialog() is exclusive to IE.
    Phaedrus : I'm aware, he's developing an intra net application so he probably has some control over users environment.
  • Thanks, I will look into it. One thing to mention: it's a controlled environment where the current intranet site relies heavily on Javascript, so that's not a problem - it's always on.

    So are you saying its impossible to pass a value from a pop-up back to the page? Because that would be the easiest way to do it for me w/o having to look into any documentation.

    Matt Ephraim : It's not impossible to pass values between different windows, I just think it's more complicated than using Ajax on the same page. It isn't very difficult though. "window.opener" in your popup window will give you a reference to the window that opened the popup.
    gnomixa : Thanks I might look into that.
  • I generally use a div with a z-index and absolute positioning; the .show() can be written and called on demand, it would have a button to .close(), and AJAX can make it seem modal so it must be clicked to close if you so desire. Then again, I hate messageboxes.

  • i am a she:) as far as IE..hmmmm, we don't support FF officially, but I dislike writing apps that don't work for FF, cause I am a FF user. But anyways, in this case I might just use window.showModalDialog

0 comments:

Post a Comment