Doğrulama ile satır ekleme/çıkarma

Question

Doğrulama ile bir satırı nasıl ekleyebilirim/kaldırabilirim? İşte benim çalışma örneğim. Ben sadece doğrulamayı ayarlamak istiyorum.

http://jsfiddle.net/Bhuro/o6g60b57/1/

<div id="mainDiv"> 
    <div class="one"> 
     <div class="row"> 
      <div class="input-field col s1"> 
       <input type="text" class="sno" name="sno[]" value="1" readonly> 
       <label for="Sr" >Sr</label> 
      </div> 
      <div class="input-field col s2"> 
       <input id="item_code" type="text" name="item_code[]" onKeyUp="showHint(this.value)"> 
       <label for="item_code" >Item Code</label> 
      </div> 
      <div class="input-field col s2"> 
       <input id="item_name" type="text" name="item_name[]" value=" "> 
       <label for="item_name" >Item Name</label> 
      </div> 
      <div class="input-field col s1 add"> 
       <a href="#">Add</a> 
      </div> 
      <div class="input-field col s1 delete"> 
       <a href="#"> Remove</a> 
      </div> 
     </div> 
    </div> 
</div> 

<div class="row"> 
    <div class="input-field col s2"> 
     <button class="btn cyan waves-effect waves-light right" type="submit" name="submit" onClick="return purchasebill_validation_print();"/> 
      Save 
      <i class="mdi-content-send right"></i> 
     </button> 
    </div> 
</div> 

$(document).ready(function() { 
    $(".add").click(function() { 
     var length = $('.one').length; 
     var cloned = $(this).closest('.one').clone(true);   
     cloned.appendTo("#mainDiv").find('.sno').val(length + 1); 
     cloned.find(':input:not(".sno")').val(" "); 

     cloned.find("input[onKeyUp*='showHint']").attr('onKeyUp', 'showHint' + (length + 1) + '(this.value)'); 
     cloned.find("input[onkeydown*='showHintqty']").attr('onkeydown', 'showHintqty' + (length + 1) + '(this.value)'); 
     cloned.find("input[id*='item_name']").attr('id', 'item_name' + (length + 1)); 
     cloned.find("input[id*='quantity']").attr('id', 'quantity' + (length + 1)); 
     cloned.find("input[id*='item_code']").attr('id', 'item_code' + (length + 1)); 

     var parent = $(this).closest('.one'); 
     calculate(parent); 
    }); 

    $('.delete').click(function() { 
     if ($('.one').length == 1) { 
      alert("This is default row and can't deleted"); 
      return false; 
     } 
     var parent = $(this).closest('.one'); 
     $(this).parents(".one").remove(); 
     calculate(parent); 
     // reset serial numbers again 
     $('.one').each(function(index, item) { 
      $(this).find('.sno').val(index + 1); 
      $(this).find("input[onKeyUp*='showHint']").attr('onKeyUp', 'showHint' + (index + 1) + '(this.value)'); 
      $(this).find("input[onkeydown*='showHintqty']").attr('onkeydown', 'showHintqty' + (index + 1) + '(this.value)'); 
      $(this).find("input[id*='item_name']").attr('id', 'item_name' + (index + 1)); 
      $(this).find("input[id*='quantity']").attr('id', 'quantity' + (index + 1)); 
      $(this).find("input[id*='item_code']").attr('id', 'item_code' + (index + 1)); 
     }) 
    }); 
}); 

$(document).on('keyup', '.quantity, .net_rate, .Tax_Amount, .Discount_rate, .Discount_tax, .Gross_Amount', function() { 
    var parent = $(this).closest('.one'); 
    calculate(parent); 
}) 

function calculate(e){ 
    var q = +$(e).find('.quantity').val(); 
    var n = +$(e).find('.net_rate').val(); 
    var t = +$(e).find('.tax').val(); 
    var dr = +$(e).find('.Discount_rate').val(); 
    var dt = +$(e).find('.Discount_tax').val(); 
    var sum = 0; 

    $(e).find('.Gross_Amount').val(q * n); 
    $(e).find('.Tax_Amount').val((g = q * n * t/100).toFixed(2)); 
    $(e).find('.total').val(((q * n) + g).toFixed(2)); 

    $('.total').each(function(i, e){ 
     sum += +$(e).val();  
    }); 

    var disc = $('.Discount_rate').val(); 
    if (parseInt(disc) >= 0) { 
     $('.Discount_tax').val(''); 
     $('#Grand').val((sum - $('.Discount_rate').val()).toFixed(2)); 
    } else { 
     $('.Discount_rate').val(''); 
     disc = $('.Discount_tax').val(); 
     if ((disc) > 0) 
      $('#Grand').val((sum - ((disc) * sum/100)).toFixed(2)); 
     else 
      $('#Grand').val((sum).toFixed(2)); 
    } 
}; 

Answer 1

istediğiniz kod bir doğrulama kodu

/*Intercepts the form submision*/ 
$('#myform').submit(function(e) { 
    /*sets send to true*/ 
    var send = true; 
    /*foreach required element*/ 
    $('.required').each(function() { 
    /*check if input is valid*/ 
    if (!$(this).val()) { 
     /*if not valid, don't send and mark red*/ 
     send = false; 
     $(this).css('background-color', 'red'); 
    } else { 
     /*if valid, take away mark*/ 
     $(this).css('background-color', 'none'); 
    } 
    }); 
    /*if don't send, prevent sending*/ 
    if (!send) { 
    e.preventDefault(); 
    return false; 
    } else { 
     alert('sent'); 
    } 
}); 

$(document).ready(function() { 
 
    $(".add").click(function() { 
 
    var length = $('.one').length; 
 
    var cloned = $(this).closest('.one').clone(true); 
 
    cloned.appendTo("#mainDiv").find('.sno').val(length + 1); 
 
    cloned.find(':input:not(".sno")').val(""); 
 

 
    cloned.find("input[onKeyUp*='showHint']").attr('onKeyUp', 'showHint' + (length + 1) + '(this.value)'); 
 
    cloned.find("input[onkeydown*='showHintqty']").attr('onkeydown', 'showHintqty' + (length + 1) + '(this.value)'); 
 
    cloned.find("input[id*='item_name']").attr('id', 'item_name' + (length + 1)); 
 
    cloned.find("input[id*='quantity']").attr('id', 'quantity' + (length + 1)); 
 
    cloned.find("input[id*='item_code']").attr('id', 'item_code' + (length + 1)); 
 

 

 
    var parent = $(this).closest('.one'); 
 
    calculate(parent); 
 
    }); 
 
    $('.delete').click(function() { 
 
    if ($('.one').length == 1) { 
 
     alert("This is default row and can't deleted"); 
 
     return false; 
 
    } 
 
    var parent = $(this).closest('.one'); 
 
    $(this).parents(".one").remove(); 
 
    calculate(parent); 
 
    // reset serial numbers again 
 
    $('.one').each(function(index, item) { 
 
     $(this).find('.sno').val(index + 1); 
 

 
     $(this).find("input[onKeyUp*='showHint']").attr('onKeyUp', 'showHint' + (index + 1) + '(this.value)'); 
 
     $(this).find("input[onkeydown*='showHintqty']").attr('onkeydown', 'showHintqty' + (index + 1) + '(this.value)'); 
 
     $(this).find("input[id*='item_name']").attr('id', 'item_name' + (index + 1)); 
 
     $(this).find("input[id*='quantity']").attr('id', 'quantity' + (index + 1)); 
 
     $(this).find("input[id*='item_code']").attr('id', 'item_code' + (index + 1)); 
 

 
    }) 
 
    }); 
 
}); 
 

 
$(document).on('keyup', '.quantity, .net_rate, .Tax_Amount, .Discount_rate, .Discount_tax, .Gross_Amount', function() { 
 
    var parent = $(this).closest('.one'); 
 
    calculate(parent); 
 
}) 
 

 

 
function calculate(e) { 
 
    var q = +$(e).find('.quantity').val(); 
 
    var n = +$(e).find('.net_rate').val(); 
 
    var t = +$(e).find('.tax').val(); 
 
    var dr = +$(e).find('.Discount_rate').val(); 
 
    var dt = +$(e).find('.Discount_tax').val(); 
 
    var sum = 0; 
 

 

 
    $(e).find('.Gross_Amount').val(q * n); 
 
    $(e).find('.Tax_Amount').val((g = q * n * t/100).toFixed(2)); 
 
    $(e).find('.total').val(((q * n) + g).toFixed(2)); 
 

 

 

 
    $('.total').each(function(i, e) { 
 
    sum += +$(e).val(); 
 
    }); 
 

 

 

 
    var disc = $('.Discount_rate').val(); 
 
    if (parseInt(disc) >= 0) { 
 
    $('.Discount_tax').val(''); 
 
    $('#Grand').val((sum - $('.Discount_rate').val()).toFixed(2)); 
 
    } else { 
 
    $('.Discount_rate').val(''); 
 
    disc = $('.Discount_tax').val(); 
 
    if ((disc) > 0) $('#Grand').val((sum - ((disc) * sum/100)).toFixed(2)); 
 
    else $('#Grand').val((sum).toFixed(2)); 
 

 
    } 
 

 
}; 
 

 

 
/*Intercepts the form submision*/ 
 
$('#myform').submit(function(e) { 
 
    /*sets send to true*/ 
 
    var send = true; 
 
    /*foreach required element*/ 
 
    $('.required').each(function() { 
 
    /*check if input is valid*/ 
 
    if (!$(this).val()) { 
 
     /*if not valid, don't send and mark red*/ 
 
     send = false; 
 
     $(this).css('background-color', 'red'); 
 
    } else { 
 
     /*if valid, take away mark*/ 
 
     $(this).css('background-color', 'none'); 
 
    } 
 
    }); 
 
    /*if don't send, prevent sending*/ 
 
    if (!send) { 
 
    e.preventDefault(); 
 
    return false; 
 
    } else { 
 
    alert('sent'); 
 
    } 
 
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.0/jquery.min.js"></script> 
 
<form id='myform' method='post'> 
 
    <div id="mainDiv"> 
 
    <div class="one"> 
 
     <div class="row"> 
 
     <div class="input-field col s1"> 
 
      <input type="text" class="sno" name="sno[]" value="1" readonly> 
 
      <label for="Sr">Sr</label> 
 
     </div> 
 
     <div class="input-field col s2"> 
 
      <input id="item_code" type="text" name="item_code[]" onKeyUp="showHint(this.value)" class='required'> 
 
      <label for="item_code">Item Code</label> 
 
     </div> 
 
     <div class="input-field col s2"> 
 
      <input id="item_name" type="text" name="item_name[]" class='required'> 
 
      <label for="item_name">Item Name</label> 
 
     </div> 
 
     <div class="input-field col s1 add"> 
 
      <a href="#">Add</a> 
 

 
     </div> 
 
     <div class="input-field col s1 delete"> 
 
      <a href="#"> Remove</a> 
 

 
     </div> 
 
     </div> 
 
    </div> 
 
    </div> 
 
    <div class="row"> 
 
    <div class="input-field col s2"> 
 
     <button class="btn cyan waves-effect waves-light right" type="submit" name="submit" onClick="return purchasebill_validation_print();" />Save<i class="mdi-content-send right"></i> 
 
     </button> 
 
    </div> 
 
    </div> 
 
</form>