如何檢查樹枝中是否單擊了按鈕？

Question

我想在表格的樹枝文件中有一個按鈕，用於從數組（最好是索引）中刪除元素。

在完成的研究中，我不斷看到任何數據操作都應保留在控制器中。 我確定我可以用jquery完成我的解決方案，但這不會破壞數據操作規則嗎？ 還是應該在控制器中做些什么？ 我嘗試查看是否使用POST設置了按鈕，但是那沒有用...

本質上，單擊此按鈕后，將從數組中刪除相應元素的索引。 我怎樣才能做到最好呢？

另外，我只看了有關jquery的一些教程，所以我是一個完整的初學者。 如果可以，如何使用jquery完成此操作？

我在jQuery的嘗試：

cartArray.splice($.inArray(removeItem, cartArray), [0]); 

... 0是索引...我知道這行不通，因為我需要索引來知道選擇了哪個元素。

在樹枝文件中：

            <tbody>
                {% for key, cartValue in cartArray %}
                    <tr>
                        <td>{{ cartValue[0] }}</td> <!--Product-->
                        <td>{{ cartValue[1] }}</td> <!--Quantity-->
                        <td>${{ cartValue[2] }}</td> <!--Price Per Unit-->
                        <td>
                            <button type="button" class="btn btn-danger">
                            <span class="glyphicon glyphicon-remove" aria-hidden="true"></span>
                            </button>
                        </td>
                    </tr>
                {% endfor %}    
            </tbody>

我應該提到我也在使用引導程序。

在控制器中：

$cartArray = array();

    if (is_null($cartArray) || !$entity) {
        throw $this->createNotFoundException('Error: Nothin in Array/Entity');
    } else {
        $cartArray = $session->get('cartArray', []);

        $cartArray[$entity->getId()] = [$entity->getName(), $entity->getQuantity(), $entity->getPrice()];

        foreach ($cartArray as $key => $product) {
                // dump($cartArray); die;
                // dump($key); die;
                $productEntity = $em->getRepository('PaTShopTestBundle:Product')->find($key);
                $quantity = $productEntity->getQuantity();
                $price = $productEntity->getPrice();
                $totalCostOfAllProducts += $price * $quantity;
        }
    }

    //$remove = unset($cartArray);

    // if (isset($_POST['Button'])) {
    //     unset($cartArray[1]); //remove index
    // }



    $session->set('cartArray', $cartArray); //session---------------

    //var_dump($cartArray); die;

    return array(
        'price'     => $price,
        'quantity'  => $quantity,
        'totalCostOfAllProducts'   => $totalCostOfAllProducts,
        'cartArray'   => $cartArray,
        'entity'      => $entity,
        'delete_form' => $deleteForm->createView(),
    );

非常感謝您的幫助，再次感謝！

Answer 1

希望這可以幫助：

 // Simple variables, one for building a sentence from the array // and one that will be our element array var sentence = '', araEle = $('li'); // first I build the sentence for display before any removal araEle.each(function(i) { sentence += (i>0?' ':'') + $(this).text(); }); // here i use a simple jQuery/css selector to get the first fieldset's p tag $('fieldset:first p').text(sentence); // here will pretend our button was clicked and our index is 4 var index = 4; // this is simple, old fashioned vanilla JS, // there is no better jQuery alternative, // which is why they didn't make one. // the first param is the zero based index value // the second param is how many to count from there // second value is 1 if you only want to remove the one item AT index var returnsValue = araEle.splice(index, 1); // and as the variable assigned says // if you get a return from it, it will be the item, // in this case an element, // at that index // SO, if you wanted to remove the element itself afterward you could say: $(returnsValue).remove(); // reset our sentence string sentence = ''; // rebuild our sentence araEle.each(function(i) { sentence += (i>0?' ':'') + $(this).text(); }); // again simple jQuery/css selector to get the last fieldset's p tag // and display new sentence $('fieldset:last p').text(sentence); 

 <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> <ul> <li id="zero">This</li> <li id="one">is</li> <li id="two">jusT</li> <li id="three">a</li> <li id="four">[TesT]</li> <li id="five">lisT</li> </ul> <fieldset> <legend>Sentence Before Array Removal</legend> <p></p> </fieldset> <fieldset> <legend>Sentence After Array Splice at Index 4(TesT)</legend> <p></p> </fieldset>