Tek-Tips is the largest IT community on the Internet today!

Members share and learn making Tek-Tips Forums the best source of peer-reviewed technical information on the Internet!

  • Congratulations strongm on being selected by the Tek-Tips community for having the most helpful posts in the forums last week. Way to Go!

Dynamic Rows + Ajax InplaceEditor

Status
Not open for further replies.

gorgered

Programmer
Dec 13, 2005
24
US
Hi,

I am using Ajax.InPlaceEditor from to edit a row in a table. I also have a requirment to create dynamic rows to the table. I am able to create the rows but I am unable create new Ajax.InPlaceEditor class instance for each row.

Here is the code

Code:
<html>

<head>
<meta name="GENERATOR" content="Microsoft FrontPage 5.0">
<meta name="ProgId" content="FrontPage.Editor.Document">
<meta http-equiv="Content-Type" content="text/html; charset=windows-1252">
<title>The Lease is hereby amended to reflect the reduction of</title>
<script src="../../lib/prototype.js" type="text/javascript"></script>
<script src="../../src/scriptaculous.js" type="text/javascript"></script>
<SCRIPT LANGUAGE="JavaScript">
<!--
function addRowToTable()
{
  var tbl = $('tableId');
  var lastRow = tbl.rows.length;
  // if there's no header row in the table, then iteration = lastRow + 1
  var iteration = lastRow;
  var row = tbl.insertRow(lastRow);
  
  // cell:0
  var cellLeft = row.insertCell(0);
  cellLeft.setAttribute("align","center");
  var edit = document.createElement('a');
	  edit.setAttribute('href', '#');
	  edit.setAttribute('id', 'main'+iteration);
	  edit.appendChild(document.createTextNode("Edit"));
	  
	  //if NN6 then OK to use the standard setAttribute
	 /*  if ((!document.all)&&(document.getElementById)){
		   edit.setAttribute("onClick","dunebuggy()");
	   } */   
	   //workaround for IE 5.x
	   if ((document.all)&&(document.getElementById)){
		   edit["onclick"]=new Function("test()");
	   }

  cellLeft.appendChild(edit);
  
  // cell:1
  var cellRight = row.insertCell(1);
  var span = document.createElement('span');
	  span.setAttribute("id","mainSpan")
      span.appendChild(document.createTextNode("Create New Clause"));
	  cellRight.appendChild(span);
}



function test(){
   new Ajax.InPlaceEditor($('mainSpan'), '_ajax_inplaceeditor_result.html', {
			externalControl: 'main1',
			rows:10, 
			cols:75,
			ajaxOptions: {method: 'get'} //override so we can use a static for the result
		 });
}
//-->
</SCRIPT>
</head>

<body>
<input type="button" value="Create new clause" onClick="addRowToTable()">
  <table border="1" cellpadding="0" cellspacing="0" style="border-collapse: collapse" bordercolor="#111111" width="75%" id="tableId">
    <tr>
      <td width="16%" align="center">
      &nbsp; <a href="#" id="tobeedited2EditControl">Edit</a></td>
      <td width="84%"><span id="main">Row one</span>
      <p>&nbsp;<span>
	  <script language="javascript">
		 new Ajax.InPlaceEditor($('main'), '_ajax_inplaceeditor_result.html', {
			externalControl: 'tobeedited2EditControl',
			rows:10, 
			cols:75,
			ajaxOptions: {method: 'get'} //override so we can use a static for the result
		 });
	   </script>
	   </span>
	  </td>
    </tr>
   </table>

  
</body>

</html>

Help needed

-gorge
 
Status
Not open for further replies.

Part and Inventory Search

Sponsor

Back
Top