2015-06-17 2 views
2

Я хочу поднять проблему, которая возникла у меня, и не знаю, как ее исправить. Предположим, я хочу создать динамический выбор, т. Е. Если выбрать продукт, если я добавляю или удаляю продукт, выберите автоматически обновленное. например, может сделать запрос в контроллере вроде этого:Добавить select с javascript в Symfony 2

$products = $em->getRepository('MyBundle:Entity')->findAll(); 

Затем делают это таким образом:

return $this->render('MyBundle:myfolder:mytwig.html.twig', array("products" => $products)); 

И, наконец, в моем шаблоне, создать мой выбор, как это:

<select> 
{% for product in products %} 
<option value="{{ product.name }}">{{ product.name }}</option> 
{% endfor %} 
</select> 

моя проблема в том, что у меня есть выбор, где пользователь выбирает покупку продукта, а если вы хотите добавить другое, кнопкой с надписью «Добавить» включить javascript, и так далее выберите, где вы можете выбрать другой продукт uct.

Я уже сделал файла JavaScript, но если я использую прут для в продукт не узнал меня, то есть, я не могу добавить это с JavaScript:

<select> 
    {% for product in products %} 
    <option value="{{ product.name }}">{{ product.name }}</option> 
    {% endfor %} 
</select> 

долгое время, так как я с это, пожалуйста, если вы можете мне помочь. спасибо

+0

Это вас привело? не уверен, что вы хотели сказать это ... –

ответ

0

Я думаю, что включение вашего Javascript в ваш файл Twig, а не в отдельный файл, позволяет использовать {{ }}, разрешая вашу проблему.

Надеюсь, это поможет.

1

Вы могли бы сделать это с помощью JavaScript в одиночку, если вы измените свой шаблон для генерации «базовой» копии вашего <SELECT> как это (при условии, JQuery для краткости):

<div id='products_list'> 
    <select> 
    {% for product in products %} 
     <option value="{{ product.name }}">{{ product.name }}</option> 
    {% endfor %} 
    </select> 
</div> 
<button id='AddProduct'>Add</button> 
<script> 
    $('#AddProduct').on('click', function() { 
    var base = $('#products_list select:first'); 
    base.parent().append(base.clone()); 
    }); 
</script> 

(demo)