Question

以下是我的视图和控制器的代码

@using (Html.BeginForm("PdfHeaderAndFooterManager", "Dashboard", FormMethod.Post, new { enctype = "multipart/form-data", id = "formPdfImages" }))
 div id="resultMessage"></div>

} 控制器行动

public ActionResult PdfHeaderAndFooterManager(HttpPostedFileBase headerImage,   HttpPostedFileBase footerImage)
{

   //some code to declare variables


    if (headerImage != null)
    {
        if (!String.IsNullOrEmpty(headerImage.ContentType))
        {
            headerImageContentType = imageHelper.IsValidImageType(headerImage.ContentType);

            if (headerImageContentType)
            {
                resizedHeaderImage = imageHelper.ResizeImage(headerImage.InputStream);
            }
            else
            {
                return Json(new { success = false, message = "Please Upload an image* file less than 2GB." });
            }
        }
    }
    if (footerImage != null)
    {
        if (!String.IsNullOrEmpty(footerImage.ContentType))
        {
            footerImageContentType = imageHelper.IsValidImageType(footerImage.ContentType);
            if (footerImageContentType)
            {   
                resizedFooterImage = imageHelper.ResizeImage(footerImage.InputStream);
            }
            else
            {

                return Json(new { success = false, message = "Please Upload an image* file less than 2GB." });
            }
        }
    }
    if (P24DataPrincipal.CurrentIdentity != null)
    {
        if (resizedHeaderImage != null || resizedFooterImage != null)
        {
          //add to DB code
            return Json(new { success = true, message = "Image(s) Uploaded Successfully." });

        }
        else
        {
            return Json(new {success = false, message = "Upload atleast 1 image file." });

        }

    }

    return View("someview");

}

有人可以帮助我如何编写一个jquery函数来显示我视图中上面的操作中返回的Json结果。致谢

Answer 1

社论说明

您似乎想要发送回JSON或图像。您可以使用HTML 5 Blob API做一些有趣的事情（或者将图像作为带有DATA URI的JSON有效负载发送回来）。一般来说，没有简单的解决方案，特别是通过AJAX。

结束注释

假设jQuery 1.5或更高版本：

jQuery.post('/TheController/PdfHeaderAndFooterManager')
   .success(function(d){
        jQuery('#resultMessage').html(d.message).attr('data-action-success',d.success);
   }).error(function(){
      jQuery('#resultMessage').html('There was an error sending data to the server.').attr('data-action-success', false);
   });

然后你可以在CSS中做一些有趣的事情，比如。：

[data-action-success=true]{
 color: green;
}
[data-action-success=false]{
 color: red;
}

让我觉得你正在返回不同类型的结果。这是相当罕见的，我建议您拆分“显示表单操作（GET操作）”和“保存表单（POST操作）”。 GET可以返回HTML动作结果。 POST总是可以返回JSON。

Answer 2

public ActionResult PdfHeaderAndFooterManager(HttpPostedFileBase headerImage,   HttpPostedFileBase footerImage)
{

   //some code to declare variables

if (headerImage != null)
{
    if (!String.IsNullOrEmpty(headerImage.ContentType))
    {
        headerImageContentType = imageHelper.IsValidImageType(headerImage.ContentType);

        if (headerImageContentType)
        {
            resizedHeaderImage = imageHelper.ResizeImage(headerImage.InputStream);
        }
        else
        {
            ViewBag.ResultMessage="<span style='color:red'">Please Upload an image* file less than 2GB.</span>";
            return View();
        }
    }
}
if (footerImage != null)
{
    if (!String.IsNullOrEmpty(footerImage.ContentType))
    {
        footerImageContentType = imageHelper.IsValidImageType(footerImage.ContentType);
        if (footerImageContentType)
        {   
            resizedFooterImage = imageHelper.ResizeImage(footerImage.InputStream);
        }
        else
        {

            ViewBag.ResultMessage="<span style='color:red'">Please Upload an image* file less than 2GB.</span>";
            return View();
        }
    }
}
if (P24DataPrincipal.CurrentIdentity != null)
{
    if (resizedHeaderImage != null || resizedFooterImage != null)
    {
      //add to DB code
            ViewBag.ResultMessage="<span style='color:green'">Image(s) Uploaded Successfully.</span>";
            return View();
    }
    else
    {
            ViewBag.ResultMessage="<span style='color:red'">Upload atleast 1 image file.</span>";
            return View();
    }

}

}

并在查看，

@using (Html.BeginForm("PdfHeaderAndFooterManager", "Dashboard", FormMethod.Post, new { enctype = "multipart/form-data", id = "formPdfImages" })){
 <div id="resultMessage">
    @ViewBag.ResultMessage
 </div>
}

试试这个，希望它能帮到你。

如何在Html.BeginForm视图中的div中显示Json消息

2 个答案: