RSS Forums RSS
Please support our JavaScript / DHTML / AJAX advertiser: Lunarpages Web Hosting
Views: 507 | Replies: 6 | Thread Tools  Display Modes
Reply
Join Date: Jul 2008
Posts: 11
Reputation: Madawa is an unknown quantity at this point 
Rep Power: 1
Solved Threads: 0
Madawa Madawa is offline Offline
Newbie Poster

DOM problem!!!

  #1  
Jul 21st, 2008
hi,

i'm new to JS. i'm having a problem with my jscript.
i'm using innerHTML to insert rows to table dynamicaly..

but when i do this .....
for example:
i have added a row and i filled it with data(e.g text box) and then i add a another row when i do that ... the filled data is erased...


pls gv a solution...
AddThis Social Bookmark Button
Reply With Quote  
Join Date: Jun 2008
Location: Phoenix, AZ
Posts: 850
Reputation: R0bb0b is on a distinguished road 
Rep Power: 2
Solved Threads: 66
R0bb0b's Avatar
R0bb0b R0bb0b is offline Offline
Practically a Posting Shark

Re: DOM problem!!!

  #2  
Jul 21st, 2008
  1. document.getElementById("element id").innerHTML += "table data";

are you using "=" instead of "+="?
“Be who you are and say what you feel because those who mind don't matter and those who matter don't mind.” - Dr. Seuss

-- The documentation is inevitable, you may get away with it for a little while but eventually you too will have to do the deed.
Reply With Quote  
Join Date: Jul 2008
Posts: 11
Reputation: Madawa is an unknown quantity at this point 
Rep Power: 1
Solved Threads: 0
Madawa Madawa is offline Offline
Newbie Poster

Re: DOM problem!!!

  #3  
Jul 21st, 2008
i'm using '='
Reply With Quote  
Join Date: Jun 2008
Location: Phoenix, AZ
Posts: 850
Reputation: R0bb0b is on a distinguished road 
Rep Power: 2
Solved Threads: 66
R0bb0b's Avatar
R0bb0b R0bb0b is offline Offline
Practically a Posting Shark

Re: DOM problem!!!

  #4  
Jul 21st, 2008
"=" overwrites and "+=" appends.
Last edited by R0bb0b : Jul 21st, 2008 at 3:55 am.
“Be who you are and say what you feel because those who mind don't matter and those who matter don't mind.” - Dr. Seuss

-- The documentation is inevitable, you may get away with it for a little while but eventually you too will have to do the deed.
Reply With Quote  
Join Date: Jul 2008
Posts: 11
Reputation: Madawa is an unknown quantity at this point 
Rep Power: 1
Solved Threads: 0
Madawa Madawa is offline Offline
Newbie Poster

Re: DOM problem!!!

  #5  
Jul 21st, 2008
but then it overwites the current row!!!

tableObj.innerHTML += "<tr id='"+sectionName+"_row_"+counters+"'><td>Rule "+counters+"<select name='rule["+sectionName+"][]'><option value='float'>float</option><option value='int'>int</option><option value='required'>required</option><option value='email'>email</option><option value='date'>date</option><br>Error "+counters+"<input type='text' name='error["+sectionName+"][]'><input type='button' class='querybutton' name="+counters+" value='Delete' onClick=\"removeInput('"+sectionName+"',"+counters+")\"/> </td></tr>";
Reply With Quote  
Join Date: Jun 2008
Location: Phoenix, AZ
Posts: 850
Reputation: R0bb0b is on a distinguished road 
Rep Power: 2
Solved Threads: 66
R0bb0b's Avatar
R0bb0b R0bb0b is offline Offline
Practically a Posting Shark

Re: DOM problem!!!

  #6  
Jul 21st, 2008
Originally Posted by Madawa View Post
but then it overwites the current row!!!

tableObj.innerHTML += "<tr id='"+sectionName+"_row_"+counters+"'><td>Rule "+counters+"<select name='rule["+sectionName+"][]'><option value='float'>float</option><option value='int'>int</option><option value='required'>required</option><option value='email'>email</option><option value='date'>date</option><br>Error "+counters+"<input type='text' name='error["+sectionName+"][]'><input type='button' class='querybutton' name="+counters+" value='Delete' onClick=\"removeInput('"+sectionName+"',"+counters+")\"/> </td></tr>";

I don't understand what you are saying but let me give you a simple example:
  1. <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
  2. <html xmlns="http://www.w3.org/1999/xhtml">
  3. <head>
  4. <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
  5. <title>Untitled Document</title>
  6. <script language="javascript" type="text/javascript">
  7. function addtotable()
  8. {
  9. var value = document.getElementById("txtAppend").value;
  10. document.getElementById("tblObject").innerHTML += "<tr><td>" + value + "</td></tr>";
  11. document.getElementById("txtAppend").select();
  12. }
  13. </script>
  14. </head>
  15.  
  16. <body>
  17. <table id="tblObject">
  18. <tr>
  19. <td>head</td>
  20. </tr>
  21. </table>
  22. <input type="text" name="txtAppend" id="txtAppend" />
  23. <input type="button" onclick="addtotable();" value="Add to Table" />
  24. </body>
  25. </html>
“Be who you are and say what you feel because those who mind don't matter and those who matter don't mind.” - Dr. Seuss

-- The documentation is inevitable, you may get away with it for a little while but eventually you too will have to do the deed.
Reply With Quote  
Join Date: Jul 2008
Posts: 11
Reputation: Madawa is an unknown quantity at this point 
Rep Power: 1
Solved Threads: 0
Madawa Madawa is offline Offline
Newbie Poster

Re: DOM problem!!!

  #7  
Jul 21st, 2008
this is the function..... i am using...


  1.  
  2. function AddInput(sectionName){
  3. var rulesObj = document.getElementById(sectionName+"_rules");
  4. var fChild = rulesObj.firstChild;
  5. var counters = 1;
  6. var tblCore = "<tr id='"+sectionName+"_row_"+counters+"'><td>Rule "+counters+"<select name='rule["+sectionName+"][]'><option value='float'>float</option><option value='int'>int</option><option value='required'>required</option><option value='email'>email</option><option value='date'>date</option><br>Error "+counters+"<input type='text' name='error["+sectionName+"][]'><input type='button' class='querybutton' name="+counters+" value='Delete' onClick=\"removeInput('"+sectionName+"',"+counters+")\"/> </td></tr>";
  7.  
  8. if( null != fChild && undefined != fChild.tagName && "TABLE" == fChild.tagName ){
  9. var tableObj = document.getElementById(sectionName+"_input_table");
  10. counters = tableObj.rows.length+1;
  11. tblCore = fChild.innerHTML + "<tr id='"+sectionName+"_row_"+counters+"'><td>Rule "+counters+"<select name='rule["+sectionName+"][]'><option value='float'>float</option><option value='int'>int</option><option value='required'>required</option><option value='email'>email</option><option value='date'>date</option><br>Error "+counters+"<input type='text' name='error["+sectionName+"][]'><input type='button' class='querybutton' name="+counters+" value='Delete' onClick=\"removeInput('"+sectionName+"',"+counters+")\"/> </td></tr>";
  12. }
  13. rulesObj.innerHTML = "<table id="+sectionName+"_input_table>"+tblCore+"</table>";
  14.  
  15. }
  16.  

html button is---
<input name="Add rule" type="button" class="querybutton" value="Add Rule" onclick="AddInput('course_name_type')" />

so i used the += but it didnt work!!!! it dosent create the line but it overwrites the firstly generated row...

plz help on this.. thank you in advance
Reply With Quote  
Reply

Only community members can participate in forum threads. You must register or log in to contribute.



Similar Threads
Other Threads in the JavaScript / DHTML / AJAX Forum
Currently Active Users Viewing This Thread: 1 (0 members and 1 guests)

 

Thread Tools Display Modes
Forums | Blogs | Tutorials | Code Snippets | Whitepapers | RSS Feeds | Advertising
All times are GMT -4. The time now is 8:45 pm.
Newsletter Archive - Sitemap - Privacy Statement - Acceptable Use Policy - Contact Us
Forum system based on vBulletin Copyright ©2000 - 2009, Jelsoft Enterprises Ltd.
©2003 - 2008 DaniWeb® LLC