Home arrow GIS Data & Resources arrow Scripts and Code arrow C# Code arrow C#: Dojo.io.iframe.send goodness with ASP
C#: Dojo.io.iframe.send goodness with ASP PDF Print E-mail

Written by Steve Gourley,

Ever since ESRI built its RESTful API on top of dojo, I've been happily using the dojo framework regularly. Dojo is super fun and makes tedious javascript tasks really trivial. Instead of writing your own DHTML/javascript popup window or using ESRI floating panels dojo has a dijit dialog that handles all of that for you in 1 line of code. We've been using the dijit.dialog for showing instructions, tool sets, etc on our mapping pages. The last requirement I worked on was shapefile download and you can check that out here and the next requirement oddly enough is shapefile upload. 

I figured I'd throw an asp fileupload control in a dijit.dialog and be on my way in minutes. Turns out asp buttons don't like to postback when they're inside a dialog panel. I didn't spend any time trying to figure out why and moved on to the next outlet - dojox.form.FileInput.

Does anyone remember the iframe that was super popular in 1990?  Well, it turns out there is still a useful hack for iframes and that is posting a file to a server in an asynchronous manner. Dojo has a few built in libraries for doing asynchronous javascript calls and dojo.io.frame is one of them.  

In a nutshell, you put an input element of type file in a form element. Then you call the dojo.io.frame.send method passing the form node as a parameter and it posts asynchronously to the server.

dojo.io.iframe.send(

{

    url: "../FileUpload.ashx",

    handleAs: "json",

    method: "post",

    form: form,

    handle: function(data, ioArgs)

    {

        console.dir(data);

    },

    error: function(error)

    {

        console.debug(error);

    }

}

It wasn't as easy as that in my situation. The website I'm working on is using asp masterpages which wrap the content pages in a form. ASP pages like to only have one form per page at least with the runat='server' tag. So for the longest time my form data was not being posted to the server. After some firebug console.logging I realized that the form element I was posting was null. I did a little more firebug inspecting and noticed that the static html form that I placed in my content panel wasn't there. Again I didn't spend any time figuring out why and took the detour with javascript.

Dojo makes DOM manipulation really simple. I dynamically created the form element and inserted it where I wanted it. I also dynamically created the FileInput control and placed it inside the form along with a button to execute the iframe.send() request.

On the server side I just grab the HttpFileCollection and save the file.

HttpFileCollection fileCollection = context.Request.Files;

HttpPostedFile file = fileCollection["image"];

 

file.SaveAs(@"C:\arcgisserver\arcgisoutput\" + file.FileName);

 

context.Response.Write("<textarea>{file: \"" + file.FileName + "\"}</textarea>");

 If you think it's weird to return a json object within a textarea it is. It's for security reasons though so you'll just have to deal with it.


Users' Comments  
 

No comment posted

Add your comment

04, May. 2009
Last Updated ( 04, May. 2009 )
 
< Prev   Next >

AGRC Contacts | UGIC Contacts

feed image feed image

Utah GIS Portal © 2009 AGRC

Optimized for