PDA

View Full Version : how to achieve <tr>.onclick=<func(arg)> thru javascript

tgopalakrishnan
12-21-2002, 06:35 AM
i'm having two forms-main form containing a html table and a button.on
clicking the button it pops up a child window containing a text box and a
button.afer entering some text in the text box and clicking the button the
child window is closed and a new row with the entered text should be added
in the main form table.I'm achieving this thru insertRow() function.i have
to raise the onclick event for that row thru javascript and on the click
event i have to call a function in the main form by passing arguments to
the function.the argument should be id of the newly created row.Everything
is working fine but while passing the id,the event is fired for the first
time itself and further clicks on that row does not raise the event ? how
can i achieve this ?


The sample code is provided below :


Test.jsp (main form)

<HTML>
<BODY>
<FORM method="post" name="Test" action="">
<center>
<table id="tab_test" border="1" width="100%">
<tr>
<td width="50%">&nbsp;</td>
<td width="50%">&nbsp;</td>
</tr>
<tr>
<td width="50%">&nbsp;</td>
<td width="50%">&nbsp;</td>
</tr>
</table>
</center>
</div>
<p><input type="button" value="Button" name="B3" onclick="clickMe()"></p>

<script language=JavaScript>

function clickMe() {
window.open("Sample.jsp?mode = xx","AddBuilds","height =
300,width=500,top=100,left=100,alwaysRaised=yes");

}

function callMe(rowid) {
alert(rowid);
alert("from main");

}

</script>
</FORM>
</BODY>
</HTML>

Sample.jsp

<HTML> <BODY>
<FORM method="post" name="Sample" action="">
<input type="button" value="Button" name="B3" onclick="clickMe()"></p>

<script language=JavaScript>


function clickMe() {
var newrow; newrow=parent.opener.document.getElementById
("tab_test").insertRow(1);
newrow.id="row1";
for (var i = 0; i < 2; i++) {
>v_newCell = newrow.insertCell(i);
v_newCell.innerHTML="XX";
}
newrow.onclick=parent.opener.callMe(newrow.id);//It works fine for the
very first time but fails to raise the on click event for further clicks

window.close();

}

</script>


</FORM>
</BODY>
</HTML>


Pl. provide the right solution
Yours
T.Gopalakrishnan
Mr J
12-21-2002, 05:25 PM
Not sure if this will help but I have manage to get the onclick in the table row in the main page






<HTML>
<BODY>
<FORM method="post" name="Test" action="">
<center>
<table id="tab_test" border="1" width="100%">
<tr>
<td width="50%">1</td>
<td width="50%">2</td>
</tr>
<tr>
<td width="50%">3</td>
<td width="50%">4</td>
</tr>
</table>
</center>
</div>
<p><input type="button" value="Button" name="B3" onclick="clickMe()"></p>

<script language=JavaScript>

newID=""

function clickMe() {
window.open("Sample.jsp?mode = xx","AddBuilds","height = 300,width=500,top=100,left=100,alwaysRaised=yes");
}

function callMe(rowid) {
alert(rowid);
alert("from main");
}

</script>
</FORM>
</BODY>
</HTML>







<HTML> <BODY>
<FORM method="post" name="Sample" action="">
<input type="button" value="Button" name="B3" onclick="clickMe()"></p>

<script language=JavaScript>


function clickMe() {
var newrow;
newrow=parent.opener.document.getElementById("tab_test").insertRow(1);
newrow.id="row1";

opener.newID="Hello World"

for (var i = 0; i < 2; i++) {
v_newCell = newrow.insertCell(i);
v_newCell.innerHTML="<span onclick=callMe(newID)>XX</span>";
}
//newrow.onclick=parent.opener.callMe(newrow.id);//It works fine for the very first time but fails to raise the on click event for further clicks

window.close();

}

</script>

</FORM>
</BODY>
</HTML>