How to parse JsonResult with Jquery AjaxUpload

Question

the following code for upload image

 <a id="addImage" href="javascript:;">Add Image</a>

Javascript:

$().ready(function () {
            var counter = 0;
            $(function () {
                var btnUpload = $('#addImage');
                new AjaxUpload(btnUpload, {
                    action: 'saveupload.aspx',
                    name: 'uploadimage',
                    dataType: 'json',
                    onSubmit: function (file, ext) {
                        $("#loading").show();
                    },
                    onComplete: function (file, response) {
                        alert(response);
                        var uploadedfile = "UserData/" + file;
                        $("#uploadImageWrapper").append("
            <div class='imageContainer offset'  id='current" + counter + "'>
            <img height='65px' width='65px' src='" + uploadedfile + "' alt='" + uploadedfile + "'/></div>");
                        $('#current' + counter).fadeIn('slow', function () {
                            $("#loading").hide();
                            $("#message").show();
                            $("#message").html("Added successfully!");
                            $("#message").fadeOut(3000);
                            counter++;
                        });
                    }
                });
            });
        });

Server code: (saveupload.aspx.cs)

protected void Page_Load(object sender, EventArgs e)
    {
        HttpFileCollection uploadedFiles = Request.Files;
        int i = 0;
        string width = "0";
        string height = "0";
        if (uploadedFiles.Count > 0)
        {
            while (!(i == uploadedFiles.Count))
            {
                HttpPostedFile userPostedFile = uploadedFiles[i];
                if (userPostedFile.ContentLength > 0)
                {
                    string filename = userPostedFile.FileName.Substring(userPostedFile.FileName.LastIndexOf("\\") + 1);
                    userPostedFile.SaveAs(Path.Combine(Server.MapPath("UserData"), filename));
                    Bitmap img = new Bitmap(Path.Combine(Server.MapPath("UserData"), filename));
                    width = img.Width.ToString();
                    height = img.Height.ToString();
                }
                i += 1;
            }
        }
    //I would like to return Uploaded image Height and Width
        Response.Write(@"{Width:" + width + ", Height:" + height + "}");
    }

and the return JsonResult is i have display in Alert message. enter image description here

Problem: I am not able to get response.Width and response.Height.

LeftyX · Accepted Answer · 2011-06-27 11:52:27Z

1

first of all I would suggest to clean the HTML of your saveupload.aspx. You do not need it and it pollutes your response. You just need:

<%@ Page Language="C#" AutoEventWireup="true" CodeBehind="saveupload.aspx.cs" Inherits="WebApplication1.saveupload" %>

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

Another thing; when you get the response back in your script you can use parseJSON, like this:

var obj = jQuery.parseJSON(response);

now you should be able to access Width and Height:

obj.Width

Last thing. Valums' Ajax Uploader has been replaced by the author with a new component. You can find it here It's very much similar but he's still updating this project so you might consider to switch.

UPDATE:

Another thing I would suggest is to use the jSon serializer (System.Web.Script.Serialization) to serialize the stream you want to return:

var jSon = new JavaScriptSerializer();
var OutPut = jSon.Serialize(myClass);
Response.Write(OutPut);

edited Jun 27, 2011 at 11:52

answered Jun 27, 2011 at 7:29

LeftyX

35.6k21 gold badges140 silver badges201 bronze badges

Sign up to request clarification or add additional context in comments.

3 Comments

imdadhusen Over a year ago

Thanks for correct answer. i have one confusion two write following statement

string width = "0";         string height = "0";         Response.Write(@"{""Width"":""0"", ""Height"":""0""};"); //i would like to use above line with width and height variable         Response.Write(@"{Width:" + width + ", Height:" + height + "};");

LeftyX Over a year ago

@imdadhusen: I don't know if I understand your question.I've updated my answer with some more infos about json serialization. That for me is the best approach.

imdadhusen Over a year ago

Thanks for your valuable comments! i will let you know if i have an issue.

Collectives™ on Stack Overflow

How to parse JsonResult with Jquery AjaxUpload

1 Answer 1

3 Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

3 Comments

Your Answer

Sign up or log in

Post as a guest

Related