2016-08-29 8 views
0

Ich habe ein Formular, und ich möchte weiter senden Schaltfläche deaktiviert, bis die erforderlichen Optionsfelder ausgewählt sind.Jetzt möchte ich, dass, wenn Benutzer die Optionsschaltfläche Rot überprüft dann ist Senden aktiviert, aber wenn Benutzer überprüft Grün sollte dann überprüft werden, ob jemand von Alpha oder Beta ausgewählt ist oder nicht, wenn ausgewählt, dann submit button aktivieren, ansonsten bleibt er deaktiviert, bis der Benutzer einen von ihnen überprüft. Hier ist meine Vorlage und Jquery Code.Problem beim Senden Schaltfläche senden auf Radiobutton mit jquery

<div class="type1"> 
    <div id="Red"> 
     <input type="radio" class="colorType red" name="colorType" value="Red">Red 
    </div> 
    <div id="Green"> 
     <input type="radio" class="colortype green" name="colorType" value="Green">Green 
    </div> 
    </div> 
    <div class="type2"> 
    <input type="radio" class="frequency" name="frequency" value="alpha">Alpha 
    <input type="radio" class="frequency" name="frequency" value="beta">Beta 
    </div> 
    <span class="float-right"> 
    <button class="button-save" disabled>Save &#38; Close</button> 
</span> 

Mein JavaScript-Code ist

events : { 
    'change .colorType': 'removeDisable' 
}, 
    removeDisable : function(){ 
    if ($('.red').is(':checked')) { 
     $(".button-savel").attr("disabled", false); 
    } else if ($('.green').is(':checked')) { 
     if ($('.frequency').is(':checked')) { 
     $(".button-save").attr("disabled", false); 
     }else { 
     $(".button-save").attr("disabled", true); 
     } 

    } else { 
     return false; 
    } 
    }, 

alles funktioniert gut, aber wenn ich auf Grün und wählen Sie Alpha klicken oder Beta dann auf die Schaltfläche aktiviert bekommen nicht. sonst, wenn ich auf den roten Knopf klicke, wird aktiviert. Mein Javascript ist für Backbone js.

+0

Verwenden Sie 'prop' anstelle von' attr' und 'is' http://api.jquery.com/prop/ – Aaron

+0

Sie sollten keine globalen Selektoren wie diese in Backbone-Ansicht verwenden ... –

+0

if ($ (' .frequency: checked '). length) das sollte in Ordnung sein –

Antwort

0

So habe ich das Problem herausgefunden, ich brauche ein anderes auf Änderungsereignis nach dem Klicken auf grün. Das Erstellen eines On-Change-Ereignisses auf der Frequenz und das anschließende Aufrufen dieser Funktion beim Klicken auf "Grün" lösten das Problem.

events : { 
'change .colorType': 'removeDisable', 
'change .frequency': 'frequencyChange' 
}, 
frequencyChange : function(){ 
if ($('.frequency').is(':checked')) { 
    $(".button-save").attr("disabled", false); 
    }else { 
    $(".button-save").attr("disabled", true); 
    } 
}, 
removeDisable : function(){ 
if ($('.red').is(':checked')) { 
    $(".button-savel").attr("disabled", false); 
} else if ($('.green').is(':checked')) { 
    $(".button-save").attr("disabled", true); 
this.frequencyChange(); 
} else { 
    return false; 
} 
}, 

Dies löste das Problem. Gut, dass ich Fehler beheben konnte.

0

Ich vermute, dass die .is() Prüfung nicht erfolgreich ist, weil es zwei Punkte zu überprüfen und beide nicht zur gleichen Zeit überprüft werden können - vielleicht versuchen Sie jeden einzeln mit einem 'oder' Vergleich?

if ($($('.frequency')[0]).is(':checked') || $($('.frequency')[1]).is(':checked')) { 

viel glück!

+0

Versucht, dasselbe Problem :( – zee

+1

'$ ('. frequency ') [0]' soll '$ ($ ('. frequency ') [0 ]) ', da Sie versuchen, die' is'-Methode aufzurufen, die nur für jQuery-Objekte implementiert ist –

+0

aktualisierte Antwort nach @Sushanth - 's comment - guter Aufruf, da der Array-Zugriff eines jquery-Objekts DOM-Elemente zurückgibt keine jQuery-Objekte – derelict

Verwandte Themen