469,072 Members | 1,860 Online
Bytes | Developer Community
New Post

Home Posts Topics Members FAQ

Post your question to a community of 469,072 developers. It's quick & easy.

extracting values from a dynamically created row

29
Hi

I have created a dynamic row and inserted the values into the cells of those rows from textboxes. Now I have to edit those values stored in the rows. At the end of each row created dynamically two buttons namely "Edit" and "Delete" are present. If I click the "Edit" button the values in that particular cells should go back to the textboxes for editing and then after editing it should go to the corresponding place.

Can any one help to solve this using Javascript.
Thanks in Advance.........
Jun 20 '07 #1
17 5365
cygsoft
29
Hi

I have created the table using an email id. The end of each row contains "Edit" and "Delete" options. If I click Edit Button of that particular row, The emailid should be transferred to other page for editing and then return back after modification to the previous page.

Thanks.
It would be so helpful for me.
Jun 20 '07 #2
r035198x
13,262 8TB
Hi

I have created the table using an email id. The end of each row contains "Edit" and "Delete" options. If I click Edit Button of that particular row, The emailid should be transferred to other page for editing and then return back after modification to the previous page.

Thanks.
It would be so helpful for me.
1.) Are you using JSP?
2.) Do you have each edit link in its own form? You can pass the email value as a hidden field of that form.
Jun 20 '07 #3
cygsoft
29
thanks for ur reply

I am creating a row dynamically in that email address, edit and delete buttons are there. For each row created dynamically the corresponding edit and delete buttons are also created.

If i click an edit button in a particular row the emailid in tht row should be extracted for modification.
Jun 20 '07 #4
r035198x
13,262 8TB
thanks for ur reply

I am creating a row dynamically in that email address, edit and delete buttons are there. For each row created dynamically the corresponding edit and delete buttons are also created.

If i click an edit button in a particular row the emailid in tht row should be extracted for modification.
You'll still need to tell us if you're using JSP or just Javascript.
How does the submiting work by clicking the edit button? You need a form to submit. Once you answer my initial questions, everything will become clear from then on.
Jun 20 '07 #5
cygsoft
29
You'll still need to tell us if you're using JSP or just Javascript.
How does the submiting work by clicking the edit button? You need a form to submit. Once you answer my initial questions, everything will become clear from then on.

It was in Javascript. "Edit" is not a submit button. It is generated dynamically when each new EmaiiId is added. Now when "Edit" is clicked the email ID should be brought for editing.

For each mailID added there is a corresponding "Edit" and "Delete" is present.
If any Edit or Delete of a particular row is clicked then the that row should be brought for modification. After modification the mailID should be send back to the same place.
Jun 20 '07 #6
r035198x
13,262 8TB
It was in Javascript. "Edit" is not a submit button. It is generated dynamically when each new EmaiiId is added. Now when "Edit" is clicked the email ID should be brought for editing.

For each mailID added there is a corresponding "Edit" and "Delete" is present.
If any Edit or Delete of a particular row is clicked then the that row should be brought for modification. After modification the mailID should be send back to the same place.
Then the question belongs in the Javascript forum and so I'll move it there.
Jun 20 '07 #7
cygsoft
29
Hi

here is my code.

<html>
<body>
<script>
function addRow()
{
var newRow = document.all("tblGrid").insertRow();
var oCell = newRow.insertCell();
oCell.innerHTML = f1.fullname.value;
oCell = newRow.insertCell();
oCell.innerHTML = f1.emailaddress.value;
oCell = newRow.insertCell();
oCell.innerHTML = "<input type='button' value='Edit' onclick='editvalidate(this);'/>&nbsp;&nbsp;<input type='button' value='Delete' onclick='removeRow(this);'/>";
}

function removeRow(src)
{
var oRow = src.parentElement.parentElement;
document.all("tblGrid").deleteRow(oRow.rowIndex);
}

</script>
<table id="tblGrid">
<tr><td></td></tr>
</table>
<form name="f1">
Fullname<input type="text" name="fullname"><br>
EmailAddress<input type="text" name="emailaddress"><br>
<input type="button" value="add" onclick="addRow();">
</form>
</body>
</html>





This coding works fine for deleting a particular row. But when i click the "Edit" button of the row created, I need those two values such as "name" and "emailaddress" to be brought back to the textbox and edited and then send back..

It would be so useful if anyone help me.
Thanks

by
sudha
Jun 20 '07 #8
cygsoft
29
this is needed urgently can anyone help pls.........
Jun 20 '07 #9
cygsoft
29
help needed urgently........
Jun 20 '07 #10
cygsoft
29
I have a table contains the email Id and edit and delete options.and i hava a create new button.If iclick the createnew button it goes to the jsp page it contains email Id text field.if we enter the email id and submit on that page control goes to the same page and i want to see the email id dynamically in that table the edit and delete options also created dynamically.if i click the edit option it goes to the entire email id page and i change the password information it will change the password and submit means it returns the same page.

if i click the delete option div should displayed,in that two options one is yes and another is no ,if i click yes that entire row will be deleted, if click no just div only deleted and then entire row will be delete while checked some checkbox

can u help me ...
thanks in advance.....
Jun 20 '07 #11
r035198x
13,262 8TB
help needed urgently........
There are several ways of doing this.
One way is to write the email in a hidden input for each row.
Jun 20 '07 #12
acoder
16,027 Expert Mod 8TB
Post what code you have so far so we can work with that.
Jun 20 '07 #13
acoder
16,027 Expert Mod 8TB
These seem to be on the same topic, so I've merged the threads.
Jun 20 '07 #14
acoder
16,027 Expert Mod 8TB
I've merged about 4 or 5 threads. Please keep all posts in one thread. It's very difficult if the posts are all in separate threads and you have 2/3 answers in different places.
Jun 20 '07 #15
acoder
16,027 Expert Mod 8TB
Hi

here is my code.

<html>
<body>
<script>
function addRow()
{
var newRow = document.all("tblGrid").insertRow();
var oCell = newRow.insertCell();
oCell.innerHTML = f1.fullname.value;
oCell = newRow.insertCell();
oCell.innerHTML = f1.emailaddress.value;
oCell = newRow.insertCell();
oCell.innerHTML = "<input type='button' value='Edit' onclick='editvalidate(this);'/>&nbsp;&nbsp;<input type='button' value='Delete' onclick='removeRow(this);'/>";
}

function removeRow(src)
{
var oRow = src.parentElement.parentElement;
document.all("tblGrid").deleteRow(oRow.rowIndex);
}

</script>
<table id="tblGrid">
<tr><td></td></tr>
</table>
<form name="f1">
Fullname<input type="text" name="fullname"><br>
EmailAddress<input type="text" name="emailaddress"><br>
<input type="button" value="add" onclick="addRow();">
</form>
</body>
</html>





This coding works fine for deleting a particular row. But when i click the "Edit" button of the row created, I need those two values such as "name" and "emailaddress" to be brought back to the textbox and edited and then send back..

It would be so useful if anyone help me.
Thanks

by
sudha
OK, now we have some code. Firstly, this is IE-only code. document.all should be document.getElementById.

Create a function, editvalidate which gets the current row and from that the first and second cells. cells[0] and cells[1] will refer to those cells. You can refer to the text boxes by e.g.
Expand|Select|Wrap|Line Numbers
  1. document.forms.f1.fullname.value=...
See how this example does it.
Jun 20 '07 #16
cygsoft
29
Thanks a lot.
The example you have given is very much useful.

I had worked out tht format using the following codings. I just share my codings here.

the codings for editing

function editvalidate(src)
{
var currObj = src;
while( (currObj.tagName != "TR") && (currObj.tagName != null) ){
currObj = currObj.parentElement;
}

var rowObj = currObj;
var cellCount = rowObj.cells.length;
var tdObj = rowObj.firstChild;
var colValues = new Array( cellCount );

for( i = 0; i < cellCount; i++ ) {
currObj = rowObj.cells[i];
while( (currObj != null) && (currObj.innerText == null) ) {
currObj = currObj.firstChild;
}
if( currObj != null )
colValues[i] = currObj.innerText;
}
var storename=colValues[0];
// var namelength=parseInt(strlen(storename));
var n=storename.length;
var removename=storename.substring(1,n-1);
document.f1.fullname.value=removename;

var storeemail=colValues[1];
var n1=storeemail.length;
var removeemail=storeemail.substring(1,storeemail.leng th-1);
document.f1.emailaddress.value=removeemail;



var oRow = src.parentElement.parentElement;
document.all("tblGrid").deleteRow(oRow.rowIndex);

}
Jun 21 '07 #17
acoder
16,027 Expert Mod 8TB
Thanks a lot.
The example you have given is very much useful.

I had worked out tht format using the following codings. I just share my codings here.
You're welcome. Glad you got it working fine.
Jun 21 '07 #18

Post your reply

Sign in to post your reply or Sign up for a free account.

Similar topics

6 posts views Thread by steveneng | last post: by
4 posts views Thread by Mark Broadbent | last post: by
16 posts views Thread by Preben Randhol | last post: by
1 post views Thread by CARIGAR | last post: by
By using this site, you agree to our Privacy Policy and Terms of Use.