Kann RadioButton mit JQuery nicht verwenden - Warnung wird nicht angezeigt

Question

Ich habe zwei Optionsfelder und ich möchte eine Warnung anzeigen, wenn einer von ihnen aktiviert ist, scheint es, dass das Problem ist, dass es das Element nicht erkennt, weil Die Warnung wird nicht angezeigt!

Dieser Code verwendet zu arbeiten, aber es mehr nicht (ich glaube ich die Id eines der Elemente verändert und das ist, was das Problem verursacht)

JS:

/*This function is responsible for for the radio buttons*/ 
$(function() { 
    $(".r1").checkboxradio({ 
     icon: false 
    }); 
}); 
/*This function changes the RecordTypeId according to the BankEmployeeCheckbox*/ 

$("form input:radio").change(function() { 
    if ($(this).val() == "Yes") { 
     document.getElementById("recordType").value = "01220000000FdvyAAC"; 
     alert("Yes"); 

    } else { 
     document.getElementById("recordType").value = "01220000000FffjAAC"; 
     console.log(document.getElementById("recordType").value); 
     alert("No"); 
    } 
}); 

HTML

<form method='post' id='prechatForm' autocomplete="on"> 
     <div id="bankEmployeeYesNoRadioButtonDiv"> 
      <label>{!$Label.Bank_Employee}</label><br/> 
      <label for="radio-1" class="radioLabel">{!$Label.Yes}</label> 
      <input type="radio" name="liveagent.prechat:BankEmployee" id="radio-1" class="r1" value="Yes"></input> 
      <label for="radio-2" class="radioLabel">{!$Label.No}</label> 
      <input type="radio" name="liveagent.prechat:BankEmployee" id="radio-2" class="r1" value="No"></input> 
     </div> 
</form> 

Ergebnis: Wenn ich auf einen Radiobutton klicken nichts passiert, kein Alarm. Keine Konsolenfehler Notizen: Bitte beachten Sie, dass ich Salesforce (Visualforce) -Syntax verwende.

Answer 1

ändern diese:

/*This function is responsible for for the radio buttons*/ 
$(function() { 
    $(".r1").checkboxradio({ 
     icon: false 
    }); 
}); 
/*This function changes the RecordTypeId according to the BankEmployeeCheckbox*/ 

$("form input:radio").change(function() { 
    if ($(this).val() == "Yes") { 
     document.getElementById("recordType").value = "01220000000FdvyAAC"; 
     alert("Yes"); 

    } else { 
     document.getElementById("recordType").value = "01220000000FffjAAC"; 
     console.log(document.getElementById("recordType").value); 
     alert("No"); 
    } 
}); 

Um dies:

/*This function is responsible for for the radio buttons*/ 
$(function() { 
    $(".r1").checkboxradio({ 
     icon: false 
    }); 
    /*This function changes the RecordTypeId according to the BankEmployeeCheckbox*/ 

    $("form input:radio").change(function() { 
     if ($(this).val() == "Yes") { 
      document.getElementById("recordType").value = "01220000000FdvyAAC"; 
      alert("Yes"); 

     } else { 
      document.getElementById("recordType").value = "01220000000FffjAAC"; 
      console.log(document.getElementById("recordType").value); 
      alert("No"); 
     } 
    }); 

}); 

Answer 2

Ihre jQuery-Selektor ist falsch, so dass dies ändern:

<div id="bankEmployeeYesNoRadioButtonDiv"> 
    <label>{!$Label.Bank_Employee}</label><br/> 
    <label for="radio-1" class="radioLabel">{!$Label.Yes}</label> 
    <input type="radio" name="liveagent.prechat:BankEmployee" id="radio-1" class="r1" value="Yes"></input> 
    <label for="radio-2" class="radioLabel">{!$Label.No}</label> 
    <input type="radio" name="liveagent.prechat:BankEmployee" id="radio-2" class="r1" value="No"></input> 
</div> 

zu:

<form id="bankEmployeeYesNoRadioButtonDiv"> 
    <label>{!$Label.Bank_Employee}</label><br/> 
    <label for="radio-1" class="radioLabel">{!$Label.Yes}</label> 
    <input type="radio" name="liveagent.prechat:BankEmployee" id="radio-1" class="r1" value="Yes"></input> 
    <label for="radio-2" class="radioLabel">{!$Label.No}</label> 
    <input type="radio" name="liveagent.prechat:BankEmployee" id="radio-2" class="r1" value="No"></input> 
</form> 

Answer 3

Ihr viele Fehler haben ... Sie versuchen, "Form" in Ihre js zu finden, aber Sie haben kein Form-Tag in Ihrem HTML, Sie haben auch kein Tag mit dieser ID: "recordType". Allerdings ist Ihre Warnung gut :)

Das nächste Mal, nur F12 (öffnen Sie Ihre Browser-Konsole) und lesen Sie die Fehler.

EDIT: In JQuery UI

$("document").ready(function() { 
 
    $(".r1").checkboxradio({ 
 
     icon: false 
 
    }); 
 

 
    $(".r1").change(function() { 
 
     if ($(this).val() == "Yes") { 
 
      alert("Yes"); 
 
     } else { 
 
      alert("No"); 
 
     } 
 
    }); 
 
});

<!DOCTYPE html> 
 
<html> 
 

 
<head> 
 
    <meta charset="utf-8" /> 
 
    <link rel="stylesheet" href="style.css" /> 
 
    <link rel="stylesheet" href="https://code.jquery.com/ui/1.12.1/themes/base/jquery-ui.css" /> 
 
    <title>Test</title> 
 
</head> 
 

 
<body> 
 
    <!-- Modal Register --> 
 
    <div id="bankEmployeeYesNoRadioButtonDiv"> 
 
     <label>{!$Label.Bank_Employee}</label><br/> 
 
     <label for="radio-1" class="radioLabel">{!$Label.Yes}</label> 
 
     <input type="radio" name="liveagent.prechat:BankEmployee" id="radio-1" class="r1" value="Yes" /> 
 
     <label for="radio-2" class="radioLabel">{!$Label.No}</label> 
 
     <input type="radio" name="liveagent.prechat:BankEmployee" id="radio-2" class="r1" value="No" /> 
 
    </div> 
 
    <!--/ Modal Register --> 
 
    <script src="https://code.jquery.com/jquery-3.2.1.min.js"></script> 
 
    <script src="https://code.jquery.com/ui/1.12.1/jquery-ui.min.js"></script> 
 
    <script src="./script.js"></script> 
 
</body> 
 

 
</html>