DubFriend / jquery.repeater

Create a repeatable group of input elements
MIT License
390 stars 192 forks source link

How can I use two repeater in one single form? #90

Open sadhan4github opened 6 years ago

sadhan4github commented 6 years ago

Hello, I am using your form repeater plugin in my project and I want to use two section for repeater in one form but I can't implement it. Can you please tell me how can I implement two repeater section in one form ? Please check the image

download

rakelcoelho commented 6 years ago

Hello, i'm with the same problem... Have you solved it yet?

abmohajeri commented 6 years ago

i have same problem

abmohajeri commented 6 years ago

any idea pls?

sadhan4github commented 6 years ago

No I didn't get any solution. I have done via custom jquery to implement dynamic row for each section.

abmohajeri commented 6 years ago

I didn't find any solution too, therefore i do some hack on this plugin ;)

digvijayad commented 6 years ago

Surround them in separate <div class='repeater'> tags .

<form class="">
  Repeater 1 
  <div class='repeater'>
     <!-- Make sure the repeater list value is unique  -->
      <div data-repeater-list="group-a">
          <div data-repeater-item>
               <input type="text" name="text-input" value="A"/>
               <input data-repeater-delete type="button" value="Delete"/>
         </div>
        <div data-repeater-item>
              <input type="text" name="text-input" value="B"/>
              <input data-repeater-delete type="button" value="Delete"/>
        </div>
       </div>
    <input data-repeater-create type="button" value="Add"/>
 </div>

  Repeater 2
    <div class='repeater'>
       <!-- Make sure the repeater list value is different from the first repeater  -->
       <div data-repeater-list="group-b">
           <div data-repeater-item>
            <input type="text" name="text-input" value="G"/>
            <input data-repeater-delete type="button" value="Delete"/>
          </div>

        </div>
        <input data-repeater-create type="button" value="Add"/>
     </div>
</form>

Click here to view a working example.

OldKing-lion commented 5 years ago

Surround them in separate <div class='repeater'> tags .

<form class="">
  Repeater 1 
  <div class='repeater'>
     <!-- Make sure the repeater list value is unique  -->
      <div data-repeater-list="group-a">
          <div data-repeater-item>
               <input type="text" name="text-input" value="A"/>
               <input data-repeater-delete type="button" value="Delete"/>
         </div>
        <div data-repeater-item>
              <input type="text" name="text-input" value="B"/>
              <input data-repeater-delete type="button" value="Delete"/>
        </div>
       </div>
    <input data-repeater-create type="button" value="Add"/>
 </div>

  Repeater 2
    <div class='repeater'>
       <!-- Make sure the repeater list value is different from the first repeater  -->
       <div data-repeater-list="group-b">
           <div data-repeater-item>
            <input type="text" name="text-input" value="G"/>
            <input data-repeater-delete type="button" value="Delete"/>
          </div>

        </div>
        <input data-repeater-create type="button" value="Add"/>
     </div>
</form>

Click here to view a working example.

try it

hackernewbie commented 2 years ago

Fantastic!

This works perfectly!