2 つのファイルを作成しました。1 つは html ファイルで、もう 1 つは php ファイルです。Javaスクリプトで配列を作成しました。Java スクリプトで動的テーブルを作成し、HTML ファイルから値を取得して配列に渡します。また、クリックイベントを作成しました。HTMLページからボタンがクリックされるたびに、Javaスクリプトの値または配列をJavaスクリプトからPHPページに送信したいと考えています。
PHP で値を取得すると、値が表示されません。私を案内してください。以下は私のコードです。
var t = 0;
var counter = 0;
var Arr1 = [];
var Arr2 = [];
function addTable() {
var myTableDiv = document.getElementById("myDynamicTable");
var table = document.createElement('TABLE');
table.border='1';
table.name = "tables[]";
table.setAttribute('id', 'tables'+counter);
table.setAttribute('align', 'center');
var row = document.getElementById('txt_rows').value;
var col = document.getElementById('txt_column').value;
var j;
// creating all cells
for(j = 0; j < row; j++) {
// creates a <tr> element
var mycurrent_row = document.createElement("tr");
for(var i = 0; i < col; i++) {
// creates a <td> element
var mycurrent_cell = document.createElement("td");
//appends img tag to table data node
//mycurrent_cell.appendChild(imgTag)
var div1 = document.createElement('div');
div1.style.width = "200px";
div1.style.height = "20px";
div1.style.align = "center";
div1.setAttribute('id', "tables"+counter+""+j+""+i);
//mycurrent_cell.appendChild(currenttext);
mycurrent_cell.appendChild(div1);
// appends the cell <td> into the row <tr>
mycurrent_row.appendChild(mycurrent_cell);
}
table.appendChild(mycurrent_row);
}
// appends <tbody> into <table>
// appends <table> into <body>
myTableDiv.appendChild(table);
// sets the border attribute of mytable to 2;
var arr1 = new Array();
var arr2 = new Array();
var table1 = document.getElementById('tables'+counter);
var cells1 = table1.getElementsByTagName('div');
//var bbb = document.getElementById('cell_id');
for (var ii=0,len=cells1.length; ii<len; ii++){
cells1[ii].onclick = function(){
//console.log(this.innerHTML);
/* if you know it's going to be numeric:
console.log(parseInt(this.innerHTML),10);
*/
//var xyz = this.innerHTML;
var str1 = this.id;
var len1 = str1.length;
var len2 = counter.toString().length;
var cell_Id=str1.slice(6+len2,len1);
var _ele = document.getElementById(this.id);
var btnOk = document.getElementById('btn_Ok');
btnOk.onclick = function(){
var newText;
var newLabel;
//document.getElementById("txt_name").style.fontSize = size
//var getPropery = document.getElementById("getProperties");
if(_ele.innerHTML == '')
{
var getName = document.getElementById("txt_name").value;
var element = document.getElementById("sel_element").value;
var selectFont = document.getElementById("fontChanger").value;
var selectFontValue = document.getElementById("font").value;
var selectColor = document.getElementById("txt_color").value;
var alpha_num = document.getElementById("char").value;
var text_form = document.getElementById("txt_from").value;
var text_to = document.getElementById("txt_to").value;
if(selectColor == '#008000')
{
var para = document.getElementById("txt_parameters");
if(para.value == '')
{
para.value = getName;
}
else
{
var paraTable = document.getElementById("assingInstrument");
var newtr = document.createElement("tr");
var cell1 = document.createElement('td');
var cell2 = document.createElement('td');
var cell3 = document.createElement('td');
var cell4 = document.createElement('td');
var newText1 = document.createElement('input');
newText1.type = "text";
newText1.name = "txt_invItemId[]";
newText1.value = getName;
newText1.className = "input";
var newText2 = document.createElement('select');
newText2.name = "sel_invType[]";
newText2.style.width = 160 +"px";
if (window.XMLHttpRequest)
{
// code for IE7+, Firefox, Chrome, Opera, Safari
xmlhttp = new XMLHttpRequest();
}
else
{
// code for IE6, IE5
xmlhttp = new ActiveXObject("Microsoft.XMLHTTP");
}
xmlhttp.onreadystatechange = function()
{
if (xmlhttp.readyState == 4 && xmlhttp.status == 200)
{
newText2.innerHTML = xmlhttp.responseText;
}
}
xmlhttp.open("GET","index.php?getInstrumentName",true);
xmlhttp.send();
cell2.appendChild(newText1);
cell4.appendChild(newText2);
newtr.appendChild(cell1);
newtr.appendChild(cell2);
newtr.appendChild(cell3);
newtr.appendChild(cell4);
paraTable.appendChild(newtr);
}
}
if(element == "label")
{
newLabel = document.createElement('label');
newLabel.innerHTML = getName;
newLabel.style.fontSize = selectFont;
if (selectFontValue == "Bold Italic")
{
newLabel.style.font = "italic bold 12px arial,serif";
}
else if (selectFontValue == "Regular")
{
newLabel.style.font = "12px arial,serif";
}
else if (selectFontValue == "Bold")
{
newLabel.style.font = "bold 12px arial,serif";
}
else
{
newLabel.style.font = "italic 12px arial,serif";
}
newLabel.style.color = selectColor;
_ele.appendChild(newLabel);
if(_ele.innerHTML != '')
{
arr1.push(table.id);
arr1.push(cell_Id);
arr1.push(getName);
arr1.push(element);
arr1.push(selectFont);
arr1.push(selectFontValue);
arr1.push(alpha_num);
arr1.push(text_form);
arr1.push(text_to);
arr1.push(selectColor);
}
}
else if(element == "text")
{
var newText = document.createElement('input');
newText.type = "text";
newText.name = getName;
newText.style.fontSize = selectFont;
if (selectFontValue == "Bold Italic")
{
newText.style.font = "italic bold 12px arial,serif";
}
else if (selectFontValue == "Regular")
{
newText.style.font = "12px arial,serif";
}
else if (selectFontValue == "Bold")
{
newText.style.font = "bold 12px arial,serif";
}
else
{
newText.style.font = "italic 12px arial,serif";
}
newText.style.color = selectColor;
_ele.appendChild(newText);
arr1.push(table.id);
arr1.push(cell_Id);
arr1.push(getName);
arr1.push(element);
arr1.push(selectFont);
arr1.push(selectFontValue);
arr1.push(alpha_num);
arr1.push(text_form);
arr1.push(text_to);
arr1.push(selectColor);
}
}
//alert(arr2);
// Creates all lines:
// Creates an empty line
Arr1.push([]);
Arr2.push([]);
// Adds cols to the empty line:
Arr1[t].push(new Array(10));
//Arr2[t].push(new Array(1));
for(var jjj=0; jjj < 10; jjj++){
// Initializes:
Arr1[t][jjj] = arr1[jjj];
}
for(var lll=0; lll < 1; lll++){
// Initializes:
Arr2[t][lll] = arr2[lll];
}
arr1.splice(0, arr1.length);
//arr2.splice(0, arr2.length);
t++;
}
}
}counter++;
var btnhh = document.getElementById('btn_add');
btnhh.onclick = function(){
//alert(Arr2);
window.location.href = 'index.php?btn_saveTct='+Arr1+'&column='+col+'&Array_color='+Arr2;
//"<?php $abcd='Sandip'; ?>";
}
}