将图像传递到剑道弹出窗口[请求Uri太长414]

Question

我的网页有剑道网格加载图像和一个“图形地图”按钮。

我提供了一个最小化的版本，我的观点如下

<div class="container" onclick="onContainerClick();">
<div class="row">
    <div id="tabstrip"></div>
    <div class="col-md-12 table-responsive table-bordered" style="padding-right: 0px; padding-left: 0px" id="mapsDiv" width="100%">

    </div>
</div>
<div class="row col-md-12 col-md-push-11">
    <button id="btnGraph" onclick="onShowGraph()">Graph Map</button>
</div>

   <div id="graphsWindow" >
   <div class="table" style="height:700px;">
    <div class="row" style="margin-left:0px;margin-top:0px; padding-top:0px; padding-bottom:0px">

    <div style="border:groove; margin-left:10px; margin-bottom:0px; padding-bottom:0px; margin-right:2px;" class="col-md-2">
        <div class="row" style="padding-top:5px; margin-top:0px; padding-left:5px; padding-right:5px">
            <div class="col-md-1" style="padding-left:0px; margin:0px; width:auto;">
                <img src="~/Images/profile.png" height="85" width="85" id="studentPhoto"/>
            </div>
          </div>
       </div>
    </div>
  </div>
</div>

关于显示图

function onShowGraphs(){
  var window = $("#graphsWindow").data("kendoWindow");
  ...
  var grid = $('#mapsDiv').data("kendoGrid");
        var rows = grid.dataSource.data();

  $('#studentPhoto').attr("src", rows[_currGridRowNo]["photo"]);

  window.open().center();
}

在这种情况下，我得到错误[请求Uri太长414]。

>

尽管窗口在同一视图中，但为什么kendoWindow将此数据作为查询字符串？

如何纠正此问题？

Answer 1

我只要加上“数据:图片/gif；base64，”。所以我的功能变成了

function onShowGraphs(){
var window = $("#graphsWindow").data("kendoWindow");
 ...
var grid = $('#mapsDiv').data("kendoGrid");
var rows = grid.dataSource.data();

$('#studentPhoto').attr("src", "data:image/gif;base64," + rows[_currGridRowNo]["photo"]);

window.open().center();}