2017-02-13 2 views
0

Warum button nicht deaktiviert ist, wenn der Wert für jede Box gleich ist.jQuery, wenn die Bedingung aufgrund der Bedingungen nicht richtig funktioniert

Ich habe 4 Textfelder, 2 Textfelder für den Vergleich Abteilung Name und 2 Textfelder für den Vergleich Abteilung aktiv.

$("#departmentIDInput, #departmentNameInput, #departmentActive").bind("keyup change", function() { 
 
    var departmentIDInput = $("#departmentIDInput").val(); 
 
    var departmentNameInput = $("#departmentNameInput").val(); 
 
    var departmentNameInputCurrent = $("#departmentNameInputCurrent").val(); 
 
    var departmentActive = $("#departmentActive").val(); 
 
    var departmentActiveVal = $("#departmentActiveVal").val(); 
 
    var departmentActiveValCurrent = $("#departmentActiveValCurrent").val(); 
 

 
    if (departmentNameInput != departmentNameInputCurrent) { 
 
    $("#btnUpdate").attr('disabled', false).removeClass('btn_inact').addClass('btn_act'); 
 
    } else { 
 
    $("#btnUpdate").attr('disabled', true).removeClass('btn_act').addClass('btn_inact'); 
 
    } 
 

 
    if (departmentActiveVal == departmentActiveValCurrent) { 
 
    $("#btnUpdate").attr('disabled', false).removeClass('btn_inact').addClass('btn_act'); 
 
    } else { 
 
    $("#btnUpdate").attr('disabled', true).removeClass('btn_act').addClass('btn_inact'); 
 
    } 
 
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<input type="text" id="departmentNameInput" name="departmentNameInput" maxlength="30" value="Production"/> 
 
<input type="text" id="departmentNameInputCurrent" name="departmentNameInputCurrent" maxlength="30" value="Production"/> 
 

 
<input type="text" name="departmentActiveVal" class="departmentActiveVal" id="departmentActiveVal" value="Y"/> 
 
<input type="text" name="departmentActiveValCurrent" class="departmentActiveValCurrent" id="departmentActiveValCurrent" value="Y"/> 
 

 
<input type="checkbox" class="departmentActive" id="departmentActive" /> 
 

 
<input type="button" class="button turquoise" id="btnUpdate" value="Update" disabled/>

  1. Wenn Checkbox klicken oder un-klicken, wird der Button gute
  2. Arbeits Wenn Typ etwas zu "departmentNameInput", Beispiel: Productions (On departmentNameInputCurrent ist: Die Produktion), die Button funktioniert gut, bedeutet deaktiviert. Aber wenn ich versuche, den Text wieder mit "departmentNameInputCurrent" wieder zu löschen, ist die Schaltfläche nicht deaktiviert.

Wer hat eine Idee?

+0

Es gibt keine Taste in Ihr HTML-Beispiel. Verwenden Sie auch 'prop()' nicht 'attr()', um den deaktivierten Zustand der Schaltfläche zu setzen –

Antwort

0

Die Schaltfläche ist nicht deaktiviert, wenn der Wert für jede Box wegen Ihrer zweiten If-Bedingung identisch ist.

if (departmentActiveVal == departmentActiveValCurrent) { 
    $("#btnUpdate").attr('disabled', false).removeClass('btn_inact').addClass('btn_act'); 
    } 

Dies true ausgewertet und die Taste

aktiviert sein
+0

Jeder Trick, um das zu tun? –

+0

Sie müssen nur ein einfaches und - if (departmentNameInput! = DepartmentNameInputCurrent && dentureActiveVal == dentureActiveValCurrent) {... – Janar

0

Sie können versuchen, Ihre Funktionen im ternären Betrieb wie die Vereinfachung:

$("#departmentIDInput, #departmentNameInput, #departmentActive").bind("keyup change", function() { 
 
    var departmentIDInput = $("#departmentIDInput").val(); 
 
    var departmentNameInput = $("#departmentNameInput").val(); 
 
    var departmentNameInputCurrent = $("#departmentNameInputCurrent").val(); 
 
    var departmentActive = $("#departmentActive").val(); 
 
    var departmentActiveVal = $("#departmentActiveVal").val(); 
 
    var departmentActiveValCurrent = $("#departmentActiveValCurrent").val(); 
 
    var isNameEqual = departmentNameInput === departmentNameInputCurrent; 
 
    var isActiveValueEqual = departmentActiveVal === departmentActiveValCurrent; 
 
    var isDisabled = isNameEqual && isActiveValueEqual; 
 

 
    $("#btnUpdate").prop('disabled', isDisabled).removeClass('btn_inact').addClass('btn_act'); 
 
});

Verwandte Themen