腳本標記不附加到表

我不知道爲什麼我總是有最奇怪的問題。我正在使用Kendo UI Charting。它位於PartialView中。當PartialView被jQuery調用時，它會在運行時生成div和一些jQuery代碼。我將整個div和JQ代碼添加到表格行中單擊的行下方。問題是，它只附加div，它忽略了腳本標記及其代碼，這是渲染圖表所必需的。腳本標記不附加到表

我PartialView是：

@(Html.Kendo().Chart() 
     .Name("XXXProducts") 
     .Title("XXX Products") 
     .Legend(legend => legend 
      .Visible(false) 
     ) 
     .ChartArea(chartArea => chartArea 
      .Background("transparent") 
     ) 
     .Series(series => 
     { 
      series.Bar(Model.SalesAxis).Name("Total Sales"); 
     }) 
     .CategoryAxis(axis => axis 
      .Categories(Model.MonthsAxis) 
      .MajorGridLines(lines => lines.Visible(false)) 
     ) 
     .ValueAxis(axis => axis 
      .Numeric() 
      .Max(Model.SalesAxis.Max() + 100) 
      .Line(line => line.Visible(false)) 
      .MajorGridLines(lines => lines.Visible(true)) 
     ) 
     .Tooltip(tooltip => tooltip 
      .Visible(true) 
      .Template("#= series.name #: #= value #") 
     ) 
)

我的jQuery的其他頁面上的代碼來渲染視圖：

function RenderChart(row) { 

    var rowIndex = $("#tblDetail").find($(row)).index() + 1; 
    var chartData = ''; 

    $.get('@Url.Action("MonthlyChart", "Chart")', function (data) { 
     chartData = "<tr style='height:300px;'><td colspan='5'>" + data + "</td></tr>"; 
     $('#tblDetail tr:nth-child(' + rowIndex + ')').after(chartData); 
    }); 
}

當我提醒「chartData」，它顯示以下內容：

<tr><td colspan='5'><div class="k-chart" id="XXXProducts"></div><script> jQuery(function(){jQuery("#XXXWaterProducts").kendoChart({"chartArea":{"background":"transparent"},"title":{"text":"Site Visitors Stats /thousands/"},"legend":{"visible":false},"series":[{"name":"Total Sales","type":"bar","data":[56000,74500,45000,86000,49850,63482,97600,63250,79860,42100,32010,89200]}],"categoryAxis":[{"majorGridLines":{"visible":false},"categories":["January","February","March","April","May","June","July","August","September","October","November","December"]}],"valueAxis":[{"majorGridLines":{"visible":true},"line":{"visible":false},"max":97700}],"tooltip":{"template":"#= series.name #: #= value #","visible":true}});});</script> </td></tr>

但是，當我檢查源時，它只顯示：

<tr><td colspan='5'> <div class="k-chart" id="XXXProducts"></div></td></tr>

腳本標記無處可查。

來源

2013-06-26 Zorro

感嘆。您不能追加駐留在字符串中的腳本標籤。這個問題已經被問及已經答覆了上百次了...... – mekwall

你可以使用eval（）方法從字符串運行js腳本。 – YD1m

生成客戶端代碼不是很好的做法。在你的情況下最好是返回生成的div的數據屬性中的json數據。之後，您可以使用JSON.parse()方法和運行創建圖表的方法解析字符串從數據屬性到對象。

function RenderChart(row) { 

    var rowIndex = $("#tblDetail").find($(row)).index() + 1; 
    var chartData = ''; 

    $.get('@Url.Action("MonthlyChart", "Chart")', function (data) { 
     var dataObj = JSON.parse(data); 
     chartData = "<tr style='height:300px;'><td colspan='5'></td></tr>"; 
     $('#tblDetail tr:nth-child(' + rowIndex + ')').after(chartData); 
     $("#XXXWaterProducts").kendoChart(dataObj); 
    }); 
}

您需要修改@ Url.Action（「MonthlyChart」，「圖表」）與JSON數據返回onlu串。也可以返回JsonResul類型並使用$.getJSON方法避免使用json解析（var dataObj = JSON.parse（data）;）

來源

2013-06-26 08:39:08 YD1m

腳本標記不附加到表

回答

相關問題