树枝和JavaScript

Question

我正在创建一个显示图表的页面,具体取决于在组合框中选择的类型

<div id="chartdiv"></div>

<select name="graphe" id="identifiantDeMonSelect">
<option value="Column2D">Column2D
<option value="Column3D">Column3D
<option value="Pie3D">Pie3D
<option value="Pie2D">Pie2D
</select>
<input type="submit" value="Afficher" onclick="ajax()">


<script type="text/javascript">
function ajax(){
    var xhr

    if (window.XMLHttpRequest) { 
        xhr = new XMLHttpRequest();
    }
    else if (window.ActiveXObject) 
    {
        xhr = new ActiveXObject("Microsoft.XMLHTTP");
    }

    if (xhr !=null)  {
    xhr.onreadystatechange = function() { type1(xhr); };
    xhr.open("GET", "{{ path('Ajax')}}", true);
    xhr.send(null);
    } else {

     alert("The XMLHttpRequest not supported");

  }}

function type1(xhr){
            var docXML= xhr.responseText;
            var val_type = getSelectValue('identifiantDeMonSelect');
            var type = val_type+"";
            var str="{{ asset('Charts/Pie2D.swf') }}";
            var chart = new FusionCharts(str, "ChartId", "600", "400", "0", "0");
            chart.setXMLData(docXML);                               
            chart.render("chartdiv");
            }
function getSelectValue(selectId)
{
    var selectElmt = document.getElementById(selectId);
    return selectElmt.options[selectElmt.selectedIndex].value;
}

</script>

现在,当我简单地取代var str="{{ asset('Charts/Pie2D.swf') }}";有"{{asset('Charts/'+type+'.swf') }}"为了动态地改变图表I获得以下的symfony错误的类型:"Variable "type" does not exist in ".当我把"{{ asset('Charts/"+type+".swf') }}"(我只是替换'by')我得到页面,当我点击提交按钮没有任何反应,并在控制台(铬的控制台)内我得到这个错误" GET http://127.0.0.1:8888/dashboard2/Symfony/web/Charts/"+type+".swf 404 (Not Found)".它需要它原样"+type+&quot;显然我需要帮助,我不知道这是一个连接问题,还是与树枝和资产功能有关.提前谢谢

Answer 1

我猜这是不可能的.你不能将javascript vars与twig混合,因为一个是客户端,另一个是服务器.

您可以在此处创建一条获取资产并使用资产功能的路线,而不是在此使用{{asset}}.你可以使用这个:https: //github.com/FriendsOfSymfony/FOSJsRoutingBundle

或者像这样的廉价解决方法:

route = "{{ path('myassetroute', { 'pie': "PLACEHOLDER" }) }}";
route = route.replace("PLACEHOLDER", type);