[RESOLVED] how 2 make user able to put their information in a table when the page's in a browser
i want to create a table where when the page is in a browser, the user can store information in the table. however the code that i am using right now does not allow the user to store information in the table. what should i do so that the user able to put their info in the table??
this are the codes that i am currently using:
<table width="739" border="1">
<tr>
<th class="style1" scope="col">Name of People</th>
<th class="style1" scope="col">Hobbies</th>
</tr>
<tr>
<td> </td>
<td> </td>
</tr>
<tr>
<td> </td>
<td> </td>
</tr>
<tr>
<td height="28"> </td>
<td> </td>
</tr>
<tr>
<td> </td>
<td> </td>
</tr>
<tr>
<td> </td>
<td> </td>
</tr>
</table>
Re: how 2 make user able to put their information in a table when the page's in a browser
Do you want the user to add information to the table after the page has loaded? If so with javascript you could do something like this:
Code:
//dynamically create a table to display the object properties.
//win: handle to the window that will contain the table.
//arr: array of objectProperties.
function createObjectPropertiesTable(win,arr){
var doc = win.document;
var div = doc.createElement("DIV");
var tbl = doc.createElement("TABLE");
tbl.border = "1";
var tbody = doc.createElement("TBODY");
for(i=0;i<arr.length;i++){
var tr = doc.createElement("TR");
var td = doc.createElement("TD");
var txt = doc.createTextNode(arr[i].id);
td.appendChild(txt);
tr.appendChild(td);
td = doc.createElement("TD");
txt = doc.createTextNode(" " + arr[i].data);
td.appendChild(txt);
tr.appendChild(td);
tbody.appendChild(tr);
}
tbl.appendChild(tbody);
div.appendChild(tbl);
doc.body.appendChild(div);
}
The alternative is to submit the data back to the server process it and then display it again.
Re: how 2 make user able to put their information in a table when the page's in a browser
that means i have to delete my codes?
i dun understand the codes that u gives me.
Re: how 2 make user able to put their information in a table when the page's in a browser
ok maybe giving you that code in isolation wasn't the best idea. below is what I think your trying to achieve. You can look at it and use the ideas in it to implement your own solution.
Code:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<meta http-equiv="content-type" content="text/html; charset=windows-1250">
<meta name="generator" content="PSPad editor, www.pspad.com">
<title></title>
<script>
function addline(){
var t1 = document.frm.txt1.value;
var t2 = document.frm.txt2.value;
var tbody = document.getElementsByTagName("tbody");
var tr = document.createElement("TR");
var td = document.createElement("TD");
var txt = document.createTextNode(t1);
td.appendChild(txt);
tr.appendChild(td);
td = document.createElement("TD");
txt = document.createTextNode(t2);
td.appendChild(txt);
tr.appendChild(td);
tbody[0].appendChild(tr);
}
</script>
</head>
<body>
<form id="frm" name="frm">
<input id="txt1" name=txt1 type="text">
<input id="txt2" name=txt2 type="text">
<button onclick="addline()">Add</button>
<table id="tbl" name="tbl" style="border:solid black 1pt">
<thead>
<tr>
<td>Name</td>
<td>Hobbies</td>
</tr>
</thead>
<tbody style="border:solid black 1pt">
</tbody>
</table>
</form>
</body>
</html>
Re: how 2 make user able to put their information in a table when the page's in a browser
Keep in mind that the info they add will be gone again as soon as the page is refreshed.
Re: how 2 make user able to put their information in a table when the page's in a bro
here is a way to keep user data through a text box, you could probably work it into something: you can feed it a string instead of a textarea.
its for IE only, and it gives you 64KB, whach is actually quite a bit. Firefox 2 has a simmiler feature, but i havent played with it yet.
this one is really easy.
Code:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
"http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
<title>Notes</title>
<style>
.userData {behavior:url(#default#userdata);}
body { background-color: #000; margin: 0px; overflow:hidden; color:#ffffff; }
u { font-family:Verdana, Arial, Helvetica, sans-serif; cursor:pointer; border: 2px solid #bbb; background-color:#999999; padding: 5px; }
</style>
<SCRIPT>
function fnSave(){
oPersistDiv.setAttribute("Notes",oPersistText.value);
oPersistDiv.save("oXMLStore");
}
function fnLoad(){
oPersistDiv.load("oXMLStore");
oPersistText.value=oPersistDiv.getAttribute("Notes");
}
</SCRIPT>
</head>
<body onunload="fnSave()" onload="fnLoad()" >
<DIV CLASS="userData" ID="oPersistDiv">
<textarea cols="110" rows="60" id="oPersistText" style="background-color: transparent; color:#FFFFFF; font-family: tahoma; font-size:14pt;" > </textarea>
</DIV>
</body>
</html>
Re: how 2 make user able to put their information in a table when the page's in a browser
ermmm...i have tried using your code....thats the effect i want to achieve as in user are able to write something when the page is in the browser...the problem is that: i want the user to be able to write something on the table...
i have tried to combine my table code with ur code , but it still does not work;the user still unable to write on the table when the page is in a browser...
Re: how 2 make user able to put their information in a table when the page's in a browser
What exactly do you mean by "write" on the table? Do you mean click and type? If so, you can't do that with a table alone. You'll need to put Input elements in each cell.
Re: how 2 make user able to put their information in a table when the page's in a browser
An editable grid, interesting but i think it may not be worth the effort. I can see it being the type of thing that you could get 95% working, only to come across some problem that can't be fixed which makes everything useless.
A similar approach to the one adopted in early days of VB would be a start.
Namely clicking a cell displays an textbox over that cell which you edit and tabbing off transfers the data to the cell.
Re: how 2 make user able to put their information in a table when the page's in a browser
yes. that is what i want to achieve, where user able to click and type on the table.
what do you mean by put input elements in each cell? can you give me example of how to code the input elements?can you give me example of the code?
Re: how 2 make user able to put their information in a table when the page's in a browser
You would need to place the table within a form.
Input element.
As for code, try it, and we'll help if you get stuck.
Re: how 2 make user able to put their information in a table when the page's in a browser
hello guys! it works!!! IT WORKS!!! thanks u so much!!!:D
