-1
私のデータベースに投稿要求を送信していて、応答に応じて、JSPページに新しいチェックボックスを動的に作成しています。このように（ここではgetMediums関数は私のJSPページ内の別のコンポーネントのonclickのイベントハンドラです）：動的に追加されたチェックボックスの値が機能しません
function getMediums(str)
{
currentClass = str; // save the current class
<%
String classStart = "<script>document.writeln(str)</script>";
HashMap<String, ArrayList<String> > medSubjects;
if(!tutoringInfoAcademic.containsKey(classStart)){ // first click
medSubjects = new HashMap<>();
tutoringInfoAcademic.put(classStart,medSubjects); // opening a blank map
}
else{ // already selected some medium of this class
medSubjects = tutoringInfoAcademic.get(classStart);
}
%>
// javascript code
var data = {};
data["classStart"] = str;
$.post('PopulateMedium',data,function(responseJson){
if(responseJson!=null){
var td = document.getElementById("mediums");
$(td).empty(); // deletes previous contents
$.each(responseJson,function(key,value){
var temp = value;
console.log(temp); // prints as per expected
var checked = "";
<%
String t = "<script>document.writeln(temp)</script>";
if(medSubjects.containsKey(t)){
// already selected, so check this checkbox
%>
checked = "checked";
<%
}
%>
td.innerHTML += " <input type='checkbox' onclick='medCheckboxOnClick()' name='mediumCheckbox' value=" + temp + " " +checked + "/>";
if(value == 'bm')td.innerHTML += "Bangla medium"
else if(value == 'em')td.innerHTML += "English medium";
else if(value == 'ev')td.innerHTML += "English version";
td.innerHTML += "<br/>";
})
}
});
}
チェックボックスが期待どおりに作成されます。 onclickの機能は：
function medCheckboxOnClick(){
var t = $(this).attr("value"); // bm, em, ev
console.log("entered into the checkbox onclick function");
if($(this).is(":checked")) {
console.log("checkbox for class "+currentClass+" and medium "+t+" has been checked");
<%
String id = "<script>document.writeln(t)</script>";
String currentClassStart = "<script>document.writeln(currentClass)</script>";
if(tutoringInfoAcademic.containsKey(currentClassStart)){ // redundant check
ArrayList<String> listOfSubjects = tutoringInfoAcademic.get(currentClassStart).get(id);
if(listOfSubjects == null){ // first clicked
listOfSubjects = new ArrayList<>();
tutoringInfoAcademic.get(currentClassStart).put(id,listOfSubjects);
System.out.println(tutoringInfoAcademic.get(currentClassStart));
}
else{ // list of subjects already created. either some subject has been chosen or not
}
}
%>
}
else{
console.log("checkbox for class "+currentClass+" and medium "+t+" has been unchecked");
<%
String ID = "<script>document.writeln(t)</script>";
String curClassStart = "<script>document.writeln(currentClass)</script>";
if(tutoringInfoAcademic.containsKey(currentClassStart)){ // redundant check
tutoringInfoAcademic.get(currentClassStart).remove(ID);
}
%>
}
}
私は動的に作成されたチェックボックスのいずれかをクリックし、実行はmedCheckboxOnClick()機能に入り、このようなものが出てくる：私は設定しても
checkbox for class 1 and medium undefined has been unchecked
tは、未定義のままチェックボックスを作成している間、前の機能のチェックボックスの値。さらに、チェックボックスをチェックしたかどうかに関係なく、常にUNCHECKを考慮します。ここではcurrentClassはグローバルなjavascript変数で、コントローラクラスからセッション属性としてtutoringInfoAcademicが設定されています。
HashMap<String, HashMap<String, ArrayList<String> > > tutoringInfoAcademic = new HashMap<>();
なぜチェックボックスの値は未定義のままですか？そして、なぜ私はclickイベントハンドラによって捕捉されたuncheckイベントをいつも得るのですか？