extracting values from a dynamically created row

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

Follow Post Reply

5365

cygsoft

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

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

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

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);'/>  <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

this is needed urgently can anyone help pls.........

Jun 20 '07 #9

cygsoft

help needed urgently........

Jun 20 '07 #10

cygsoft

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);'/>  <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

document.forms.f1.fullname.value=...

See how this example does it.

Jun 20 '07 #16

cygsoft

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

extracting values from a dynamically created row

Post your reply

Similar topics