如何在表单插件的jquery中访问json结果

时间:2011-07-07 13:15:21

标签: jquery asp.net-mvc jquery-plugins file-upload

我正在使用jquery表单插件进行文件上传。我的问题是如何使用jquery从视图的脚本部分中的控制器访问jsonresult。 我的脚本是

 $(function() {
       $("#uploadForm").ajaxForm({
               iframe: true,
               dataType: "json",
               contentType: "application/json; charset=utf-8",
                target :"myTable",
               url: "/UploadFile/Index",
             success: function(response,statusText)  {
        var jsonObject= result.childNodes[0].innerHTML;
       for (i = 0; i < response.length; i++) {
               alert(response.filesList[i]);
                   $('#myTable').append('<tr><td> <a href=' + response.filesList[i] + '></a> td></tr>');
               }
        }
    }
      })
 })

并在我的控制器中获取文件名并添加到静态列表类型字符串filesList并返回为jsonresult类型

 [AcceptVerbs(HttpVerbs.Post)]
            public JsonResult Index(HttpPostedFileBase file)
            {
    string filename = file.FileName;
                filesList.Add(filename);
   return new JsonResult
        { ContentType = "text/plain",
            Data = Json(new
                {
                 filesList = filesList.Select(x => "File uploaded successfully " + x)
                }, JsonRequestBehavior.AllowGet)
        };
}

但我认为在脚本中处理json结果是错误的表示,我想要它做的是将filesList附加到表,以便如何在脚本中处理jsonresult对象。

感谢你, michaeld

2 个答案:

答案 0 :(得分:1)

如果我理解你的问题,首先应该重写控制器。返回json时为什么需要text / html?字符串+字符串列表是不可能的,我想你想要的是消息列表和文件名

    [AcceptVerbs(HttpVerbs.Post)]
public JsonResult Index(HttpPostedFileBase file)
            {
                List<String> fileNames = new List<string>();

            fileNames.Add(file.FileName);


            return Json(new
            {
                FileNames = fileNames.Select(x=> "File uploaded successfully " + x)
            }, JsonRequestBehavior.AllowGet);
}

然后在客户端,直接使用result对象,当你设置dataType ='json'时,它已经是json对象

success: function(result) {
       for (i = 0; i < result.FileNames; i++) {
       $('#myTable').append('<tr><td> <a href=' + result.FileNames[i] + '></a> td></tr>');
        }
    }

答案 1 :(得分:0)

实际上你附加了一个id为mytable的表,有很多表行。我不明白你想要什么,我试着猜。 如果你想附加一个文件列表,我认为你应该这样做:

   var jsonObject= result.childNodes[0].innerHTML;
   var html = '<ul>';
   for (i = 0; i < jsonObject.length; i++) {
      html += '<li> <a href=' + jsonObject[i].message + '></a> </li>'
    }
     html += '</ul>';
     $('#mytable').after(html);
}