SitePoint Sponsor

User Tag List

Results 1 to 3 of 3
  1. #1
    a fresh, new start... dujmovicv's Avatar
    Join Date
    Aug 2006
    Location
    Earth
    Posts
    559
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)

    Add new input text with JS

    HI,

    I have a button inside a form that allows users to add new text input fields (total of 172!!!!) which will be processed by the form and inserted into database.
    here's the JavaScript in the head section :
    Code:
    <script language="javascript">
    fields = 1;
    function addInput() {
    if (fields != 3) {
    
    document.getElementById('new_row').innerHTML += "<tr><td><p class='fields'>RowA Nr [fields]</p></td><td><input type='text' value='' name='target_keyword_[fields]' size='30' /></td></tr><tr><td><p class='fields'>RowB Nr [fields]</p></td><td><input type='text' value='' name='Google_position_[fields]' size='30' /></td></tr><tr><td><p class='fields'>RowC Nr [fields]</p></td><td><input type='text' value='' name='date_last_checked_[fields]' size='30' /></td></tr>";
    
    fields += 1;
    } else {
    document.getElementById('button').innerHTML += "<br />Only 3 rows allowed.";
    document.company_form.add.disabled=true;
    }
    }
    </script>
    and then at the body :
    Code:
    <table id="new_row">
    
    <tr><td id="button">
    <input type="button" onclick="addInput()" name="add" value="Add input field" />
    </td></tr>
    </table>
    That's working fine BUT... I'd like to display instead of Row1 Nr [field] --> Row1 Nr 1 , according to the JS variable 'field'... Like 'Row1_Nr_$field' in PHP.
    How should I do that in JS?

    Thanks in advance!

    Full time ADMIN - art community
    Part time coder - dsign

  2. #2
    Web Professional
    Join Date
    Oct 2008
    Location
    London
    Posts
    862
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    You can't have variables in a string like you can in PHP. You need to pull them out and concatenate with plus operator:

    Code JavaScript:
    document.getElementById('new_row').innerHTML += "<tr><td><p class='fields'>RowA Nr " + fields + "</p></td><td><input type='text' value='' name='target_keyword_" + fields + "' size='30' /></td></tr><tr><td><p class='fields'>RowB Nr " + fields + "</p></td><td><input type='text' value='' name='Google_position_" + fields + "' size='30' /></td></tr><tr><td><p class='fields'>RowC Nr " + fields + "</p></td><td><input type='text' value='' name='date_last_checked_" + fields + "' size='30' /></td></tr>";

  3. #3
    a fresh, new start... dujmovicv's Avatar
    Join Date
    Aug 2006
    Location
    Earth
    Posts
    559
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Thank you very much!!!!

    Full time ADMIN - art community
    Part time coder - dsign


Bookmarks

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •