表中の複数行のセレクトボックスに値を表示したい

実現したいこと

複数行に表示するセレクトボックスの値を表示したい

前提

データベースから1件のテスト(複数生徒分)の成績を抽出し、
一覧表示しようとしています。ajaxを使用しています。
1行には行No,生徒名,成績(点数),評価A,評価B の5項目が
表示されます。
成績(点数)は2000点満点の数値です。
評価Aと評価Bはそれぞれ 0~5までの数値です。データベース内では
「evaluate」として2桁の文字列で格納されています。(ex. 03,14,22)
表示するときには分解して、「評価A」「評価B」として表示します。

行数は多くても20行程度で、通常は5~10行程度です。

「評価A」及び「評価B」はセレクトボックスを使って入力→表示
したいと思っていますが、うまく表示されません。

発生している問題・エラーメッセージ

特にエラー表示はありませんが、コンソールは console.log("evalA_Str=======" + evalA_Str); が表示されて終わっています

該当のソースコード

javascript

1$.ajax({2 type: "POST",3 url: "../code/record/RecordListByTest.php",4 data: {"testId":testId}, 5 dataType: 'text',6 7}).done(function(response_j) {8 9 const json = JSON.parse(response_j);10 gGyoNo = json.length11 12 let res = '';13 14 for (var i = 0; i < json.length; i++){15 const testId = json[i].testId16 const testTitle = json[i].testTitle17 const evalA_Str = json[i].evaluationAB.substr(0, 1);18 console.log("evalA_Str=======" + evalA_Str);19 $('#evalA"' + i + '"').get(0).value = evalA_Str;20 21 const evalB_Str = json[i].evaluationAB.substr(1, 1);22 $('#evalB"' + i + '"').get(0).value = evalB_Str;23 24 // カンマ編集25 let record = comma(json[i].record);26 27 let j = i + 1;28 res += '<tr>'29 + '<td>' + (i + 1)30 + '<input type="hidden" id="recordId' + i + '" value="' + json[i].recordId + '">'31 + '<input type="hidden" id="seitoId' + i + '" value="' + json[i].seitoId + '">'32 + '</td>'33 + '<td>' + json[i].seitoName + '</td>'34 + '<td class="text-right"><input class="text-right" type="text" id="record' + i + '" value="' + record + '"></td>'35 + '<td class="text-right"'36 + '<select id="evalA' + i + '" class="form-control" >'37 + '<option value="0">0</option>'38 + '<option value="1">1</option>'39 + '<option value="2">2</option>'40 + '<option value="3">3</option>'41 + '<option value="4">4</option>'42 + '<option value="5">5</option>'43 + '</select></td>'44 + '<td class="text-right">'45 + '<select id="evalB' + i + '" class="form-control">'46 + '<option value="0">0</option>'47 + '<option value="1">1</option>'48 + '<option value="2">2</option>'49 + '<option value="3">3</option>'50 + '<option value="4">4</option>'51 + '<option value="5">5</option>'52 + '</select></td>'53 + '</tr>';54 }55 var obj = document.getElementById("datatableTestList");56 obj.innerHTML = '<dl class="row">'57 + '<input type="hidden" id="testId" value=' + testId + '>'58 + '<dt>タイトル: </dt>'59 + '<dd>' + testTitle + '</dd>'60 + '<dt>  実施日: </dt>'61 + '<dd>' + testStartDate + '</dd>'62 + '</dl>'63 + '<table class="table"><tr><th align="center" bgcolor="FFF0F5">NO</th><th align="center" bgcolor="FFF0F5">生徒名</th><th align="center" bgcolor="#FFF0F5">成績</th><th align="center" bgcolor="#FFF0F5">評価A</th><th align="center" bgcolor="#FFF0F5">評価B</th></tr>'64 + res 65 + '</table>';66}).fail(function(response_j) {67 alert('記録情報を検索できませんでした。管理者にご連絡下さい。T');68});

試したこと

$('#evalA"' + i + '"') あたりを変えたり、「value」を入れてみたり、よくわからないまま selectedindex を使ったりしましたが、うまくいきませんでした。

補足情報(FW/ツールのバージョンなど)

ここにより詳細な情報を記載してください。

コメントを投稿

0 コメント