2017-03-07 6 views
-2

Hallo, ich teile meinen Code unten. Kann jemand mir für kleine änderungen helfen. Während der Schaffung des neuen Kastens ist der add-Knopf an der festen Position. Ich muss es dynamisch machen.Hinzufügen und Entfernen mehrerer Formularfelder

$(document).ready(
    function() { 
     var max_fields = 6; 
     var wrapper = $(".items"); 
     var add_button = $(".add-more"); 

     var x = 1; 
     $(add_button) 
      .click(
       function (e) { 
        e.preventDefault(); 
        if (x < max_fields) { 
         x++; 
         $(wrapper) 
          .append(
           '<div class="row add-more1"><div class="col-sm-11"><div class="col-sm-4"><form role="form"><div class="form-group">' 
           + '<select class="full-width form-control"><option value="AK">- Select -</option><option value="AK">Name</option>' 
           + '<option value="HI">Email</option><option value="AK">Contact No.</option><option value="HI">Assigned To</option>' 
           + '<option value="AK">Next Action From</option><option value="HI">Next Action To</option><option value="AK">Status</option></select>' 
           + '</div></form></div>' 
           + '<div class="col-sm-4"><form role="form"><div class="form-group">' 
           + '<select class="full-width form-control"><option value="AK">- Select -</option><option value="AK">=</option>' 
           + '<option value="HI">></option><option value="AK">>=</option><option value="HI"><</option><option value="AK"><=</option>' 
           + '<option value="HI">like</option></select>' 
           + '</div></form></div>' 
           + '<div class="col-sm-4"><form role="form"><div class="form-group">' 
           + '<input type="text" class="form-control input-sm" name="name" placeholder="Enter value"/>' 
           + '</div></form></div></div>' 
           + '<span class="remove_field"><i class="fa fa-times"></i></span></div>'); 
        } 
       }); 

     $(wrapper).on("click", ".remove_field", 
      function (e) { 
       e.preventDefault(); 
       $(this).parent('div').remove(); 
       x--; 
      }) 
    }); 

Antwort

0

fügen Sie CSS vielleicht seine Arbeit:

.remove_field{ 
    position: absolute; 
    right: 0; 
} 
Verwandte Themen