jQuery UI的对话呼吁采取行动，在MVC 3返回HttpContect响应流

本文介绍了jQuery UI的对话呼吁采取行动，在MVC 3返回HttpContect响应流的处理方法，对大家解决问题具有一定的参考价值，需要的朋友们下面随着小编来一起学习吧！ 问题描述

我有一个自定义控制器扩展返回一个Excel文件作为HttpContext的响应。

我的控制器操作如下：

公众的ActionResult ExportToExcel（）{    返回this.Excel（头，结果，文件名）;}

这与正常的MVC回调完美的作品。

我试图创建一个jQuery UI对话框，用户可以输入文件名和preSS导出。当点击导出按钮的MVC行动将调用控制器，但文件不会在浏览器中得到回应。

我的对话框code是：

$（＃出口EXCEL）。对话框（{            的AutoOpen：假的，            模式：真实，            标题：导出到Excel            纽扣： {                出口：函数（）{                    $。员额（/搜索/ ExportToExcel                    功能（）{                        $（＃出口EXCEL）对话框（关闭）。                    }）;                }            }        }）;        $（＃出口Excel的按钮）。点击（函数（）{            $（＃出口EXCEL）对话框（开放）。            返回false;        }）;

和HTML：

＆LT; D​​IV ID =出口的Excel的风格=显示：无;＆GT;    文件名：    ＆LT;输入类型=文本VALUE =Results.xls/＆GT;＆LT; / DIV＆GT;＆LT;输入类型=按钮值=导出ID =出口Excel的按钮/＆GT;

解决方案

的问题是，你打电话给你的行动，返回文件数据作为AJAX功能。

您必须强制浏览器进行常规要求你的动作来触发正常的浏览器下载的行为。

最简单的方法是设置在JavaScript中windows.location.href属性：

按钮：{     出口：函数（）{         $（＃出口EXCEL）对话框（关闭）。         window.location的=/搜索/ ExportToExcel？...

一个旁注：你应该使用 Url.Action（）来生成URL到你的动作

I have a custom controller extension to return an Excel file as an HttpContext response.

My controller action is as follows:

public ActionResult ExportToExcel() { return this.Excel(headers, results, filename); }

This works perfectly with a normal MVC callback.

I'm trying to create a jQuery UI dialog where the user can enter the file name and press Export. When the Export button is clicked the MVC action will get called in the controller, but the file doesn't get responded in the browser.

My dialog code is:

$("#export-excel").dialog({ autoOpen: false, modal: true, title: "Export to Excel", buttons: { Export: function () { $.post("/Search/ExportToExcel", function () { $("#export-excel").dialog("close"); }); } } }); $("#export-excel-button").click(function () { $("#export-excel").dialog("open"); return false; });

And the html:

<div id="export-excel" style="display: none;"> Filename: <input type="text" value="Results.xls"/> </div> <input type="button" value="Export" id="export-excel-button" />

解决方案

The problem is, that you call your action which returns the file data as an AJAX function.

You have to force the browser to make a regular request to your action to trigger the normal browsers download behavior.

The simplest way is to set the windows.location.href property in javascript:

buttons: { Export: function () { $("#export-excel").dialog("close"); window.location = "/Search/ExportToExcel?...

A sidenote: you should use Url.Action() to generate the URL to your action.