Coping and changing the block



  •  function addNewGroup(button) {
       var html = $(button).parent().clone();
       console.log(html);
       $(button).parent().after(html);
       $(button).remove();
     }
    <div>
      <label>TEST GROUP</label>
      <div class="test_field">
        <label for="i-620">TEST field</label>
        <input id="i-620" type="text" placeholder="" name="test_field">
      </div>
      <div class="test_checkbox">
        <label for="i-621">dsadasdas</label>
        <input id="i-621" type="checkbox" name="adsasdsa" value="1">
      </div>
      <button type="button" onclick="addNewGroup($(this))">Вставить группу</button>
    </div>

    There's the next code, it's just, there's a divine, there's elements in it, and the button's got to copy the diva and put it in the trail. It's simple, but there's still a need to change the name parameters at the Input, I mean, if it was first. name="test_field" next dime. name="test_field1" and so on, and so on, all the inputs. How do you do that?



  • div = document.querySelector('.field');
    var count = 0;
    

    document.querySelector('button').onclick = function() {
    count++;
    div.innerHTML += div.firstElementChild.outerHTML;
    div.lastElementChild.placeholder = 'field' + count;
    }

    <div class="field">
    <input type="text" placeholder="field" name="field">
    </div>

    <button>add field</button>




Suggested Topics

  • 2
  • 2
  • 2
  • 2
  • 2
  • 2
  • 2
  • 2
  • 2
  • 2
  • 2
  • 2
  • 2
  • 2
  • 2