我使用FileStreamResult (或FileResult)方法在剃须刀视图页面(来自Controller )上显示图表,这与预期的一样。
但是,我想知道是否有可能只在单击html元素时才显示图表。
点击一个元素,在模态弹出中显示图表。
只有当我已经将图表加载到div中时,我才能使用Jquery...but获得一个显示模式。
我希望在没有图表的情况下加载页面(出于性能原因),然后只在单击图表时生成/加载图表。
我想我需要一个Ajax调用的somekind...but,我有点卡在如何继续和谷歌没有返回任何有用的东西(只是光盒的照片)
伪码:
HTML:
<img src='small chart icon.jpg' alt='click me to see chart' id='showchart'/>
<div>
rest of page goes here...
</div>C#:
public FileStreamResult GetChart(){
//generate any chart
return FileStreamResult(newchartstream, "image/png");
}JS:
<script>
$(document).ready(function(){
$('#showchart').click(function(){
//make ajax call to generate chart
//show in modal with "close" button
//OR
//open a new page as a modal?
});
});
</script>编辑
澄清:
控制器生成一个ViewModel (来自EF4模型),该模型包含大量计算结果和一些“汇总”行(总计、平均值等)。
视图将结果(ViewModel)显示为表。
要求:
单击其中一个汇总行,打开模式窗口,显示该汇总行的图表。
为了避免发送ViewModel的参数,并从零开始重新生成参数(再次执行所有的calcs等),原因有两个。
1)后端数据库中的数字可能有changed...so,图表没有反映表中显示的内容。
( 2)打电话需要时间!
我还希望只在单击行时生成图表,而不是始终加载图表,并使用jquery隐藏() show()。
我考虑过ajax调用,但不确定如何返回图像或如何打开新页面。
看不到在Url.Action()方法中传递复杂模型的方法。
认为缓存可能是最好的选择,让click方法调用新窗口的“老式”javascript,通过参数从缓存中获取对象?
发布于 2011-09-25 07:03:50
你有一些不同的问题混合在一起。你应该把它们分成一个问题。对于您的问题的标题,-loading是AJAX的图像-您可以使用下面的代码片段:
HTML:
<div id="chartholder"></div>
<a id="showchart">Show the chart</a> <!-- or any element else you want to fire show event -->JS:
$(document).ready(function(){
$("#showchart").click(function(){
// Put your controller and action (and id if presented) below:
var file = "/YourControllerToGetChart/GetChart/id"
$("<img />").attr("src", file).load(function () {
$(this) // the loaded image
.css({"some-css-you-want":"some-value"})
.appendTo($("#chartholder")); // fixed syntax
});
});
});让我知道,如果你有任何问题或需要澄清的任何部分,或你想知道如何css的div id="chartholder"显示为一个模式。干杯。
https://stackoverflow.com/questions/7510305
复制相似问题