各行の最初の列をクリックすると、テーブルの各行の下に子テーブルも表示する必要があります。親テーブルの任意の行からテーブルを切り替えることができます。
機能のスクリーンショットを添付しました。それを達成する方法を教えてください。
JavaScript :
var xml;
$.ajax(
{
url: "https://192.168.2.133:8080/sap/inv/opu/odata/sap/ZMM_CM_GR_OPENPO/zmm_gr_openpoCollection?$filter=bednr%20eq'0000000112'",
type: 'GET',
contentType: "application/xml;charset=utf-8",
dataType: "",
cache: false,
success: function (data) {
alert("Inside success");
$(data).find("content").each(function () {
$(this).find("m\\:properties, properties").each(function () {
var $info = $(this);
var mat_doc_no = $info.find("d\\:mat_doc_no, mat_doc_no").text();
var zvendor = $info.find("d\\:zvendor, zvendor").text();
var ebelp_c = $info.find("d\\:ebelp_c, ebelp_c").text();
var zz_tmdocno_c = $info.find("d\\:zz_tmdocno_c, zz_tmdocno_c").text();
var zz_tmdocno = $info.find("d\\:zz_tmdocno, zz_tmdocno").text();
var bedat = $info.find("d\\:bedat, bedat").text();
var menge_c = $info.find("d\\:menge_c, menge_c").text();
var ebeln = $info.find("d\\:ebeln, ebeln").text();
localStorage.setItem("ebeln", ebeln);
localStorage.setItem("zz_tmdocno", zz_tmdocno);
localStorage.setItem("bedat", bedat);
localStorage.setItem("zvendor", zvendor);`enter code here`
$('tbody').append('<tr id="test" ><td><input type="checkbox" class = "chcktbl" /></td><td onclick="showGRPODetails()"><u><b>' + ebeln + '</b></u></td><td>' + zz_tmdocno + '</td><td>' + bedat + '</td><td>' + zvendor + '</td></tr>');
});`enter code here`
});
},
error: function (XMLHttpRequest, textStatus, errorThrown) {
alert("Could not connect URL...!");
}
});
function showGRPODetails() {
$("#testid").toggle();
}