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

The form does not include the element...

dmjpro
100+
P: 2,476
I am generating a HTML code through AJAX, and setting that HTML into a DIV and the DIV is inside a form. Now the form does not include an element which is being generated through AJAX. But whenever i access that element using ...
Expand|Select|Wrap|Line Numbers
  1. document.getElementsByName('element_name').length //it returns some value.
  2.  
But whenever i trying to access that element using ...
Expand|Select|Wrap|Line Numbers
  1. document.forms['form_name'].elements['element_name'] //it returns undefined.
  2.  
This is not working in Mozilla but in IE working. What could be the problem, please help me out !!
Sep 23 '08 #1
Share this Question
Share on Google+
9 Replies


acoder
Expert Mod 15k+
P: 16,027
Show the code that you're using, what you're returning from the script and the HTML code.
Sep 23 '08 #2

dmjpro
100+
P: 2,476
Show the code that you're using, what you're returning from the script and the HTML code.
The HTML view goes here ....

Expand|Select|Wrap|Line Numbers
  1.  
  2.  
  3. <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
  4. "http://www.w3.org/TR/html4/loose.dtd">
  5. <link rel='StyleSheet' href='./css/style1.css' />
  6.  
  7. <html>
  8.     <head>
  9.         <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
  10.         <title>Project Proposals Delete</title>
  11.         <script language="JavaScript" src="./build/common.js"></script>
  12.         <script type="text/javascript" language="JavaScript" src="./build/proposal_delete.js"></script>
  13.  
  14.     </head>
  15.    <body onload="ajaxFullDetails('31')">
  16.  
  17.         <fieldset>
  18.             <legend>Delete Proposal </legend>
  19.             <table align="left" cellpadding="5" cellspacing="5" border="0" width="100%">
  20.                 <form name="proposal_delete"> 
  21.                     <tr>   
  22.                         <td width="10%" align="right">
  23.                             <b>Search By</b>                        
  24.                         </td>
  25.  
  26.                         <td>
  27.                             <input type="radio" name="propSearch"  value="ByDepartment" onclick="showType()" > By Department
  28.                             <br> 
  29.                             <input type="radio" name="propSearch"  value="ByPcode" onclick="showType()" > By ProposalCode
  30.  
  31.                         </td>
  32.                         <td colspan="1">
  33.                             <table border="1"  style='border-color:#557CD7' id=display_tab cellspacing=2 cellpadding=4 align="left">
  34.                                 <tr>
  35.                                     <th>Total No Of Proposal</th>
  36.  
  37.                                     <th>Total No Of Approved Proposal</th>
  38.                                     <th>Total No Of New Proposal</th>
  39.                                 </tr>
  40.  
  41.                                 <tr>  
  42.                                     <td align="center"><input type="text"  size="10" value="112"  readonly> </td>
  43.                                     <td align="center"><input type="text"  size="10" value="95"  readonly></td>
  44.                                     <td align="center"><input type="text"  size="10" value="17"  readonly></td>
  45.                                 </tr>
  46.  
  47.                             </table>
  48.                         </td>  
  49.                     </tr>
  50.                   <tr>
  51.                         <td colspan="3">
  52.                             <div id="prop_dept" style="display:none">
  53.                                 <fieldset>
  54.                                     <legend> Proposal By Department </legend> 
  55.                                     <table align="center">
  56.  
  57.                                         <td><b> Department Name</b></td>
  58.                                         <td>
  59.                                             <input type="text" name="deptName" size="30" readonly>                                             
  60.                                             <img src='./html/img/lov.gif' style='width:20px;height:15px;cursor:pointer' valign='middle' onclick="getDepartment('31')"> 
  61.                                             <input type="hidden" name="deptCode" value="">
  62.                                         </td>
  63.                                     </table>                    
  64.                                 </fieldset>
  65.                             </div>
  66.  
  67.                             <div id="prop_date" style="display:none">
  68.                                 <fieldset>
  69.                                     <legend>Proposal Search By Date</legend>
  70.  
  71.                                     <table align="center">        
  72.  
  73.  
  74.                                         <tr>
  75.                                             <td >
  76.                                                 <b>From Date</b>
  77.                                             </td>
  78.  
  79.  
  80.                                             <td>
  81.  
  82.                                                 <input type="text" name="fromDate" id="fromDate"  value="" size="18" readonly />
  83.                                                 <img src='./html/images/calendar.gif' style='width:20px;height:15px;cursor:pointer' valign='middle' onClick="getDate('fromDate');">
  84.  
  85.                                             </td>
  86.  
  87.                                             <td >
  88.                                                 <b>To Date</b>
  89.                                             </td>
  90.  
  91.                                             <td >
  92.  
  93.                                                 <input type="text"  name="toDate" id="toDate"  value="" size="18" readonly  />
  94.                                                 <img src='./html/images/calendar.gif' style='width:20px;height:15px;cursor:pointer' valign='middle' onClick="getDate('toDate');">
  95.  
  96.                                             </td>
  97.  
  98.                                         </tr>
  99.  
  100.                                         <tr>
  101.                                             <td colspan="6" align="center"> 
  102.                                                 <input type="button" class="button" value="SEARCH"   onclick="getBydate('31')"> 
  103.                                             </td>
  104.                                         </tr>   
  105.                                         <tr>
  106.  
  107.                                             <td colspan="5">
  108.                                                 <font color="red">
  109.                                                     <div id="message1" align="center"></div>                             
  110.                                                 </font>
  111.                                             </td>
  112.                                         </tr>
  113.  
  114.                                     </table>                    
  115.                                 </fieldset> 
  116.                             </div>
  117.  
  118.  
  119.                              <div id="prop_status" style="display:none">
  120.  
  121.                                 <fieldset>
  122.                                     <legend> Proposal By Status </legend> 
  123.                                     <table align="center">
  124.                                         <td><b> Proposal Status </b></td>
  125.                                         <td>
  126.                                             <input type="text" id="status_prop" name="status_prop"  size="25" >                                             
  127.                                             <img src='./html/img/lov.gif' style='width:20px;height:15px;cursor:pointer' valign='middle' onclick="getStatus('31')"> 
  128.                                            <input type="hidden" name="status_desc" value="">
  129.  
  130.                                         </td>
  131.                                     </table>                    
  132.                                 </fieldset>
  133.                             </div>
  134.  
  135.  
  136.  
  137.                        <div id="prop_code" style="display:none">
  138.                                 <fieldset>
  139.                                     <legend> Proposal By Code </legend> 
  140.                                     <table align="center">
  141.                                         <td><b> Proposal Code </b></td>
  142.  
  143.                                         <td>
  144.                                             <input type="text"    id="prop_code1"   name="prop_code1"  size="25" >                                             
  145.                                             <input type="button" class="button" value="SEARCH"   onclick="getByCode('31')"> 
  146.                                           <!-- <input type="hidden" name="status_prop" value="">-->
  147.                                         </td>
  148.                                     </table>                    
  149.                                 </fieldset>
  150.                             </div>
  151.  
  152.                         </td>
  153.                     </tr> 
  154.                     <tr>
  155.  
  156.                         <td colspan="5">
  157.                             <font color="red">
  158.                                 <div id="message" align="center"></div>                             
  159.                             </font>
  160.                         </td>
  161.                     </tr>
  162.                     <tr>
  163.                         <td colspan="4">
  164.                             <div id="tables" style="display:none">
  165.  
  166.                             </div>
  167.                             <textarea cols="50" rows=25 id="vogus" name="deleteFlag"></textarea>
  168.                         </td>
  169.                     </tr>
  170.          </form> 
  171.  
  172.             </table>
  173.         </fieldset>
  174.  
  175.     </body>
  176. </html>
  177.  
Sep 24 '08 #3

dmjpro
100+
P: 2,476
The generated HTML code as plain text which is being generated through AJAX ...goes here ...

Expand|Select|Wrap|Line Numbers
  1. <table>
  2.     <tr>
  3.         <td>
  4.  
  5.  
  6. <table border=1 style='border-color:#557CD7' id=display_tab cellspacing=0 cellpadding=6 align="center">
  7.  
  8.     <tr>
  9.         <th> Code</th>
  10.         <th> Title</th>
  11.         <th> Sponsor</th>
  12.         <th> Type</th>
  13.         <th> Proposal Creation Date</th>
  14.         <th> Cost(Rs.)</th>
  15.         <th> Status</th>
  16.         <th> Delete Proposal</th>
  17.     </tr>
  18.     <tr>
  19.         <td class='searchbgcolor'><input type="hidden" value="201" name="proposalCode" id="proposalCode_0"/>OCN</td> 
  20.         <td class='searchbgcolor'>Development of client server and GUI based optimization and control network for utilization in the chemical leaching pilot plant of Tata Steel</td>
  21.         <td class='searchbgcolor'>TISCO, Jamshedpur</td> 
  22.         <td class='searchbgcolor'>Research</td>
  23.         <td class='searchbgcolor'>2008-08-18</td>
  24.         <td class='searchbgcolor'>1160000</td>
  25.         <td class='searchbgcolor'>Approved</td>
  26.         <td  class='searchbgcolor'>
  27.              <!--<input type=hidden name=row_id value = "null"/> -->
  28.  
  29.              <input type="text" name="deleteFlag" value=''/><input type="checkbox" align="right" value="" name="deleteProposal1" onclick="this.previousSibling.value=this.checked?'Y':'N'"/>
  30.         </td> 
  31.     </tr>
  32.  
  33.  
  34.  
  35.  
  36. </table>   
  37.  
  38. </td>
  39. </tr>
  40.  
  41.         <tr align="center"> 
  42.             <td>
  43.                 <table align="center">
  44.  
  45.                    <input type="button" class="button" align="middle" value="Delete" onclick="deleteProposal()" >  
  46.                    <input type="reset"  class="button" align="middle" value="Reset">  
  47.                 </table>
  48.            </td>
  49.         </tr>
  50.  
  51.          <tr>
  52.             <td colspan="5">
  53.                <font color="red" size="4">
  54.                  <div id="messageDel" align="center"></div>                             
  55.                </font>
  56.             </td>
  57.          </tr>
  58.  
  59. </table>
  60.  
Sep 24 '08 #4

dmjpro
100+
P: 2,476
Now i m setting the generated HTML code into the DIV (id=tables).
Whenever i using document.getElementsByName('deleteFlag') then it's working but whenever i suing document.forms['proposal_delete'].elements['deleteFlag'] then it's not working.
Please help!
Sep 24 '08 #5

acoder
Expert Mod 15k+
P: 16,027
You have a deleteFlag field already in the HTML code.
Sep 24 '08 #6

dmjpro
100+
P: 2,476
You have a deleteFlag field already in the HTML code.
Is that a cause ...?
Actually that text area is for test ....it is to extract the HTML code generated through AJAX.
I think some where DOM parsing is wrong. That's why form can't include the deleteFlag field..What you think.
By the way if i remove then it will work or not ?
Sep 25 '08 #7

acoder
Expert Mod 15k+
P: 16,027
I don't know. Why don't you test it? Try renaming deleteFlag in the HTML code.
Sep 25 '08 #8

dmjpro
100+
P: 2,476
I don't know. Why don't you test it? Try renaming deleteFlag in the HTML code.
Finally i managed to solve the problem...
What i did first .... simple i generated HTML code through AJAX then set it into the innerHTML of the DIV, still it was showing error. Then i stopped putting the HTML through AJAX and put the actual HTML code supposed to be generated in the main HTML code. Then it started responding correct ! ..... ;)
What i came to the conclusion, it's problem with div.innerHTML in mozilla then i looked into the site ..there they told that it's a bug .....
Then i tested a simple code .. where i set some HTML code into a DIV on body.onload and then tried to access the element added dynamically into DIV, it's working ..... :)
Then after a long test i found the error , i simply put the form tag just after body and it started working as it supposed to do .... ;)

Can you figure out ?
Sep 25 '08 #9

dmjpro
100+
P: 2,476
Finally i managed to solve the problem...
What i did first .... simple i generated HTML code through AJAX then set it into the innerHTML of the DIV, still it was showing error. Then i stopped putting the HTML through AJAX and put the actual HTML code supposed to be generated in the main HTML code. Then it started responding correct ! ..... ;)
What i came to the conclusion, it's problem with div.innerHTML in mozilla then i looked into the site ..there they told that it's a bug .....
Then i tested a simple code .. where i set some HTML code into a DIV on body.onload and then tried to access the element added dynamically into DIV, it's working ..... :)
Then after a long test i found the error , i simply put the form tag just after body and it started working as it supposed to do .... ;)

Can you figure out ?
Oh I see ............. Just now after having a deeper look at the main HTML code after this posting ..... the form tag starts just after table tag ....
it is something like ....
Expand|Select|Wrap|Line Numbers
  1. <table><form>..<div></div>...</form></table>
  2.  
I think when loaded into browser it's working but when i add the innerHTML into div dynamically then it stops working .... ;)
Sep 25 '08 #10

Post your reply

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