 |  |  |  |  |  |  |  |
Please Help!!! Problems Adding Row Dynamically using Javascript
Please support our JavaScript / DHTML / AJAX advertiser: PostgreSQL or MySQL? Compare and contrast the two most popular open source databases
 |
I have a web page where the users are supposed to be able to click a button to add a new table row. I have tried various javascripts found online but I am not a javascript person. The page is written in html and asp. I dynamically fill in the dropdown boxes from a database which change for whatever is selected from the first dropdown box. below is the code for the entire webpage. The first screenshot is when the page opens, the second screenshot is if they were to click the plus sign next to Monday. Any help on this would be greatly appreciated.
JavaScript / DHTML / AJAX Syntax (Toggle Plain Text)
JavaScript / DHTML / AJAX Syntax (Toggle Plain Text)
Last edited by peter_budo; Jun 25th, 2009 at 2:20 pm. Reason: Splitting into two sections
•
•
Join Date: Apr 2009
Posts: 811
Reputation: 
Solved Threads: 115
Practically a Posting Shark
JSV,
Firstly, pleeeeeeeease simplify
Unless I've made a mistake, this should do exactly the same job.
Now try this - should be something like what you're looking for:
This is a snippet from the middle of your html.
Notes:
Firstly, pleeeeeeeease simplify
showCols(){} thus: JavaScript / DHTML / AJAX Syntax (Toggle Plain Text)
Now try this - should be something like what you're looking for:
javascript Syntax (Toggle Plain Text)
JavaScript / DHTML / AJAX Syntax (Toggle Plain Text)
- Use <tbody></tbody> structure within table instead of <div></div>
- <a><img ...></a> instead of <input type="image" ...>
- Give cells whose content you want to be blanked in the new row a custom attribute of blankMe="1"
- Return false from addroute() and hence from its onclick call to suppress hyperlink action (or form submission or whatever).
- Note, embedded javascript in the cloned row will not run.
- Tested staticly (not asp) so not tested with multiple days (0 to 6 i loop)
Last edited by Airshow; Jun 25th, 2009 at 9:57 pm.
50% of the solution lies in accurately describing the problem!
Airshow,
Thank you so much for your help. Most of the code that you supplied worked GREAT!! What didn't work was my onchange call
My Combobox under the Client/Description Heading wouldn't show any data at all. I'm wondering if this is becuase the onchange wouldn't work. Is there any way to get this working?
Also, if my embedded javascript won't work, then my combobox won't work will it?
Again, thank you for your time. I really do appreciate it. I'm really javascript illiterate so sorry to be such a pain.
If you would like to see the code again, I am attaching it as code.txt file.
Thank you
Thank you so much for your help. Most of the code that you supplied worked GREAT!! What didn't work was my onchange call
JavaScript / DHTML / AJAX Syntax (Toggle Plain Text)
My Combobox under the Client/Description Heading wouldn't show any data at all. I'm wondering if this is becuase the onchange wouldn't work. Is there any way to get this working?
Also, if my embedded javascript won't work, then my combobox won't work will it?
Again, thank you for your time. I really do appreciate it. I'm really javascript illiterate so sorry to be such a pain.
If you would like to see the code again, I am attaching it as code.txt file.
Thank you
Hit any user to continue......
One more thing, can I put a [-] next to the newly created rows in order to delete those rows just in case the user made a mistake and needs to remove an extra row?
Thank you
Thank you
Hit any user to continue......
•
•
Join Date: Apr 2009
Posts: 811
Reputation:
Solved Threads: 115
Practically a Posting Shark
JSV,
>> What didn't work was my onchange call; onchange="showCols(<%=i%>);
I made a teeny-weeny little critical mistake and overlooked something. Try this:
In function addroute:
Add a new javascript function:
And in the HTML
Your "type" combo will now work in cloned rows, which will be reset to neutral settings.
It's also possible that I made a mistake in simplifying
>> My Combobox under the Client/Description Heading wouldn't show any data at all. ...
I'm not sure what's going on here. Options in the "meeting" and "leave" combos are built server-side in ASP loops. As far as I can tell my cloning process should not affect them - they should be perfect clones of those in the served original. If they are not populated, then I have to suggest looking at the ASP. As I said, I am unable to test it.
>> Also, if my embedded javascript won't work, then my combobox won't work will it?
As far as I can tell, the embedded javascript just gives the commboboxes some go-faster stripes. It doesn't affect their options or basic functionality. Besides, the new resetRow function now includes code to mimic the embedded javascript, so the go-faster gizmos should be preserved (untested).
Let me know how it goes
Airshow
>> What didn't work was my onchange call; onchange="showCols(<%=i%>);
I made a teeny-weeny little critical mistake and overlooked something. Try this:
In function addroute:
JavaScript / DHTML / AJAX Syntax (Toggle Plain Text)
javascript Syntax (Toggle Plain Text)
JavaScript / DHTML / AJAX Syntax (Toggle Plain Text)
It's also possible that I made a mistake in simplifying
showcols . If so, then it will misbehave on your original rows as well as cloned rows. I think your original showcols will still work but try my changes first because I think my simplified showcols is OK.>> My Combobox under the Client/Description Heading wouldn't show any data at all. ...
I'm not sure what's going on here. Options in the "meeting" and "leave" combos are built server-side in ASP loops. As far as I can tell my cloning process should not affect them - they should be perfect clones of those in the served original. If they are not populated, then I have to suggest looking at the ASP. As I said, I am unable to test it.
>> Also, if my embedded javascript won't work, then my combobox won't work will it?
As far as I can tell, the embedded javascript just gives the commboboxes some go-faster stripes. It doesn't affect their options or basic functionality. Besides, the new resetRow function now includes code to mimic the embedded javascript, so the go-faster gizmos should be preserved (untested).
Let me know how it goes
Airshow
Last edited by Airshow; Jun 28th, 2009 at 11:44 am. Reason: Typos
50% of the solution lies in accurately describing the problem!
•
•
Join Date: Apr 2009
Posts: 811
Reputation:
Solved Threads: 115
Practically a Posting Shark
>> can I put a [-] next to the newly created rows in order to delete
Yes but there are implications server-side.
As it stands (without a delete function), it is fairly easy server-side to find which name|value pairs have been submitted in the POST. Names in cloned rows will have _n appended to their baserow's names, so you can loop through with an integer counter and when you find name_n is not set, then the code can be certain that there are no more rows.
Now, say a cloned row was deleted. When you find name_n is not set, there is no longer certainty that there are no more rows.
If you want to delete rows, then either your paradigm for retreiving POST data must be a bit cleverer or you need to take measures client-side to "close the numbering gap" when a row is deleted.
Airshow
Yes but there are implications server-side.
As it stands (without a delete function), it is fairly easy server-side to find which name|value pairs have been submitted in the POST. Names in cloned rows will have _n appended to their baserow's names, so you can loop through with an integer counter and when you find name_n is not set, then the code can be certain that there are no more rows.
Now, say a cloned row was deleted. When you find name_n is not set, there is no longer certainty that there are no more rows.
If you want to delete rows, then either your paradigm for retreiving POST data must be a bit cleverer or you need to take measures client-side to "close the numbering gap" when a row is deleted.
Airshow
50% of the solution lies in accurately describing the problem!
Airshow,
Thank you again for the new code, most of it is working now. On the cloned rows, it is still not populating the Client/Description combobox. The combobox is populated on the main row, so the only thing that I can think of is the javascript. When I get the records to populate that combobox from the database, I am putting the data into an asp array. Should I try to put this data into a javascript array instead? Would that help? The other comboboxes are populated statically so I am thinking it has something to do with the array.
Here is the code for the array in asp --
Also, don't know if you saw my other post about removing the newly created rows. Can we put a [-] next to each row so in case they added a row that they don't need, they can click on that to delete it.
I really appreciate all the time you have put into this. I hope you can help me with the next problem.
Thank you again for the new code, most of it is working now. On the cloned rows, it is still not populating the Client/Description combobox. The combobox is populated on the main row, so the only thing that I can think of is the javascript. When I get the records to populate that combobox from the database, I am putting the data into an asp array. Should I try to put this data into a javascript array instead? Would that help? The other comboboxes are populated statically so I am thinking it has something to do with the array.
Here is the code for the array in asp --
JavaScript / DHTML / AJAX Syntax (Toggle Plain Text)
Also, don't know if you saw my other post about removing the newly created rows. Can we put a [-] next to each row so in case they added a row that they don't need, they can click on that to delete it.
I really appreciate all the time you have put into this. I hope you can help me with the next problem.
Hit any user to continue......
Sorry, didn't see the post about the deleting of the row. If you can supply the code to remove that would be great. When the data gets posted, I am going to put it all into an array so when I go through the posted information, the array will find all information and return the amount in the array, so it shouldn't be a problem if the numbers aren't consecutive.
Thank you again.
Thank you again.
Hit any user to continue......
•
•
Join Date: Apr 2009
Posts: 811
Reputation:
Solved Threads: 115
Practically a Posting Shark
JSV,
OK, here's the remove code.
Of course, that pretty well makes a nonsense of the custom attribute "blankMe". The code won't mind but something like "convertMe" would be more appropriate now.
Airshow
OK, here's the remove code.
JavaScript / DHTML / AJAX Syntax (Toggle Plain Text)
JavaScript / DHTML / AJAX Syntax (Toggle Plain Text)
Airshow
Last edited by Airshow; Jun 28th, 2009 at 4:17 pm.
50% of the solution lies in accurately describing the problem!
I finally figured out why the cloned rows won't populate the combobox. This code is the culprit:
If I take out this code, then everything works correctly. My problem is that this code allows me to type in new values in the dropdown boxes so if they option that they want isn't available, or it is a new option, then they can just type something in. It also allows me to format the dropdown boxes so that they look nice on the page.
Any ideas?
Thanks. Also, thanks for the delete code, I really appreciate everything that you have done to help me with this project.
JavaScript / DHTML / AJAX Syntax (Toggle Plain Text)
If I take out this code, then everything works correctly. My problem is that this code allows me to type in new values in the dropdown boxes so if they option that they want isn't available, or it is a new option, then they can just type something in. It also allows me to format the dropdown boxes so that they look nice on the page.
Any ideas?
Thanks. Also, thanks for the delete code, I really appreciate everything that you have done to help me with this project.
Hit any user to continue......
|
Similar Threads
- Adding a new row in a Datagrid ??????????? (C#)
- Adding new row in DataGrid (C#)
- adding controls dynamically (VB.NET)
- Having problems with adding a row to a DataSet (VB.NET)
Other Threads in the JavaScript / DHTML / AJAX Forum
- Previous Thread: Help with javascript regular expressions
- Next Thread: Problem facing in removing space in page between table???
| Thread Tools | Search this Thread |
You need to join our community in order to build your list of favorite forums. You can visit the forum index for a listing of all forums.
Related Forum Features
Latest JavaScript / DHTML / AJAX Posts
- Today's Posts
- Unanswered Threads
acid2 ajax ajaxexample ajaxjspservlets array browser bug captchaformproblem cart checkbox child close codes createrange() css cursor date debugger decimal dependent design disablefirebug dom download dropdown editor element embed engine enter error events explorer ext file firefox focus form forms frameworks getselection google gxt hiddenvalue highlightedword hint html ie7 ie8 iframe images index internet java javascript javascripthelp2020 jquery jsf jsfile jsp jump libcurl listbox maps masterpage math media menu mp4 object onmouseoutdivproblem onmouseover onreadystatechange parent paypal pdf php position post problem programming progressbar prototype redirect runtime safari scale scriptlets scroll search security select shopping size software unicode w3c web wysiwyg \n
