add remove field in java script

Posted by rajanikant on Stack Overflow See other posts from Stack Overflow or by rajanikant
Published on 2010-03-24T07:09:44Z Indexed on 2010/03/24 7:13 UTC
Read the original article Hit count: 348

Filed under:

Hi every body. i want to add and remove some html input in javascript i have done for add function . it work properly. but unable to remove. my code is following

                           fields = 1;
                        function addInput() { 
                                  if (fields != 10) {
                                  document.getElementById('text').innerHTML += "<tr><td width='15%' align='left' valign='top' class='subheading'><input type='text' name='date[]' id='date[]' /></td><td width='15%' align='left' valign='top' class='subheading'><input type='text' name='time[]' id='time[]' /></td><td width='20%' align='left' valign='top' class='subheading'><input type='text' name='module[]' id='module[]' /></td><td width='15%' align='left' valign='top' class='subheading'><input type='text' name='organisation[]' id='organisation[]' /></td><td width='20%' align='left' valign='top' class='subheading' nowrap='nowrap'><input type='text' name='category[]' id='category[]' /></td><td width='20%' align='left' valign='top' class='text' nowrap='nowrap'>Add | Remove </td></tr>";
                                  fields += 1;
                                } else {
                                   document.getElementById('text').innerHTML += "<br />Only 10 upload fields allowed.";
                       document.form.add.disabled=true;
                      }
              }
                      fields1=10
                     function removeInput() { 
                                  if (fields1 !=1) {
                                        document.getElementById('text').innerHTML += "";
                                       fields -= 1;
                                                 }
                                         }

and my php function is

                        function addSession()
                                            {?>
                               <table cellpadding="5" cellspacing="0" width="100%">
                         <tr>
                         <td width="10%" align="left" valign="top" colspan="6" bgcolor="#993333" class="heading">Add Session  </span></td>

                        </tr><tr  class="bgrow">
                         <td width="10%" align="left" valign="top" class="subheading">Datum </span></td>
                   <td width="20%" align="left" valign="top" class="subheading">Tijd</td>
                <td width="35%" align="left" valign="top" class="subheading">Module</td>
                <td width="15%" align="left" valign="top" class="subheading">Organisatie</td>
<td width="20%" align="left" valign="top" class="subheading" nowrap="nowrap">Category</td>
<td width="20%" align="left" valign="top" class="subheading" nowrap="nowrap">Action</td>
                          </tr>
                            <tr  > 
            <td width="15%" align="left" valign="top" class="subheading"><input type="text" name="date_0" id="date_0" /></td>
<td width="15%" align="left" valign="top" class="subheading"><input type="text" name="time_0" id="time_0" /></td>
<td width="20%" align="left" valign="top" class="subheading"><input type="text" name="module_0" id="module_0" /></td>
<td width="15%" align="left" valign="top" class="subheading"><input type="text" name="organisation_o" id="organisation_o" /></td>
<td width="20%" align="left" valign="top" class="subheading" nowrap="nowrap"><input type="text" name="cat_0" id="cat_0" /></td>
<td width="20%" align="left" valign="top" class="text" nowrap="nowrap"><span onclick="addInput()" class="link">Add</span> | <span onclick="removeInput()" class="link">Remove </span></td>
             </tr>
             <tbody id="text">
                         </tbody>





                   <?php
                       }

                        ?>

can any one give me solution?

© Stack Overflow or respective owner

Related posts about javascript-events