JSFiddle - React, Tailwind, and code Playground

by curtisweeks

HTML

<script src="https://code.jquery.com/jquery-2.2.3.min.js"></script>
<form name="frmfeed" id="frmfeed" enctype="multipart/form-data" method="post" onSubmit="return validateFeedbackForm();">
    <input type="hidden" id="counter" value="1">
    <input type="text" name="country" id="con1" class="form-control oditek-form" placeholder="Add Country"><br>
    <input type="text" name="country" id="con2" class="form-control oditek-form" placeholder="Add Country"><br>
    <input type="text" name="country" id="con3" class="form-control oditek-form" placeholder="Add Country"><br>
    <input type="button" class="btn btn-success" name="plus" id="plus" value="+">
    <input type="button" class="btn btn-danger" name="minus" id="minus" value="-">
    <button type="submit" class="btnsub" name="userbtnsubmit" id="btnsubmit">Add</button>
</form>

JavaScript

addRemoveAnother('#plus', '#minus', '#con', '#counter', 3);

function addRemoveAnother(plusBtn, minusBtn, target, counter, limit) {
	var i, ii = $(counter).val();
	for(i = 0; i <= limit; i++) {
		if (i != ii) {
			$(target+i).hide();
		}
	}
	$(plusBtn).click(function() {
		ii = $(counter).val();
    if ($(target+ii).val() != '') {
      ii++;
      if (ii <= limit) {
        $(target+ii).show();
        $(counter).val(ii);
      }    
    }
	});
	$(minusBtn).click(function() {
		ii = $(counter).val();
		if (ii > 1) {
			$(target+ii).val('');
			$(target+ii).hide();
			ii--;
			$(counter).val(ii);
		}
	});
}