2016-05-09 17 views
1

Ich habe eine Teilansicht in meinem MVC Webshop, die meinen Warenkorb anzeigt, aber aus irgendeinem Grund kann ich nicht auf die Schaltfläche "Papierkorb" klicken.klicken Sie auf die Schaltfläche nicht auslösen jquery Funktion

Dies ist mein aktueller Code.

@model ShoppingCart 
 
@foreach (var product in Model.Items) 
 
{ 
 
    <li> 
 
     <div class="b-cart-table "> 
 
      <a href="#" class="image"> 
 
       <img width="70" height="70" src="@product.ImageUrl" alt="/"> 
 
      </a> 
 
      <div class="caption"> 
 
       <a class="product-name" href="#">@product.Name</a> 
 
       <span class="product-price">@product.Quantity x $ @product.Price.ToString("00.00").Replace(",", ".")</span> 
 
       <div class="rating"> 
 
        <span class="star"><i class="fa fa-star"></i></span> 
 
        <span class="star"><i class="fa fa-star"></i></span> 
 
        <span class="star"><i class="fa fa-star"></i></span> 
 
        <span class="star"><i class="fa fa-star"></i></span> 
 
        <span class="star star-empty"><i class="fa fa-star-o"></i></span> 
 
       </div> 
 
      </div> 
 

 
      <button onclick="remove();" class="btn btn-remove removeitem"><i class="fa fa-trash fa-lg"></i></button> 
 
     </div> 
 
    </li> 
 
} 
 
<li> 
 
    <div class="products-subtotal text-right"> 
 
     Cart Subtotal <span class="subtotal-price">$ @Model.TotalPrice().ToString("00.00").Replace(",", ".")</span> 
 
    </div> 
 
</li> 
 

 
@section scripts{ 
 
    <script> 
 
     $(document).ready(function() { 
 
     $(document).on("click", ".removeitem", function() { 
 
      alert($(this).text()); 
 
     }); 
 

 
     var remove = function(){ 
 
      alert("trigger"); 
 
     } 
 
     }; 
 
    </script> 
 
});

Ich weiß, dass mehrere Klick/Funktion auf den Button gibt es aber sein nur zu zeigen, was ich bisher ausprobiert habe.

+0

Dies sollte funktionieren, für diesen Fall könnten Sie auch $ (". Removeitem") verwenden. Click (function() {console.log ("Event ok");}); Ich rate Ihnen, console.log() anstelle von alert() zu verwenden, siehe Konsole und Entwickler-Tools, indem Sie F12 drücken. Die remove() - Funktion kann aufgrund des definierten Kontexts aufgerufen werden, indem sie im globalen Kontext aus ready() entfernt wird. – Loenix

Antwort

0

Ich bin irgendwie sicher sein Du:

@section scripts{ 
} 

ich nicht zu 100% erklären kann, warum, aber wenn ich diese in einer Teilansicht Ich kann entweder meinen Code funktioniert. Versuchen Sie, den Code auf Ihrer Layoutseite oder der Seite mit der Teilansicht zu entfernen, und versuchen Sie es dann.

+0

Das hat funktioniert, ich habe mein Skript auf die Seite verschoben, die die Teilansicht enthält, und es funktioniert jetzt. Danke vielmals –

3

Sie einen Tippfehler Fehler haben, wenn Sie das Dokument fertig Funktion init, sollte es sein:

$(document).ready(function() { 

}); // here is your error 

Auch der Name der Funktion ändern, weil remove() eine Funktion jQuery ist.

Fiddle: https://jsfiddle.net/64pmstja/9/

Quelle: https://api.jquery.com/remove/

+0

Korrigieren Sie das Problem immer noch nicht –

+0

Ändern Sie den Namen der Funktion, da 'remove()' eine jQuery-Funktion ist. Fiddle: https://jsfiddle.net/64pmstja/9/ –

1

Die Methode, die Sie entfernen verwenden() ist ein jquery Verfahren zu entfernen oder ein Element aus DOM selbst zu löschen. Alle mit den Elementen verknüpften gebundenen Ereignisse und jQuery-Daten werden entfernt. https://api.jquery.com/remove/

Verwandte Themen