HTML + Javascript Problem!!!
-
Hi all, I have create a dynamic table in javascript by following function moreWorkClicked() { var tbl = document.createElement("table"); var tblBody = document.createElement("tbody"); var body1 = document.getElementsByTagName("body")[0]; var mainTable = document.getElementById("moreWorkTd"); var counter = parseInt(document.forms[0].clickCounter.value); counter = counter + 1; tblId = "tblEmployer" + counter; tbl.setAttribute("id", tblId); tbl.setAttribute("width", "100%"); tbl.setAttribute("border", "1"); tbl.setAttribute("align", "left"); labelArray = new Array("Employer Name", "Job Title", "Start Date", "End Date", "Salary Per Month(Approx.)"); nameArray = new Array("employerName_txt", "jobTitle_txt", "startDate_txt", "endDate_txt", "salary_txt"); for (var j = 0; j < 5; j++) { textboxName = nameArray[j] + counter; var row = document.createElement("tr"); var cell = document.createElement("td"); cell.setAttribute("class", "formDataAlign"); var cellText = document.createTextNode(labelArray[j]); cell.appendChild(cellText); row.appendChild(cell1); cell = document.createElement("td"); cell.setAttribute("class", "formDataAlign"); cellText = document.createElement("input"); cellText.name = textboxName; cell.appendChild(cellText); row.appendChild(cell); tblBody.appendChild(row); } tbl.appendChild(tblBody); body1.appendChild(tbl); //This is the code for trying to put table at needed place but not working. var mainRow = document.createElement("tr"); var mainCell = document.createElement("td"); cellText = document.createTextNode(tbl); mainRow.appendChild(cellText); mainTable.appendChild(mainRow); mainTable.style.display = ""; } By using above code my table is created but now I want to put it at some fixed place in my html page such as HTML code:
Work Experience Details
//Here I want that created table.
Can you tell me that how I can put it on decided place?? Thank you in Advance. ----------------------------
-
Hi all, I have create a dynamic table in javascript by following function moreWorkClicked() { var tbl = document.createElement("table"); var tblBody = document.createElement("tbody"); var body1 = document.getElementsByTagName("body")[0]; var mainTable = document.getElementById("moreWorkTd"); var counter = parseInt(document.forms[0].clickCounter.value); counter = counter + 1; tblId = "tblEmployer" + counter; tbl.setAttribute("id", tblId); tbl.setAttribute("width", "100%"); tbl.setAttribute("border", "1"); tbl.setAttribute("align", "left"); labelArray = new Array("Employer Name", "Job Title", "Start Date", "End Date", "Salary Per Month(Approx.)"); nameArray = new Array("employerName_txt", "jobTitle_txt", "startDate_txt", "endDate_txt", "salary_txt"); for (var j = 0; j < 5; j++) { textboxName = nameArray[j] + counter; var row = document.createElement("tr"); var cell = document.createElement("td"); cell.setAttribute("class", "formDataAlign"); var cellText = document.createTextNode(labelArray[j]); cell.appendChild(cellText); row.appendChild(cell1); cell = document.createElement("td"); cell.setAttribute("class", "formDataAlign"); cellText = document.createElement("input"); cellText.name = textboxName; cell.appendChild(cellText); row.appendChild(cell); tblBody.appendChild(row); } tbl.appendChild(tblBody); body1.appendChild(tbl); //This is the code for trying to put table at needed place but not working. var mainRow = document.createElement("tr"); var mainCell = document.createElement("td"); cellText = document.createTextNode(tbl); mainRow.appendChild(cellText); mainTable.appendChild(mainRow); mainTable.style.display = ""; } By using above code my table is created but now I want to put it at some fixed place in my html page such as HTML code:
Work Experience Details
//Here I want that created table.
Can you tell me that how I can put it on decided place?? Thank you in Advance. ----------------------------
If I undestand you correctly, you're trying to add an element at a specific point in the DOM? First, call dovument.createElement to actually create it, specify the attributes you would like, then get a reference to the table's intended parent using document.getElementById, then call parent.appendChild(element)
"Now I guess I'll sit back and watch people misinterpret what I just said......" Christian Graus At The Soapbox