Deaktivieren und Ändern der Schaltfläche Symbol nach dem Hinzufügen/Klicken C# asp .net mvc5

Question

Ich möchte Button-Symbol ändern und deaktivieren Sie die Schaltfläche, nachdem ich auf das Objekt geklickt/hinzugefügt. Ich dachte, Javascript zu verwenden, um diese Behandlung zu erreichen.

etwas wie folgt aus:

--javascript--

$('#catBut').click(function(){ 
    $(this).find('span') 
     .toggleClass('glyphicon glyphicon-plus') 
     .toggleClass('glyphicon glyphicon-ok'); 
    }) 

;

--view--

@using (Html.BeginForm("Add", "VerlangLijst", new { naam = materiaal.Naam }, FormMethod.Post)) 
{ 
    <button id="catBut" type="submit" class="btn btn-default"> 
     <span class="glyphicon glyphicon-plus"></span> 
    </button> 
} 

Aber irgendwie funktioniert es nicht. Ich habe die neue .js-Datei zur bundleConfig hinzugefügt.

Kann mir jemand sagen, was los ist?

dank

Answer 1

Versuchen

Ändern

$(this).find('span').toggleClass('glyphicon glyphicon-plus').toggleClass('glyphicon glyphicon-ok'); 

zu

$(this).find('span').addClass('glyphicon-ok').removeClass('glyphicon-plus'); 

die Taste zu deaktivieren:

$('#catBut').prop("disabled",true); 

Answer 2

die Taste zu deaktivieren, versuchen so etwas wie:

Dadurch wird das "Plus" -Symbol von der Schaltfläche entfernt, das "OK" -Symbol hinzugefügt und disabled = true auf die Schaltfläche "catBut" gesetzt und somit deaktiviert.

Sie können auch versuchen (wenn die obige Lösung nicht funktioniert):

$(document).on("click", "#catBut", function(){ 
    $('#catBut').find('span').removeClass('glyphicon-plus').addClass('glyphicon-ok'); 
    $('#catBut').prop("disabled", true); 
}); 

ODER

$(document).on("click", "#catBut", function(){ 
    $('#catBut').find('span').toggleClass('glyphicon-plus').toggleClass('glyphicon-ok'); 
    $('#catBut').prop("disabled", true); 
});