By using this site, you agree to our updated Privacy Policy and our Terms of Use. Manage your Cookies Settings.
460,035 Members | 937 Online
Bytes IT Community
+ Ask a Question
Need help? Post your question and get tips & solutions from a community of 460,035 IT Pros & Developers. It's quick & easy.

not defined addInput?

100+
P: 769
Hey Everyone,

Well i keep getting the error that addInput is not defined but i can not figure out what is wrong with it. It worked perfectly fine when i was using it to submit data. But now that i am trying to make it display previously entered data it says addInput is not defined. could really use an idea on whats wrong with it because i can't figure it out.

here is what i have

javascript
Expand|Select|Wrap|Line Numbers
  1. <script type="text/javascript">
  2. function addInput(divName){
  3. var dynamic = document.getElementById('dynamicInput');
  4. var thevalue = document.getElementById('theValue');
  5. var count = (document.getElementById('theValue').value -1)+ 2;
  6. thevalue.value = count;
  7. var newdiv = document.createElement('div');
  8. var divIdName = 'dynamic'+count+'Input';
  9. newdiv.setAttribute('id',divIdName);
  10.  
  11. newdiv.innerHTML =
  12. "<table class='zpExpandedTable' id='modeltable'>" +
  13. "<th class='sectiontitletick' colspan='7'>Serial Information "+ count +" </th>" +
  14. "<tr>" +
  15. "<td id='paddingformultitop'>Model No:&nbsp;&nbsp;&nbsp;&nbsp;</td>" +
  16. "</td>" +
  17. "<td>" +
  18.  "<select name='modelno_" + count + "'>" +
  19.  "<option value=''>Make A Selection</option>" +
  20. "<cfoutput query='models'>" + 
  21. "<option value='#model#'<cfif #model# is #model_no#>selected</cfif>>#model#</option>" + 
  22. "</cfoutput>" + 
  23.  "</select>" +
  24.  "</td>" +
  25.  "<td>" +
  26. "&nbsp;&nbsp;&nbsp;&nbsp;Product Type:"  +
  27. "</td>" +
  28. "<td>" +
  29. "<select name='producttype_" + count + "'>" +
  30. "<option value='' selected>No Choice</option>" +
  31. "<cfoutput query='getProdType'>" + 
  32. "<option value='#pk_productType#'<cfif #pk_productType# is #product_type#>selected</cfif>>#pk_productType#</option>" + 
  33. "</cfoutput>" + 
  34. "</select>" +
  35. "</td>" +
  36. "<td class='red'>" +
  37. "&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;Type Of Hardware Failure*:" +
  38. "</td>" +
  39. "<td>" +
  40. "<select name='hardwarefailure_" + count + "'>" +
  41. "<option value='' selected>Make A Selection</option>" +
  42. "<cfoutput query='getHardwareFail'>" +
  43. "<option value='#pk_hardwareFailure#'<cfif #pk_hardwareFailure# is #type_hardware_failure#>selected</cfif>>#pk_hardwareFailure#</option>" +
  44. "</cfoutput>" +
  45. "</select>" +
  46. "</td>" +
  47. "</tr>" +
  48. "<table>";
  49.  
  50. newdiv.innerHTML = newdiv.innerHTML +
  51. "<table class='zpExpandedTable' id='resoltable' cellpadding='1' cellspacing='0'>" +
  52. "<tr>" +
  53. "<td>" +
  54. "<input type='button' class='removeticket' value='Remove Serial &quot;"+count +"&quot;' onclick=\"removeElement(\'"+divIdName+"\')\"></a>" +
  55. "</td>" +
  56. "</td>" +
  57. "</tr>" +
  58. "</table>";
  59.  document.getElementById(divName).appendChild(newdiv);
  60.  
  61.  
  62. function removeElement(divNum) {
  63.   var d = document.getElementById('dynamicInput');
  64.   var olddiv = document.getElementById(divNum);
  65.   d.removeChild(olddiv);
  66. }
  67. </script>

heres the form
Expand|Select|Wrap|Line Numbers
  1. <body onload="addInput('dynamic');">
  2. <form action="userformedit.cfm" id="userForm"  name="userForm" method="POST" enctype="multipart/form-data" onclick="multipleSelectOnSubmit();">
  3. <input type="hidden" value="0" id="theValue" />
  4.      <div id="dynamicInput">
  5.  
  6.      </div>
  7.      <input type="button" class="addticket" value="Add Serial" onClick="addInput('dynamicInput');" >
  8. <input type="submit" value="submit" name="submit">
  9. </form>
  10. </body>
Thank you in advance,
Rach
Sep 16 '08 #1
Share this Question
Share on Google+
19 Replies


rnd me
Expert 100+
P: 427
in line 59 you try to append the newly created div to another element, an element with the id "dynamic". i don't see this tag anywhere in your code.

you could change the reference, and hard code "dynamicInput" instead.

if the function itself is not working, but you are not seeing any errors upon boot, check the long string that build the new div's .innerHTML for breaks.

EDIT: ok, your string is fine, as is the function overall (well, fine: maybe, syntax-error-free: yes).

is the script block you posted in the document's head, or is it in an external file?
if it's in an external files, remove the actual script tag code at the start and end.
Sep 16 '08 #2

100+
P: 769
in line 59 you try to append the newly created div to another element, an element with the id "dynamic". i don't see this tag anywhere in your code.

you could change the reference, and hard code "dynamicInput" instead.

if the function itself is not working, but you are not seeing any errors upon boot, check the long string that build the new div's .innerHTML for breaks.

EDIT: ok, your string is fine, as is the function overall (well, fine: maybe, syntax-error-free: yes).

is the script block you posted in the document's head, or is it in an external file?
if it's in an external files, remove the actual script tag code at the start and end.
Hey rnd me,

Thank you for your response. The script is in the documents head in my file. An this does work correctly with no errors if your are using it to insert information, but i am not trying to make it where i can edit previously entered information an now i am getting errors with it.

What i am trying to do is i used this to insert information and now i am trying to make it where i can use it to edit the information. The first problem i am running into is when i load the page nothing appears except the button to add more serial numbers. When i am inserting the information when the page loads the first serial number to fill out appears an then the button appears below to add more.Now that i am trying to display previously entered information nothing appears when the page loads except the button. If you click the button then it will show you the serial number you filled out, an it will continue to show you the same one every time you click add, i am only trying to show what was entered before and they also have to be able to add more serial numbers to it. But right now just trying to get it to display the serials filled out when the form appears but i have no clue how to go about this. I know that the errors come from the line you mentioned an its been having a trouble with the onload in the body tag.But if you have any suggestions to go about this i would very much appreciate it

Thank you for the help :),
Rach
Sep 17 '08 #3

acoder
Expert Mod 15k+
P: 16,027
If you want to call it onload, change the 'dynamic' to 'dynamicInput' when calling addInput().
Sep 18 '08 #4

100+
P: 769
If you want to call it onload, change the 'dynamic' to 'dynamicInput' when calling addInput().
Hey Acoder,

Wow i did not realize that would be so easy an it totally makes sense to me now!
But i do got a few more questions on this if you don't mind answering them.
I was wondering if there was a way to display the previously entered information (when the page loads) an still allow the user to add more serial numbers an still allow them to remove them?
i been trying to figure out for days if this is possible/how i can do this but i have no clue where to begin.

Thank you,
Rach
Sep 18 '08 #5

acoder
Expert Mod 15k+
P: 16,027
Yes, you can. Keep a count to keep each ticket unique and use that to identify the div to remove.
Sep 18 '08 #6

100+
P: 769
Yes, you can. Keep a count to keep each ticket unique and use that to identify the div to remove.
Hey Acoder,

i am a bit confused by what you mean. I figured i would have to keep the count . But what i am confused on is this.It has to be able to display multiple tickets that were filled in. An then if they decide to add another ticket they need to be able to click add ticket an nothing appears in any fields when they click on add ticket. Right now if i click add ticket it displays what was previously written. So i dont' know if i need to copy all the tables in the javascript an make those have the values to display what was previously written an then have another copy of the tables where it will display nothing in the fields. Just not sure how to go about this.

Thank you,
Rach
Sep 18 '08 #7

acoder
Expert Mod 15k+
P: 16,027
Yes, I see what you mean now. Either use another function or reuse this one with the values as parameters rather than hard-coded values to make it more generic.
Sep 18 '08 #8

100+
P: 769
Yes, I see what you mean now. Either use another function or reuse this one with the values as parameters rather than hard-coded values to make it more generic.
Hey Acoder,

how would i make the values as parameter?not really sure what the difference between parameters and hard-coded values is.

Thank you,
Rach
Sep 18 '08 #9

acoder
Expert Mod 15k+
P: 16,027
A parameter/argument would be something you pass to the function in the brackets which you can use within the function. In your code, the Coldfusion code sets the selected values. What you could do have an argument that determines whether this is for displaying the first ticket or for adding new input. If you want to avoid all this, just create another similar function without Coldfusion setting the selected attribute for the options and call that for the add button.
Sep 18 '08 #10

100+
P: 769
Hey Acoder,

I went with your second way an it works. But i do have another question.For some reason when it displays. if i have multiple serial numbers. Instead of it displaying one table for one ticket an another table for another ticket. It instead puts all the tickets in one table. How could i make them go into separate tables?

Like for example
how it appears
serial information one

serial: 111 serial: 222

like for it to appear

serial information one
serial: 111

serial information two
serial: 222

i was thinking of a loop but now sure if i need to use a javascript loop or coldfusion loop.

Here is what i have.

Expand|Select|Wrap|Line Numbers
  1. <script type="text/javascript">
  2.  
  3. <!---Allows us to show previous fields --->
  4.  
  5. function showInput(divName){
  6. var dynamic = document.getElementById('dynamicInput');
  7. var thevalue = document.getElementById('theValue');
  8. var count = (document.getElementById('theValue').value -1)+ 2;
  9. thevalue.value = count;
  10. var newdiv = document.createElement('div');
  11. var divIdName = 'dynamic'+count+'Input';
  12. newdiv.setAttribute('id',divIdName);
  13.  
  14.  
  15. <!--- Adds Extra fields for Model No, Product Type, and Type of Hardware Failure  --->
  16. newdiv.innerHTML =
  17.  
  18. "<table class='zpExpandedTable' id='modeltable'>" +
  19. "<th class='sectiontitletick' colspan='7'>Serial Information "+ count +" </th>" +
  20. "<tr>" +
  21. "<td id='paddingformultitop'>Model No:&nbsp;&nbsp;&nbsp;&nbsp;</td>" +
  22. "</td>" +
  23. "<td>" +
  24.  "<select name='modelno_" + count + "'>" +
  25.  "<option value=''>Make A Selection</option>" +
  26. "<cfoutput query='models'>" + 
  27. "<option value='#model#'<cfif #model# is #model_no#>selected</cfif>>#model#</option>" + 
  28. "</cfoutput>" + 
  29.  "</select>" +
  30.  "</td>" +
  31.  "<td>" +
  32. "&nbsp;&nbsp;&nbsp;&nbsp;Product Type:"  +
  33. "</td>" +
  34. "<td>" +
  35. "<select name='producttype_" + count + "'>" +
  36. "<option value='' selected>No Choice</option>" +
  37. "<cfoutput query='getProdType'>" + 
  38. "<option value='#pk_productType#'<cfif #pk_productType# is #product_type#>selected</cfif>>#pk_productType#</option>" + 
  39. "</cfoutput>" + 
  40. "</select>" +
  41. "</td>" +
  42. "<td class='red'>" +
  43. "&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;Type Of Hardware Failure*:" +
  44. "</td>" +
  45. "<td>" +
  46. "<select name='hardwarefailure_" + count + "'>" +
  47. "<option value='' selected>Make A Selection</option>" +
  48. "<cfoutput query='getHardwareFail'>" +
  49. "<option value='#pk_hardwareFailure#'<cfif #pk_hardwareFailure# is #type_hardware_failure#>selected</cfif>>#pk_hardwareFailure#</option>" +
  50. "</cfoutput>" +
  51. "</select>" +
  52. "</td>" +
  53. "</tr>" +
  54. "<table>";
  55.  
  56. <!--- Adds Extra fields for Serial Number and Software/Hardware  --->
  57. newdiv.innerHTML = newdiv.innerHTML +
  58. "<table class='zpExpandedTable' id='modeltable'>" +
  59. "<tr>" +
  60. "<td id='paddingformultitop'>" +
  61. "Serial Number:&nbsp;&nbsp;" +
  62. "<cfoutput query="serial"><input type='text' name='serialnum_" + count + "' value='#pka_serialNo#' ></cfoutput>" +
  63. "&nbsp;&nbsp;&nbsp;&nbsp;Software/Hardware:&nbsp;&nbsp;" +
  64. "<select name='softhardware_" + count + "'>" +
  65. "<option value='' selected>No Choice</option>" +
  66. "<cfoutput query='getSoftHard'>" + 
  67. "<option value='#pk_softwareHardware#'<cfif #pk_softwareHardware# is #software_hardware#>selected</cfif>>#pk_softwareHardware#</option>" + 
  68. "</cfoutput>" + 
  69. "</select>" +
  70. "</td>" +
  71. "</tr>" +
  72. "</table>";
  73.  
  74. <!--- Adds Extra fields for Description ---> 
  75. newdiv.innerHTML = newdiv.innerHTML + 
  76. "<table class='zpExpandedTable' id='resoltable' cellpadding='3' cellspacing='0'>" +
  77. "<tr>" +
  78. "<td id='paddingformutli'>" +
  79. "Description:&nbsp;&nbsp;" + 
  80. "</td>" +
  81. "<td class='descriptionmoveinmulti'>" +
  82. "( You may enter up to 500 characters. )"+
  83. "<br>" +
  84. "<cfoutput query="description"><textarea maxlength='500' onkeyup='return ismaxlength(this)' onkeydown='return ismaxlength(this)'rows='4' cols='60' name='thedescription_" + count + "'>#description#</textarea></cfoutput>" + 
  85. "</td>" +
  86. "</tr>" +
  87. "</table>";
  88.  
  89. <!--- Adds Extra fields for Resolution  --->
  90. newdiv.innerHTML = newdiv.innerHTML +
  91. "<table class='zpExpandedTable' id='resoltable' cellpadding='1' cellspacing='0'>" +
  92. "<tr>" +
  93. "<td id='paddingformutli'>" +
  94. "Resolution:&nbsp;&nbsp;" +
  95. "</td>" +
  96. "<td class='resolutionmoveinmulti'>" +
  97. "( You may enter up to 500 characters. )"+
  98. "<br>" +
  99. "<cfoutput query='serial'><textarea  maxlength='500' onkeyup='return ismaxlength(this)' onkeydown='return ismaxlength(this)' rows='4' cols='60' name='resolution_" + count + "'>#resolution#</textarea></cfoutput>" +
  100. "</td>" +
  101. "</tr>" +
  102. "</table>";
  103.  
  104. <!--- Adds Extra fields for Resolution Date, Current Date (for resolution date) and resolution vertified as effective by  --->
  105. newdiv.innerHTML = newdiv.innerHTML +
  106. "<table class='zpExpandedTable' id='resoldatetab' cellpadding='1' cellspacing='0'>" +
  107. "<tr>" +
  108. "<td id='paddingformultitop'>" +
  109. "Resolution Date:&nbsp;(MM/DD/YYYY)&nbsp;&nbsp;" +
  110. "</td>" +
  111. "<td>" +
  112. "<cfoutput query='serial'><input type='text' name='resdate_" + count + "' value='#resolution_date#'>&nbsp;&nbsp;</cfoutput>" +
  113.  
  114. "&nbsp;&nbsp;&nbsp;&nbsp;Current Date:&nbsp;&nbsp;" +
  115. "<input type='checkbox' name='currentdateresol_" + count + "' onClick=resdate_" + count + ".value=fill_date()>" +
  116. "</td>" +
  117. "<td>" +
  118. "Resolution Verified as effective by:&nbsp;&nbsp;"  +
  119. "</td>" +
  120. "<td>" +
  121. "<select name='resvertified_" + count + "'>" +
  122. "<option value='' selected>Make A Selection</option>" +
  123. "<cfoutput query='gettech'>" +
  124. "<option value='#fname# #lname#'<cfif '#fname# #lname#' is #resolution_verified_by#>selected</cfif>>#fname# #lname#</option>" +
  125. " </cfoutput>" +
  126. "</select>" +
  127. "</td>" +
  128. "</tr>" +
  129. "</table>";
  130.  
  131. <!--- Adds Extra fields for Vertification Date, Current Date (for vertification date)   --->
  132. newdiv.innerHTML = newdiv.innerHTML +
  133. "<table class='zpExpandedTable' id='resoltable' cellpadding='1' cellspacing='0'>" +
  134. "<tr>" +
  135. "<td id='paddingformultitop'>" +
  136. "Verification Date:&nbsp;(MM/DD/YYYY)&nbsp;&nbsp;" +
  137. "</td>" +
  138. "<td class='vertificationmoveinmulti'>" +
  139. "<cfoutput query='serial'><input type='text' name='vertifidate_" + count + "' value='#verification_date#'>&nbsp;&nbsp;</cfoutput>" +
  140. "&nbsp;&nbsp;&nbsp;&nbsp;Current Date:&nbsp;&nbsp;" +
  141. "<input type='checkbox' name='currentdatevert_" + count + "' onClick=vertifidate_" + count + ".value=fill_date()>" +
  142. "</td>" +
  143. "</tr>" +
  144. "</table>";
  145.  
  146. <!--- Adds Extra fields for Dept/Vendor Responsibility  --->
  147. newdiv.innerHTML = newdiv.innerHTML +
  148. "<table class='zpExpandedTable' id='resoltable' cellpadding='1' cellspacing='0'>" +
  149. "<tr>" +
  150. "<td class='red' id='paddingformultitop'>" +
  151. "Dept/Vendor Responsibility*:&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;"  +
  152. "<select name='deptvendor_" + count + "'>" +
  153. "<option value='' selected>Make A Selection</option>" +
  154. "<cfoutput query='getDeptVendor'>" +
  155. "<option value='#pk_deptVendor#'<cfif #pk_deptVendor# is #dept_responsibility#>selected</cfif>>#pk_deptVendor#</option>" +
  156. " </cfoutput>" +
  157. "</select>" +
  158. "</td>" +
  159. "</tr>" +
  160. "</table>";
  161.  
  162. <!--- Adds Extra fields for RMA Data Only  --->
  163. newdiv.innerHTML = newdiv.innerHTML +
  164. "<table class='zpExpandedTable' id='resoltable' cellpadding='1' cellspacing='0'>" +
  165. "<tr>" +
  166. "<td id='paddingformultitop'>" +
  167. "RMA Data Only:&nbsp;&nbsp;&nbsp;&nbsp;" +
  168. "</td>" +
  169. "<td class='rmanmoveinmulti'>" +
  170. "( You may enter up to 500 characters. )"+
  171. "<br/>" +
  172. "<cfoutput query='serial'><textarea maxlength='500' onkeyup='return ismaxlength(this)' onkeydown='return ismaxlength(this)' rows='4' cols='60' name='rma_" + count + "' >#rma_data#</textarea></cfoutput> " +
  173. "</td>" +
  174. "</tr>" +
  175. "</table>" +
  176. "<input type='hidden' name='serialcount' value='" + count + "'>";
  177.  
  178. <!--- Adds Delete to every ticket  --->
  179. newdiv.innerHTML = newdiv.innerHTML +
  180. "<table class='zpExpandedTable' id='resoltable' cellpadding='1' cellspacing='0'>" +
  181. "<tr>" +
  182. "<td>" +
  183. "<input type='button' class='removeticket' value='Remove Serial &quot;"+count +"&quot;' onclick=\"removeElement(\'"+divIdName+"\')\"></a>" +
  184. "</td>" +
  185. "</td>" +
  186. "</tr>" +
  187. "</table>";
  188.  
  189.  document.getElementById(divName).appendChild(newdiv);
  190.  
  191.  
  192.  <!---Allows us to add serial information multiple times --->
  193. function addInput(divName){
  194. var dynamic = document.getElementById('dynamicInput');
  195. var thevalue = document.getElementById('theValue');
  196. var count = (document.getElementById('theValue').value -1)+ 2;
  197. thevalue.value = count;
  198. var newdiv = document.createElement('div');
  199. var divIdName = 'dynamic'+count+'Input';
  200. newdiv.setAttribute('id',divIdName);
  201.  
  202. <!--- Adds Extra fields for Model No, Product Type, and Type of Hardware Failure  --->
  203. newdiv.innerHTML =
  204. "<table class='zpExpandedTable' id='modeltable'>" +
  205. "<th class='sectiontitletick' colspan='7'>Serial Information "+ count +" </th>" +
  206. "<tr>" +
  207. "<td id='paddingformultitop'>Model No:&nbsp;&nbsp;&nbsp;&nbsp;</td>" +
  208. "</td>" +
  209. "<td>" +
  210.  "<select name='modelno_" + count + "' >" +
  211.  "<option value=''>Make A Selection</option>" +
  212. "<cfoutput query='models'>" + 
  213. "<option value='#model#'>#model#</option>" + 
  214. "</cfoutput>" + 
  215.  "</select>" +
  216.  "</td>" +
  217.  "<td>" +
  218. "&nbsp;&nbsp;&nbsp;&nbsp;Product Type:"  +
  219. "</td>" +
  220. "<td>" +
  221. "<select name='producttype_" + count + "'>" +
  222. "<option value='' selected>No Choice</option>" +
  223. "<cfoutput query='getProdType'>" + 
  224. "<option value='#pk_productType#'>#pk_productType#</option>" + 
  225. "</cfoutput>" + 
  226. "</select>" +
  227. "</td>" +
  228. "<td class='red'>" +
  229. "&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;Type Of Hardware Failure*:" +
  230. "</td>" +
  231. "<td>" +
  232. "<select name='hardwarefailure_" + count + "'>" +
  233. "<option value='' selected>Make A Selection</option>" +
  234. "<cfoutput query='getHardwareFail'>" +
  235. "<option value='#pk_hardwareFailure#'>#pk_hardwareFailure#</option>" +
  236. "</cfoutput>" +
  237. "</select>" +
  238. "</td>" +
  239. "</tr>" +
  240. "<table>";
  241.  
  242. <!--- Adds Extra fields for Serial Number and Software/Hardware  --->
  243. newdiv.innerHTML = newdiv.innerHTML +
  244. "<table class='zpExpandedTable' id='modeltable'>" +
  245. "<tr>" +
  246. "<td id='paddingformultitop'>" +
  247. "Serial Number:&nbsp;&nbsp;" +
  248. "<input type='text' name='serialnum_" + count + "'>" +
  249. "&nbsp;&nbsp;&nbsp;&nbsp;Software/Hardware:&nbsp;&nbsp;" +
  250. "<select name='softhardware_" + count + "'>" +
  251. "<option value='' selected>No Choice</option>" +
  252. "<cfoutput query='getSoftHard'>" + 
  253. "<option value='#pk_softwareHardware#'>#pk_softwareHardware#</option>" + 
  254. "</cfoutput>" + 
  255. "</select>" +
  256. "</td>" +
  257. "</tr>" +
  258. "</table>";
  259.  
  260. <!--- Adds Extra fields for Description  --->
  261. newdiv.innerHTML = newdiv.innerHTML + 
  262. "<table class='zpExpandedTable' id='resoltable' cellpadding='3' cellspacing='0'>" +
  263. "<tr>" +
  264. "<td id='paddingformutli'>" +
  265. "Description:&nbsp;&nbsp;" + 
  266. "</td>" +
  267. "<td class='descriptionmoveinmulti'>" +
  268. "( You may enter up to 500 characters. )"+
  269. "<br>" +
  270. "<textarea maxlength='500' onkeyup='return ismaxlength(this)' onkeydown='return ismaxlength(this)'rows='4' cols='60' name='thedescription_" + count + "'></textarea>" + 
  271. "</td>" +
  272. "</tr>" +
  273. "</table>";
  274.  
  275. <!--- Adds Extra fields for Resolution  --->
  276. newdiv.innerHTML = newdiv.innerHTML +
  277. "<table class='zpExpandedTable' id='resoltable' cellpadding='1' cellspacing='0'>" +
  278. "<tr>" +
  279. "<td id='paddingformutli'>" +
  280. "Resolution:&nbsp;&nbsp;" +
  281. "</td>" +
  282. "<td class='resolutionmoveinmulti'>" +
  283. "( You may enter up to 500 characters. )"+
  284. "<br>" +
  285. "<textarea  maxlength='500' onkeyup='return ismaxlength(this)' onkeydown='return ismaxlength(this)' rows='4' cols='60' name='resolution_" + count + "'></textarea>" +
  286. "</td>" +
  287. "</tr>" +
  288. "</table>";
  289.  
  290. <!--- Adds Extra fields for Resolution Date, Current Date (for resolution date) and resolution vertified as effective by  --->
  291. newdiv.innerHTML = newdiv.innerHTML +
  292. "<table class='zpExpandedTable' id='resoldatetab' cellpadding='1' cellspacing='0'>" +
  293. "<tr>" +
  294. "<td id='paddingformultitop'>" +
  295. "Resolution Date:&nbsp;(MM/DD/YYYY)&nbsp;&nbsp;" +
  296. "</td>" +
  297. "<td>" +
  298. "<input type='text' name='resdate_" + count + "' value=''  >&nbsp;&nbsp;" +
  299.  
  300. "&nbsp;&nbsp;&nbsp;&nbsp;Current Date:&nbsp;&nbsp;" +
  301. "<input type='checkbox' name='currentdateresol_" + count + "' onClick=resdate_" + count + ".value=fill_date()>" +
  302. "</td>" +
  303. "<td>" +
  304.  
  305. "Resolution Verified as effective by:&nbsp;&nbsp;"  +
  306. "</td>" +
  307. "<td>" +
  308. "<select name='resvertified_" + count + "'>" +
  309. "<option value='' selected>Make A Selection</option>" +
  310. "<cfoutput query='gettech'>" +
  311. "<option value='#fname# #lname#'>#fname# #lname#</option>" +
  312. " </cfoutput>" +
  313. "</select>" +
  314. "</td>" +
  315. "</tr>" +
  316. "</table>";
  317.  
  318. <!--- Adds Extra fields for Vertification Date, Current Date (for vertification date) and resolution vertified as effective by  --->
  319. newdiv.innerHTML = newdiv.innerHTML +
  320. "<table class='zpExpandedTable' id='resoltable' cellpadding='1' cellspacing='0'>" +
  321. "<tr>" +
  322. "<td id='paddingformultitop'>" +
  323. "Verification Date:&nbsp;(MM/DD/YYYY)&nbsp;&nbsp;" +
  324. "</td>" +
  325. "<td class='vertificationmoveinmulti'>" +
  326. "<input type='text' name='vertifidate_" + count + "'>&nbsp;&nbsp;" +
  327. "&nbsp;&nbsp;&nbsp;&nbsp;Current Date:&nbsp;&nbsp;" +
  328. "<input type='checkbox' name='currentdatevert_" + count + "' onClick=vertifidate_" + count + ".value=fill_date()>" +
  329. "</td>" +
  330. "</tr>" +
  331. "</table>";
  332.  
  333. <!--- Adds Extra fields for Dept/Vendor Responsibility  --->
  334. newdiv.innerHTML = newdiv.innerHTML +
  335. "<table class='zpExpandedTable' id='resoltable' cellpadding='1' cellspacing='0'>" +
  336. "<tr>" +
  337. "<td class='red' id='paddingformultitop'>" +
  338. "Dept/Vendor Responsibility*:&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;"  +
  339. "<select name='deptvendor_" + count + "'>" +
  340. "<option value='' selected>Make A Selection</option>" +
  341. "<cfoutput query='getDeptVendor'>" +
  342. "<option value='#pk_deptVendor#'>#pk_deptVendor#</option>" +
  343. " </cfoutput>" +
  344. "</select>" +
  345. "</td>" +
  346. "</tr>" +
  347. "</table>";
  348.  
  349. <!--- Adds Extra fields for RMA Data Only  --->
  350. newdiv.innerHTML = newdiv.innerHTML +
  351. "<table class='zpExpandedTable' id='resoltable' cellpadding='1' cellspacing='0'>" +
  352. "<tr>" +
  353. "<td id='paddingformultitop'>" +
  354. "RMA Data Only:&nbsp;&nbsp;&nbsp;&nbsp;" +
  355. "</td>" +
  356. "<td class='rmanmoveinmulti'>" +
  357. "( You may enter up to 500 characters. )"+
  358. "<br/>" +
  359. "<textarea maxlength='500' onkeyup='return ismaxlength(this)' onkeydown='return ismaxlength(this)' rows='4' cols='60' name='rma_" + count + "'></textarea> " +
  360. "</td>" +
  361. "</tr>" +
  362. "</table>" +
  363. "<input type='hidden' name='serialcount' value='" + count + "'>";
  364.  
  365. <!--- Adds Delete to every ticket  --->
  366. newdiv.innerHTML = newdiv.innerHTML +
  367. "<table class='zpExpandedTable' id='resoltable' cellpadding='1' cellspacing='0'>" +
  368. "<tr>" +
  369. "<td>" +
  370. "<input type='button' class='removeticket' value='Remove Serial &quot;"+count +"&quot;' onclick=\"removeElement(\'"+divIdName+"\')\"></a>" +
  371. "</td>" +
  372. "</td>" +
  373. "</tr>" +
  374. "</table>";
  375.  
  376. document.getElementById(divName).appendChild(newdiv);
  377.  
  378.  
  379. <!---Allows us to remove multiple fields --->
  380. function removeElement(divNum) {
  381.   var d = document.getElementById('dynamicInput');
  382.   var olddiv = document.getElementById(divNum);
  383.   d.removeChild(olddiv);
  384. }
  385.  
  386. </script>
  387. <body onload="showInput('dynamicInput');">
  388. <form>
  389. <input type="hidden" value="0" id="theValue" />
  390.      <div id="dynamicInput">
  391.      <!--- All Ticket Information Appears Here--->
  392.  
  393.      </div>
  394.      <input type="button" class="addticket" value="Add Serial" onClick="addInput('dynamicInput');" >
  395. </form>
  396. </body>
Thank you :),
Rach
Sep 18 '08 #11

acoder
Expert Mod 15k+
P: 16,027
Just add a <br> tag in between.

I notice that you're using a separate table for each and every field. It'd make more sense to have one table per ticket.
Sep 18 '08 #12

100+
P: 769
Just add a <br> tag in between.

I notice that you're using a separate table for each and every field. It'd make more sense to have one table per ticket.
Hey Acoder,

yes you are right it does make more sense to use one table. An i tried to do it that way but i ended up running into lots of trouble which is why it ended up the way it is.

I tried the <br> tag but it don't work. What i am trying to do is right now every ticket i ever added appears like this

serial information 1

serial: 1 serial: 2 modenol:4 modelno: 5

but it needs to appear like this

serial information 1
serial: 1 modelno:4

serial information 2
serial: 2 modelno: 5

its kinda hard to explain so i took a picture of it. http://img145.imageshack.us/my.php?image=page1ie1.jpg

Thank you for all the help :),
Rach
Sep 18 '08 #13

acoder
Expert Mod 15k+
P: 16,027
Use a <tr> element to create a new row, so you'll have to move things around. Instead of putting them next to each other using <td> cells, use rows.
Sep 18 '08 #14

100+
P: 769
Use a <tr> element to create a new row, so you'll have to move things around. Instead of putting them next to each other using <td> cells, use rows.
Hey Acoder

i can not see how putting all the elements in rows will make everything appear in separate tables.If i change each td to tr it will make it look like this

model no
serial no

instead of what i need to look like which is this model no serial no

but i am just confused on how changing the td's to tr's will make that big of a difference if you could please explain it i might understand better on how to go about this.

here is an example of how i am trying to make it show previously entered tickets.

http://img178.imageshack.us/my.php?image=appearda5.jpg

Thank you for all the help :),
Rach
Sep 19 '08 #15

100+
P: 769
Hey Acoder,

If i change all the td's to tr's wont it just make each field appear in a line like

model no
serial no

what i am trying to do is right now all the serials that i added appear under
serial information 1. an i am trying to make it where the first serial number is under serial information 1 and the second serial is under serial information 2. Is there anyway to make it show all serials that have been added on load in there own sections like serial number 1 and serial number 2 instead of all serials that been added appear on serial information 1?

Thank you again for all the help :),
Rach
Sep 20 '08 #16

acoder
Expert Mod 15k+
P: 16,027
Now I think I'm beginning to understand what the problem is.

I assume you're using some Coldfusion code to loop over the previous tickets to display them. You can add a table header "Serial Information " based on the count which would increment on each loop iteration.
Sep 22 '08 #17

100+
P: 769
Now I think I'm beginning to understand what the problem is.

I assume you're using some Coldfusion code to loop over the previous tickets to display them. You can add a table header "Serial Information " based on the count which would increment on each loop iteration.
Hey Acoder,

Right now i am not using a loop, i am just having it output the results. Was thinking i needed a loop but not sure how to apply a loop for this particular situation, would i apply it to the following since i use this to output the results?

Expand|Select|Wrap|Line Numbers
  1. <cfquery name="serial" datasource="CustomerSupport">
  2.         SELECT pka_serialNo,pkb_fk_ticketNo,model_no,product_type,software_hardware,
  3. resolution,resolution_date,verification_date
  4. ,rma_data,type_hardware_failure,dept_responsibility,resolution_verified_by FROM dbo.tbl_CS_serial
  5. </cfquery>
or would i do something to the following below to make it loop?

Expand|Select|Wrap|Line Numbers
  1. <cfoutput query="serial">
  2. <cfset model_no = #model_no#>
  3. <cfset product_type = #product_type#>
  4. <cfset type_hardware_failure = #type_hardware_failure#>
  5. <cfset software_hardware = #software_hardware#>
  6. <cfset resolution_verified_by = #resolution_verified_by#>
  7. <cfset dept_responsibility = #dept_responsibility#>
  8. </cfoutput>
  9.  
  10. <script type="text/javascript">
  11.  
  12. <!---Allows us to show previous fields --->
  13.  
  14. function showInput(divName){
  15. var dynamic = document.getElementById('dynamicInput');
  16. var thevalue = document.getElementById('theValue');
  17. var count = (document.getElementById('theValue').value -1)+ 2;
  18. thevalue.value = count;
  19. var newdiv = document.createElement('div');
  20. var divIdName = 'dynamic'+count+'Input';
  21. newdiv.setAttribute('id',divIdName);
  22.  
  23.  
  24. <!--- Adds Extra fields for Model No, Product Type, and Type of Hardware Failure  --->
  25. newdiv.innerHTML =
  26.  
  27. "<table class='zpExpandedTable' id='modeltable'>" +
  28. "<th class='sectiontitletick' colspan='7'>Serial Information "+ count +" </th>" +
  29. "<tr>" +
  30. "<td id='paddingformultitop'>Model No:&nbsp;&nbsp;&nbsp;&nbsp;</td>" +
  31. "</td>" +
  32. "<td>" +
  33.  "<select name='modelno_" + count + "'>" +
  34.  "<option value=''>Make A Selection</option>" +
  35. "<cfoutput query='models'>" + 
  36. "<option value='#model#'<cfif #model# is #model_no#>selected</cfif>>#model#</option>" + 
  37. "</cfoutput>" + 
  38.  "</select>" +
  39.  "</td>" +
  40.  "<td>" +
  41. "&nbsp;&nbsp;&nbsp;&nbsp;Product Type:"  +
  42. "</td>" +
  43. "<td>" +
  44. "<select name='producttype_" + count + "'>" +
  45. "<option value='' selected>No Choice</option>" +
  46. "<cfoutput query='getProdType'>" + 
  47. "<option value='#pk_productType#'<cfif #pk_productType# is #product_type#>selected</cfif>>#pk_productType#</option>" + 
  48. "</cfoutput>" + 
  49. "</select>" +
  50. "</td>" +
  51. "<td class='red'>" +
  52. "&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;Type Of Hardware Failure*:" +
  53. "</td>" +
  54. "<td>" +
  55. "<select name='hardwarefailure_" + count + "'>" +
  56. "<option value='' selected>Make A Selection</option>" +
  57. "<cfoutput query='getHardwareFail'>" +
  58. "<option value='#pk_hardwareFailure#'<cfif #pk_hardwareFailure# is #type_hardware_failure#>selected</cfif>>#pk_hardwareFailure#</option>" +
  59. "</cfoutput>" +
  60. "</select>" +
  61. "</td>" +
  62. "</tr>" +
  63. "<table>";
  64.  
  65. <!--- Adds Extra fields for Serial Number and Software/Hardware  --->
  66. newdiv.innerHTML = newdiv.innerHTML +
  67. "<table class='zpExpandedTable' id='modeltable'>" +
  68. "<tr>" +
  69. "<td id='paddingformultitop'>" +
  70. "Serial Number:&nbsp;&nbsp;" +
  71. "<cfoutput query="serial"><input type='text' name='serialnum_" + count + "' value='#pka_serialNo#' ></cfoutput>" +
  72. "&nbsp;&nbsp;&nbsp;&nbsp;Software/Hardware:&nbsp;&nbsp;" +
  73. "<select name='softhardware_" + count + "'>" +
  74. "<option value='' selected>No Choice</option>" +
  75. "<cfoutput query='getSoftHard'>" + 
  76. "<option value='#pk_softwareHardware#'<cfif #pk_softwareHardware# is #software_hardware#>selected</cfif>>#pk_softwareHardware#</option>" + 
  77. "</cfoutput>" + 
  78. "</select>" +
  79. "</td>" +
  80. "</tr>" +
  81. "</table>";
  82.  
  83. <!--- Adds Extra fields for Description ---> 
  84. newdiv.innerHTML = newdiv.innerHTML + 
  85. "<table class='zpExpandedTable' id='resoltable' cellpadding='3' cellspacing='0'>" +
  86. "<tr>" +
  87. "<td id='paddingformutli'>" +
  88. "Description:&nbsp;&nbsp;" + 
  89. "</td>" +
  90. "<td class='descriptionmoveinmulti'>" +
  91. "( You may enter up to 500 characters. )"+
  92. "<br>" +
  93. "<cfoutput query="description"><textarea maxlength='500' onkeyup='return ismaxlength(this)' onkeydown='return ismaxlength(this)'rows='4' cols='60' name='thedescription_" + count + "'>#description#</textarea></cfoutput>" + 
  94. "</td>" +
  95. "</tr>" +
  96. "</table>";
  97.  
  98. <!--- Adds Extra fields for Resolution  --->
  99. newdiv.innerHTML = newdiv.innerHTML +
  100. "<table class='zpExpandedTable' id='resoltable' cellpadding='1' cellspacing='0'>" +
  101. "<tr>" +
  102. "<td id='paddingformutli'>" +
  103. "Resolution:&nbsp;&nbsp;" +
  104. "</td>" +
  105. "<td class='resolutionmoveinmulti'>" +
  106. "( You may enter up to 500 characters. )"+
  107. "<br>" +
  108. "<cfoutput query='serial'><textarea  maxlength='500' onkeyup='return ismaxlength(this)' onkeydown='return ismaxlength(this)' rows='4' cols='60' name='resolution_" + count + "'>#resolution#</textarea></cfoutput>" +
  109. "</td>" +
  110. "</tr>" +
  111. "</table>";
  112.  
  113. <!--- Adds Extra fields for Resolution Date, Current Date (for resolution date) and resolution vertified as effective by  --->
  114. newdiv.innerHTML = newdiv.innerHTML +
  115. "<table class='zpExpandedTable' id='resoldatetab' cellpadding='1' cellspacing='0'>" +
  116. "<tr>" +
  117. "<td id='paddingformultitop'>" +
  118. "Resolution Date:&nbsp;(MM/DD/YYYY)&nbsp;&nbsp;" +
  119. "</td>" +
  120. "<td>" +
  121. "<cfoutput query='serial'><input type='text' name='resdate_" + count + "' value='#resolution_date#'>&nbsp;&nbsp;</cfoutput>" +
  122.  
  123. "&nbsp;&nbsp;&nbsp;&nbsp;Current Date:&nbsp;&nbsp;" +
  124. "<input type='checkbox' name='currentdateresol_" + count + "' onClick=resdate_" + count + ".value=fill_date()>" +
  125. "</td>" +
  126. "<td>" +
  127. "Resolution Verified as effective by:&nbsp;&nbsp;"  +
  128. "</td>" +
  129. "<td>" +
  130. "<select name='resvertified_" + count + "'>" +
  131. "<option value='' selected>Make A Selection</option>" +
  132. "<cfoutput query='gettech'>" +
  133. "<option value='#fname# #lname#'<cfif "#fname# #lname#" is #resolution_verified_by#>selected</cfif>>#fname# #lname#</option>" +
  134. " </cfoutput>" +
  135. "</select>" +
  136. "</td>" +
  137. "</tr>" +
  138. "</table>";
  139.  
  140.  
  141. <!--- Adds Extra fields for Vertification Date, Current Date (for vertification date)   --->
  142. newdiv.innerHTML = newdiv.innerHTML +
  143. "<table class='zpExpandedTable' id='resoltable' cellpadding='1' cellspacing='0'>" +
  144. "<tr>" +
  145. "<td id='paddingformultitop'>" +
  146. "Verification Date:&nbsp;(MM/DD/YYYY)&nbsp;&nbsp;" +
  147. "</td>" +
  148. "<td class='vertificationmoveinmulti'>" +
  149. "<cfoutput query='serial'><input type='text' name='vertifidate_" + count + "' value='#verification_date#'>&nbsp;&nbsp;</cfoutput>" +
  150. "&nbsp;&nbsp;&nbsp;&nbsp;Current Date:&nbsp;&nbsp;" +
  151. "<input type='checkbox' name='currentdatevert_" + count + "' onClick=vertifidate_" + count + ".value=fill_date()>" +
  152. "</td>" +
  153. "</tr>" +
  154. "</table>";
  155.  
  156. <!--- Adds Extra fields for Dept/Vendor Responsibility  --->
  157. newdiv.innerHTML = newdiv.innerHTML +
  158. "<table class='zpExpandedTable' id='resoltable' cellpadding='1' cellspacing='0'>" +
  159. "<tr>" +
  160. "<td class='red' id='paddingformultitop'>" +
  161. "Dept/Vendor Responsibility*:&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;"  +
  162. "<select name='deptvendor_" + count + "'>" +
  163. "<option value='' selected>Make A Selection</option>" +
  164. "<cfoutput query='getDeptVendor'>" +
  165. "<option value='#pk_deptVendor#'<cfif #pk_deptVendor# is #dept_responsibility#>selected</cfif>>#pk_deptVendor#</option>" +
  166. " </cfoutput>" +
  167. "</select>" +
  168. "</td>" +
  169. "</tr>" +
  170. "</table>";
  171.  
  172. <!--- Adds Extra fields for RMA Data Only  --->
  173. newdiv.innerHTML = newdiv.innerHTML +
  174. "<table class='zpExpandedTable' id='resoltable' cellpadding='1' cellspacing='0'>" +
  175. "<tr>" +
  176. "<td id='paddingformultitop'>" +
  177. "RMA Data Only:&nbsp;&nbsp;&nbsp;&nbsp;" +
  178. "</td>" +
  179. "<td class='rmanmoveinmulti'>" +
  180. "( You may enter up to 500 characters. )"+
  181. "<br/>" +
  182. "<cfoutput query='serial'><textarea maxlength='500' onkeyup='return ismaxlength(this)' onkeydown='return ismaxlength(this)' rows='4' cols='60' name='rma_" + count + "' >#rma_data#</textarea></cfoutput> " +
  183. "</td>" +
  184. "</tr>" +
  185. "</table>" +
  186. "<input type='hidden' name='serialcount' value='" + count + "'>";
  187.  
  188. <!--- Adds Delete to every ticket  --->
  189. newdiv.innerHTML = newdiv.innerHTML +
  190. "<table class='zpExpandedTable' id='resoltable' cellpadding='1' cellspacing='0'>" +
  191. "<tr>" +
  192. "<td>" +
  193. "<input type='button' class='removeticket' value='Remove Serial &quot;"+count +"&quot;' onclick=\"removeElement(\'"+divIdName+"\')\"></a>" +
  194. "</td>" +
  195. "</td>" +
  196. "</tr>" +
  197. "</table><br>";
  198.  
  199.  document.getElementById(divName).appendChild(newdiv);
  200.  
  201.  
Thank you again for all the help :),
Rach
Sep 22 '08 #18

acoder
Expert Mod 15k+
P: 16,027
This should really be output using Coldfusion without using JavaScript. If you want to do this, start a new thread in the Coldfusion forum.
Sep 22 '08 #19

100+
P: 769
This should really be output using Coldfusion without using JavaScript. If you want to do this, start a new thread in the Coldfusion forum.
Hey Acoder,

started a new thread in the coldfusion here is a link to it

http://bytes.com/forum/showthread.ph...19#post3361219

Thank you for all the help,
Rach
Sep 22 '08 #20

Post your reply

Sign in to post your reply or Sign up for a free account.