遍历每一行的HTML表

时间:2019-03-25 05:43:31

标签: javascript jquery html

我有一个HTML表,默认情况下它的输入字段是0,我正在做的是保存所有值大于0的Items,所以它是工作正常,但在UI端,我要做的是,当用户最初加载页面时,它显示HTML表,其中一列的输入字段和值为0,因此,如果用户单击保存而没有在输入字段中输入任何值,然后尝试提示警报quantity field value should be greater then 0,但是在执行此操作时,它仅检查第一行

代码

var tableDataDraft = [


  {
    "Code": "1248",
    "Item Name": "Tandoori Roti",
    "Selling Price": "45.0000",
    "Qty": "0"
  },
  {
    "Code": "1249",
    "Item Name": "Naan-Plain",
    "Selling Price": "50.0000",
    "Qty": "0"
  },
  {
    "Code": "1250",
    "Item Name": "Naan-Butter",
    "Selling Price": "60.0000",
    "Qty": "0"
  },
  {
    "Code": "1251",
    "Item Name": "Naan-Garlic",
    "Selling Price": "55.0000",
    "Qty": "0"
  },
  {
    "Code": "1252",
    "Item Name": "Kulcha-Plain",
    "Selling Price": "50.0000",
    "Qty": "0"
  },
  {
    "Code": "1253",
    "Item Name": "Kulcha-Butter",
    "Selling Price": "60.0000",
    "Qty": "0"
  },
  {
    "Code": "1254",
    "Item Name": "Kulcha-Amritsari",
    "Selling Price": "65.0000",
    "Qty": "0"
  },
  {
    "Code": "1255",
    "Item Name": "Kulcha-Punjabi",
    "Selling Price": "60.0000",
    "Qty": "0"
  },
  {
    "Code": "1256",
    "Item Name": "Kulcha-Jaipuar",
    "Selling Price": "60.0000",
    "Qty": "0"
  },
  {
    "Code": "1257",
    "Item Name": "Paratha-Aloo",
    "Selling Price": "60.0000",
    "Qty": "0"
  },
  {
    "Code": "1258",
    "Item Name": "Paratha-Methi",
    "Selling Price": "55.0000",
    "Qty": "0"
  },
  {
    "Code": "1259",
    "Item Name": "Paratha-Pudina",
    "Selling Price": "60.0000",
    "Qty": "0"
  },
  {
    "Code": "1260",
    "Item Name": "Paratha-Lacha",
    "Selling Price": "55.0000",
    "Qty": "0"
  },

  {
    "Code": "603",
    "Item Name": "AMUL FRESH CREAM",
    "Selling Price": "134.8700",
    "Qty": "0"
  }
]

var itemsQuantiry1 = [];

function addTableDraft(tableDataDraft) {
  var col = Object.keys(tableDataDraft[0]);
  var countNum = col.filter(i => !isNaN(i)).length;
  var num = col.splice(0, countNum);
  col = col.concat(num);
  var table = document.createElement("table");
  var tr = table.insertRow(-1);
  for (var i = 0; i < col.length; i++) {
    var th = document.createElement("th");
    th.innerHTML = col[i];
    tr.appendChild(th);
    tr.classList.add("text-center");
    tr.classList.add("head")
  }
  for (var i = 0; i < tableDataDraft.length; i++) {
    tr = table.insertRow(-1);
    tr.classList.add("item-row");
    for (var j = 0; j < col.length; j++) {
      var categoryName = tableDataDraft[i]["Category Name"];
      tr.dataset.category = categoryName;
      let tabCell = tr.insertCell(-1);
      var hiddenField = document.createElement("input");
      hiddenField.style.display = "none";
      var tabledata = tableDataDraft[i][col[j]];
      if (tableDataDraft[i]['Code'] === tableDataDraft[i][col[j]]) {
        tabCell.innerHTML = tabledata;
        hiddenField.setAttribute('name', 'Item_Code');
        hiddenField.setAttribute('value', tabledata);
        tabCell.appendChild(hiddenField);
      }
      if (tableDataDraft[i]['Item Name'] === tableDataDraft[i][col[j]]) {
        tabCell.innerHTML = tabledata;
        hiddenField.setAttribute('name', 'Item_Name');
        hiddenField.setAttribute('value', tabledata);
        tabCell.appendChild(hiddenField);
      }
      if (tableDataDraft[i]['Selling Price'] === tableDataDraft[i][col[j]]) {
        tabCell.innerHTML = tabledata;
        hiddenField.setAttribute('name', 'Selling_Price');
        hiddenField.setAttribute('value', tabledata);
        tabCell.appendChild(hiddenField);
      }
      if (tableDataDraft[i]['Outlet Id'] === tableDataDraft[i][col[j]]) {
        tabCell.innerHTML = tabledata;
        hiddenField.setAttribute('name', 'Outlet_Id');
        hiddenField.setAttribute('value', tabledata);
        tabCell.appendChild(hiddenField);
      }
      if (tableDataDraft[i]['Qty'] === tableDataDraft[i][col[j]]) {
        tabCell.classList.add("dheeraj")
        var quantityField = document.createElement("input");
        quantityField.style.border = "none";
        quantityField.style["text-align"] = "right";
        quantityField.setAttribute("name", "Quantity_field");
        quantityField.setAttribute("autocomplete", "on");

        if (itemsQuantiry1[i]) {
          quantityField.setAttribute("value", itemsQuantiry1[i]);
        } else {
          quantityField.setAttribute("value", tabledata);
        }
        quantityField.setAttribute("index", i);
        quantityField.setAttribute("type", "number");
        quantityField.setAttribute("min", "0");
        quantityField.setAttribute("max", "999");
        //	quantityField.setAttribute("onfocus", "this.value=''");
        quantityField.setAttribute("required", "required");
        quantityField.classList.add("dataReset");
        quantityField.toLocaleString('en-IN');
        tabCell.appendChild(quantityField);
      }

      if (j > 1)
        tabCell.classList.add("text-right");
    }
  }
  var divContainer = document.getElementById("indentTable");
  divContainer.innerHTML = "";
  divContainer.appendChild(table);
  table.classList.add("table");
  table.classList.add("table-striped");
  table.classList.add("table-bordered");
  table.classList.add("table-hover");
}
addTableDraft(tableDataDraft)

$("#save").click(function() {
  var emptyQuantity = $(".dataReset").val(); //on click of save want to check quantity field should be greater then zero	
  if (emptyQuantity === '0') {
    alert("Quantity field Value  Should be greater then 0");
  }

});
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/4.1.2/css/bootstrap.min.css">
<button type="button" id="save" class="commonButton">
				<i class="fas fa-save"></i>&nbsp;Save
			</button>
<div class="table-responsive">
  <table id="indentTable" class="table table-bordered table-hover ">

  </table>
</div>

所以我想要实现的是

  • 如果任何“数量”字段的值都大于0,那么我可以允许用户保存数据,但是如果所有输入字段的每一行的值都为0,则尝试提示消息
  • 当前正在执行的操作仅检查第一行的值是否大于零,然后保存数据,否则提示消息
  • 因此,如果用户让第一行数据为零,而他/她输入了其他数据,则仅检查第一行

我已在代码段中注释了“保存”按钮代码

感谢您的任何帮助或方法

6 个答案:

答案 0 :(得分:1)

您可以尝试将其保持在循环中,以便它会检查每个具有值1的此类行,一旦发现我们需要在您的{{1}之后打断each循环}。

alert
var tableDataDraft = [


  {
    "Code": "1248",
    "Item Name": "Tandoori Roti",
    "Selling Price": "45.0000",
    "Qty": "0"
  },
  {
    "Code": "1249",
    "Item Name": "Naan-Plain",
    "Selling Price": "50.0000",
    "Qty": "0"
  },
  {
    "Code": "1250",
    "Item Name": "Naan-Butter",
    "Selling Price": "60.0000",
    "Qty": "0"
  },
  {
    "Code": "1251",
    "Item Name": "Naan-Garlic",
    "Selling Price": "55.0000",
    "Qty": "0"
  },
  {
    "Code": "1252",
    "Item Name": "Kulcha-Plain",
    "Selling Price": "50.0000",
    "Qty": "0"
  },
  {
    "Code": "1253",
    "Item Name": "Kulcha-Butter",
    "Selling Price": "60.0000",
    "Qty": "0"
  },
  {
    "Code": "1254",
    "Item Name": "Kulcha-Amritsari",
    "Selling Price": "65.0000",
    "Qty": "0"
  },
  {
    "Code": "1255",
    "Item Name": "Kulcha-Punjabi",
    "Selling Price": "60.0000",
    "Qty": "0"
  },
  {
    "Code": "1256",
    "Item Name": "Kulcha-Jaipuar",
    "Selling Price": "60.0000",
    "Qty": "0"
  },
  {
    "Code": "1257",
    "Item Name": "Paratha-Aloo",
    "Selling Price": "60.0000",
    "Qty": "0"
  },
  {
    "Code": "1258",
    "Item Name": "Paratha-Methi",
    "Selling Price": "55.0000",
    "Qty": "0"
  },
  {
    "Code": "1259",
    "Item Name": "Paratha-Pudina",
    "Selling Price": "60.0000",
    "Qty": "0"
  },
  {
    "Code": "1260",
    "Item Name": "Paratha-Lacha",
    "Selling Price": "55.0000",
    "Qty": "0"
  },

  {
    "Code": "603",
    "Item Name": "AMUL FRESH CREAM",
    "Selling Price": "134.8700",
    "Qty": "0"
  }
]

var itemsQuantiry1 = [];

function addTableDraft(tableDataDraft) {
  var col = Object.keys(tableDataDraft[0]);
  var countNum = col.filter(i => !isNaN(i)).length;
  var num = col.splice(0, countNum);
  col = col.concat(num);
  var table = document.createElement("table");
  var tr = table.insertRow(-1);
  for (var i = 0; i < col.length; i++) {
    var th = document.createElement("th");
    th.innerHTML = col[i];
    tr.appendChild(th);
    tr.classList.add("text-center");
    tr.classList.add("head")
  }
  for (var i = 0; i < tableDataDraft.length; i++) {
    tr = table.insertRow(-1);
    tr.classList.add("item-row");
    for (var j = 0; j < col.length; j++) {
      var categoryName = tableDataDraft[i]["Category Name"];
      tr.dataset.category = categoryName;
      let tabCell = tr.insertCell(-1);
      var hiddenField = document.createElement("input");
      hiddenField.style.display = "none";
      var tabledata = tableDataDraft[i][col[j]];
      if (tableDataDraft[i]['Code'] === tableDataDraft[i][col[j]]) {
        tabCell.innerHTML = tabledata;
        hiddenField.setAttribute('name', 'Item_Code');
        hiddenField.setAttribute('value', tabledata);
        tabCell.appendChild(hiddenField);
      }
      if (tableDataDraft[i]['Item Name'] === tableDataDraft[i][col[j]]) {
        tabCell.innerHTML = tabledata;
        hiddenField.setAttribute('name', 'Item_Name');
        hiddenField.setAttribute('value', tabledata);
        tabCell.appendChild(hiddenField);
      }
      if (tableDataDraft[i]['Selling Price'] === tableDataDraft[i][col[j]]) {
        tabCell.innerHTML = tabledata;
        hiddenField.setAttribute('name', 'Selling_Price');
        hiddenField.setAttribute('value', tabledata);
        tabCell.appendChild(hiddenField);
      }
      if (tableDataDraft[i]['Outlet Id'] === tableDataDraft[i][col[j]]) {
        tabCell.innerHTML = tabledata;
        hiddenField.setAttribute('name', 'Outlet_Id');
        hiddenField.setAttribute('value', tabledata);
        tabCell.appendChild(hiddenField);
      }
      if (tableDataDraft[i]['Qty'] === tableDataDraft[i][col[j]]) {
        tabCell.classList.add("dheeraj")
        var quantityField = document.createElement("input");
        quantityField.style.border = "none";
        quantityField.style["text-align"] = "right";
        quantityField.setAttribute("name", "Quantity_field");
        quantityField.setAttribute("autocomplete", "on");

        if (itemsQuantiry1[i]) {
          quantityField.setAttribute("value", itemsQuantiry1[i]);
        } else {
          quantityField.setAttribute("value", tabledata);
        }
        quantityField.setAttribute("index", i);
        quantityField.setAttribute("type", "number");
        quantityField.setAttribute("min", "0");
        quantityField.setAttribute("max", "999");
        //	quantityField.setAttribute("onfocus", "this.value=''");
        quantityField.setAttribute("required", "required");
        quantityField.classList.add("dataReset");
        quantityField.toLocaleString('en-IN');
        tabCell.appendChild(quantityField);
      }

      if (j > 1)
        tabCell.classList.add("text-right");
    }
  }
  var divContainer = document.getElementById("indentTable");
  divContainer.innerHTML = "";
  divContainer.appendChild(table);
  table.classList.add("table");
  table.classList.add("table-striped");
  table.classList.add("table-bordered");
  table.classList.add("table-hover");
}
addTableDraft(tableDataDraft)

$("#save").click(function() {
  $(".dataReset").each(function(){
  var emptyQuantity = $(this).val(); //on click of save want to check quantity field should be greater then zero	
  if (emptyQuantity === '0') {
    alert("Quantity field Value  Should be greater then 0");
    return false;
  }
});

});

希望这对您有所帮助。

答案 1 :(得分:0)

您有多个单元格,并且不清楚单个val()的含义-考虑一下您将与0比较一次且没有循环的事实。稍微修改一下click函数将解决此问题-循环所有单元格,并检查each的值。这是最直接的解决方案。下面,我添加了一个使用is的解决方案,该解决方案似乎很适合这里。

var tableDataDraft = [
  {
    "Code": "1248",
    "Item Name": "Tandoori Roti",
    "Selling Price": "45.0000",
    "Qty": "0"
  },
    {
    "Code": "1248",
    "Item Name": "Tandoori Roti",
    "Selling Price": "45.0000",
    "Qty": "0"
  }
]

var itemsQuantiry1 = [];

function addTableDraft(tableDataDraft) {
  var col = Object.keys(tableDataDraft[0]);
  var countNum = col.filter(i => !isNaN(i)).length;
  var num = col.splice(0, countNum);
  col = col.concat(num);
  var table = document.createElement("table");
  var tr = table.insertRow(-1);
  for (var i = 0; i < col.length; i++) {
    var th = document.createElement("th");
    th.innerHTML = col[i];
    tr.appendChild(th);
    tr.classList.add("text-center");
    tr.classList.add("head")
  }
  for (var i = 0; i < tableDataDraft.length; i++) {
    tr = table.insertRow(-1);
    tr.classList.add("item-row");
    for (var j = 0; j < col.length; j++) {
      var categoryName = tableDataDraft[i]["Category Name"];
      tr.dataset.category = categoryName;
      let tabCell = tr.insertCell(-1);
      var hiddenField = document.createElement("input");
      hiddenField.style.display = "none";
      var tabledata = tableDataDraft[i][col[j]];
      if (tableDataDraft[i]['Code'] === tableDataDraft[i][col[j]]) {
        tabCell.innerHTML = tabledata;
        hiddenField.setAttribute('name', 'Item_Code');
        hiddenField.setAttribute('value', tabledata);
        tabCell.appendChild(hiddenField);
      }
      if (tableDataDraft[i]['Item Name'] === tableDataDraft[i][col[j]]) {
        tabCell.innerHTML = tabledata;
        hiddenField.setAttribute('name', 'Item_Name');
        hiddenField.setAttribute('value', tabledata);
        tabCell.appendChild(hiddenField);
      }
      if (tableDataDraft[i]['Selling Price'] === tableDataDraft[i][col[j]]) {
        tabCell.innerHTML = tabledata;
        hiddenField.setAttribute('name', 'Selling_Price');
        hiddenField.setAttribute('value', tabledata);
        tabCell.appendChild(hiddenField);
      }
      if (tableDataDraft[i]['Outlet Id'] === tableDataDraft[i][col[j]]) {
        tabCell.innerHTML = tabledata;
        hiddenField.setAttribute('name', 'Outlet_Id');
        hiddenField.setAttribute('value', tabledata);
        tabCell.appendChild(hiddenField);
      }
      if (tableDataDraft[i]['Qty'] === tableDataDraft[i][col[j]]) {
        tabCell.classList.add("dheeraj")
        var quantityField = document.createElement("input");
        quantityField.style.border = "none";
        quantityField.style["text-align"] = "right";
        quantityField.setAttribute("name", "Quantity_field");
        quantityField.setAttribute("autocomplete", "on");

        if (itemsQuantiry1[i]) {
          quantityField.setAttribute("value", itemsQuantiry1[i]);
        } else {
          quantityField.setAttribute("value", tabledata);
        }
        quantityField.setAttribute("index", i);
        quantityField.setAttribute("type", "number");
        quantityField.setAttribute("min", "0");
        quantityField.setAttribute("max", "999");
        //	quantityField.setAttribute("onfocus", "this.value=''");
        quantityField.setAttribute("required", "required");
        quantityField.classList.add("dataReset");
        quantityField.toLocaleString('en-IN');
        tabCell.appendChild(quantityField);
      }

      if (j > 1)
        tabCell.classList.add("text-right");
    }
  }
  var divContainer = document.getElementById("indentTable");
  divContainer.innerHTML = "";
  divContainer.appendChild(table);
  table.classList.add("table");
  table.classList.add("table-striped");
  table.classList.add("table-bordered");
  table.classList.add("table-hover");
}
addTableDraft(tableDataDraft)

$("#save").click(function() {
  var success = false;
  $('.dataReset').each(function(i, obj) {
    if (obj.value > 0) {
      success = true;
      return false //Once is enough
    }
  });
  if(!success) alert("Quantity field Value  Should be greater then 0");
});
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/4.1.2/css/bootstrap.min.css">
<button type="button" id="save" class="commonButton">
				<i class="fas fa-save"></i>&nbsp;Save
			</button>
<div class="table-responsive">
  <table id="indentTable" class="table table-bordered table-hover ">

  </table>
</div>

使用is的更好版本:

$("#save").click(function() {
  if( $('.dataReset').is(function(i, obj) {return (obj.value > 0)}) ) {
     //success
  } else {
    alert("Quantity field Value  Should be greater then 0");
  }
});

并通过ES6可以使if看起来更漂亮:

if( $('.dataReset').is((i, obj)=>(obj.value > 0)) ) {

答案 2 :(得分:0)

<!DOCTYPE html>
<html>
<head>
    <title></title>
</head>
<body>
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/4.1.2/css/bootstrap.min.css">
<button type="button" id="save" class="commonButton">
                <i class="fas fa-save"></i>&nbsp;Save
            </button>
<div class="table-responsive">
  <table id="indentTable" class="table table-bordered table-hover ">

  </table>
</div>
<script type="text/javascript">
    var tableDataDraft = [


  {
    "Code": "1248",
    "Item Name": "Tandoori Roti",
    "Selling Price": "45.0000",
    "Qty": "0"
  },
  {
    "Code": "1249",
    "Item Name": "Naan-Plain",
    "Selling Price": "50.0000",
    "Qty": "0"
  },
  {
    "Code": "1250",
    "Item Name": "Naan-Butter",
    "Selling Price": "60.0000",
    "Qty": "0"
  },
  {
    "Code": "1251",
    "Item Name": "Naan-Garlic",
    "Selling Price": "55.0000",
    "Qty": "0"
  },
  {
    "Code": "1252",
    "Item Name": "Kulcha-Plain",
    "Selling Price": "50.0000",
    "Qty": "0"
  },
  {
    "Code": "1253",
    "Item Name": "Kulcha-Butter",
    "Selling Price": "60.0000",
    "Qty": "0"
  },
  {
    "Code": "1254",
    "Item Name": "Kulcha-Amritsari",
    "Selling Price": "65.0000",
    "Qty": "0"
  },
  {
    "Code": "1255",
    "Item Name": "Kulcha-Punjabi",
    "Selling Price": "60.0000",
    "Qty": "0"
  },
  {
    "Code": "1256",
    "Item Name": "Kulcha-Jaipuar",
    "Selling Price": "60.0000",
    "Qty": "0"
  },
  {
    "Code": "1257",
    "Item Name": "Paratha-Aloo",
    "Selling Price": "60.0000",
    "Qty": "0"
  },
  {
    "Code": "1258",
    "Item Name": "Paratha-Methi",
    "Selling Price": "55.0000",
    "Qty": "0"
  },
  {
    "Code": "1259",
    "Item Name": "Paratha-Pudina",
    "Selling Price": "60.0000",
    "Qty": "0"
  },
  {
    "Code": "1260",
    "Item Name": "Paratha-Lacha",
    "Selling Price": "55.0000",
    "Qty": "0"
  },

  {
    "Code": "603",
    "Item Name": "AMUL FRESH CREAM",
    "Selling Price": "134.8700",
    "Qty": "0"
  }
]

var itemsQuantiry1 = [];

function addTableDraft(tableDataDraft) {
  var col = Object.keys(tableDataDraft[0]);
  var countNum = col.filter(i => !isNaN(i)).length;
  var num = col.splice(0, countNum);
  col = col.concat(num);
  var table = document.createElement("table");
  var tr = table.insertRow(-1);
  for (var i = 0; i < col.length; i++) {
    var th = document.createElement("th");
    th.innerHTML = col[i];
    tr.appendChild(th);
    tr.classList.add("text-center");
    tr.classList.add("head")
  }
  for (var i = 0; i < tableDataDraft.length; i++) {
    tr = table.insertRow(-1);
    tr.classList.add("item-row");
    for (var j = 0; j < col.length; j++) {
      var categoryName = tableDataDraft[i]["Category Name"];
      tr.dataset.category = categoryName;
      let tabCell = tr.insertCell(-1);
      var hiddenField = document.createElement("input");
      hiddenField.style.display = "none";
      var tabledata = tableDataDraft[i][col[j]];
      if (tableDataDraft[i]['Code'] === tableDataDraft[i][col[j]]) {
        tabCell.innerHTML = tabledata;
        hiddenField.setAttribute('name', 'Item_Code');
        hiddenField.setAttribute('value', tabledata);
        tabCell.appendChild(hiddenField);
      }
      if (tableDataDraft[i]['Item Name'] === tableDataDraft[i][col[j]]) {
        tabCell.innerHTML = tabledata;
        hiddenField.setAttribute('name', 'Item_Name');
        hiddenField.setAttribute('value', tabledata);
        tabCell.appendChild(hiddenField);
      }
      if (tableDataDraft[i]['Selling Price'] === tableDataDraft[i][col[j]]) {
        tabCell.innerHTML = tabledata;
        hiddenField.setAttribute('name', 'Selling_Price');
        hiddenField.setAttribute('value', tabledata);
        tabCell.appendChild(hiddenField);
      }
      if (tableDataDraft[i]['Outlet Id'] === tableDataDraft[i][col[j]]) {
        tabCell.innerHTML = tabledata;
        hiddenField.setAttribute('name', 'Outlet_Id');
        hiddenField.setAttribute('value', tabledata);
        tabCell.appendChild(hiddenField);
      }
      if (tableDataDraft[i]['Qty'] === tableDataDraft[i][col[j]]) {
        tabCell.classList.add("dheeraj")
        var quantityField = document.createElement("input");
        quantityField.style.border = "none";
        quantityField.style["text-align"] = "right";
        quantityField.setAttribute("name", "Quantity_field");
        quantityField.setAttribute("autocomplete", "on");

        if (itemsQuantiry1[i]) {
          quantityField.setAttribute("value", itemsQuantiry1[i]);
        } else {
          quantityField.setAttribute("value", tabledata);
        }
        quantityField.setAttribute("index", i);
        quantityField.setAttribute("type", "number");
        quantityField.setAttribute("min", "0");
        quantityField.setAttribute("max", "999");
        //  quantityField.setAttribute("onfocus", "this.value=''");
        quantityField.setAttribute("required", "required");
        quantityField.classList.add("dataReset");
        quantityField.toLocaleString('en-IN');
        tabCell.appendChild(quantityField);
      }

      if (j > 1)
        tabCell.classList.add("text-right");
    }
  }
  var divContainer = document.getElementById("indentTable");
  divContainer.innerHTML = "";
  divContainer.appendChild(table);
  table.classList.add("table");
  table.classList.add("table-striped");
  table.classList.add("table-bordered");
  table.classList.add("table-hover");
}
addTableDraft(tableDataDraft)
checkValidation=function(){
var valid=true;
    $(".dataReset").each(function(){
    if($(this).val().trim()!=""){
        if(parseInt($(this).val())==0){
        valid=false;
        return;
      }
    }
  });
  // console.log(valid)
  return valid;
}
$("#save").click(function() {
  // var emptyQuantity = $(".dataReset").val(); //on click of save want to check quantity field should be greater then zero 
  if (!checkValidation()) {
    alert("Quantity field Value  Should be greater then 0");
  }else{
    alert("All is set")
  }

});
</script>
</body>
</html>

答案 3 :(得分:0)

尝试使用jquery filter()

var allrows = $(".dataReset").length;

var allZeroRows = $(".dataReset").filter(function() {
    return this.value === '0'
}).length;

if(allrows === allZeroRows) alert("Quantity field Value  Should be greater then 0");

答案 4 :(得分:0)

其他答案将检查每件商品的数量是否大于0。检查用户是否已选择至少一件商品的功能应如下所示:

var tableDataDraft = [


    {
      "Code": "1248",
      "Item Name": "Tandoori Roti",
      "Selling Price": "45.0000",
      "Qty": "0"
    },
    {
      "Code": "1249",
      "Item Name": "Naan-Plain",
      "Selling Price": "50.0000",
      "Qty": "0"
    },
    {
      "Code": "1250",
      "Item Name": "Naan-Butter",
      "Selling Price": "60.0000",
      "Qty": "0"
    },
    {
      "Code": "1251",
      "Item Name": "Naan-Garlic",
      "Selling Price": "55.0000",
      "Qty": "0"
    },
    {
      "Code": "1252",
      "Item Name": "Kulcha-Plain",
      "Selling Price": "50.0000",
      "Qty": "0"
    },
    {
      "Code": "1253",
      "Item Name": "Kulcha-Butter",
      "Selling Price": "60.0000",
      "Qty": "0"
    },
    {
      "Code": "1254",
      "Item Name": "Kulcha-Amritsari",
      "Selling Price": "65.0000",
      "Qty": "0"
    },
    {
      "Code": "1255",
      "Item Name": "Kulcha-Punjabi",
      "Selling Price": "60.0000",
      "Qty": "0"
    },
    {
      "Code": "1256",
      "Item Name": "Kulcha-Jaipuar",
      "Selling Price": "60.0000",
      "Qty": "0"
    },
    {
      "Code": "1257",
      "Item Name": "Paratha-Aloo",
      "Selling Price": "60.0000",
      "Qty": "0"
    },
    {
      "Code": "1258",
      "Item Name": "Paratha-Methi",
      "Selling Price": "55.0000",
      "Qty": "0"
    },
    {
      "Code": "1259",
      "Item Name": "Paratha-Pudina",
      "Selling Price": "60.0000",
      "Qty": "0"
    },
    {
      "Code": "1260",
      "Item Name": "Paratha-Lacha",
      "Selling Price": "55.0000",
      "Qty": "0"
    },
  
    {
      "Code": "603",
      "Item Name": "AMUL FRESH CREAM",
      "Selling Price": "134.8700",
      "Qty": "0"
    }
  ]
  
  var itemsQuantiry1 = [];
  
  function addTableDraft(tableDataDraft) {
    var col = Object.keys(tableDataDraft[0]);
    var countNum = col.filter(i => !isNaN(i)).length;
    var num = col.splice(0, countNum);
    col = col.concat(num);
    var table = document.createElement("table");
    var tr = table.insertRow(-1);
    for (var i = 0; i < col.length; i++) {
      var th = document.createElement("th");
      th.innerHTML = col[i];
      tr.appendChild(th);
      tr.classList.add("text-center");
      tr.classList.add("head")
    }
    for (var i = 0; i < tableDataDraft.length; i++) {
      tr = table.insertRow(-1);
      tr.classList.add("item-row");
      for (var j = 0; j < col.length; j++) {
        var categoryName = tableDataDraft[i]["Category Name"];
        tr.dataset.category = categoryName;
        let tabCell = tr.insertCell(-1);
        var hiddenField = document.createElement("input");
        hiddenField.style.display = "none";
        var tabledata = tableDataDraft[i][col[j]];
        if (tableDataDraft[i]['Code'] === tableDataDraft[i][col[j]]) {
          tabCell.innerHTML = tabledata;
          hiddenField.setAttribute('name', 'Item_Code');
          hiddenField.setAttribute('value', tabledata);
          tabCell.appendChild(hiddenField);
        }
        if (tableDataDraft[i]['Item Name'] === tableDataDraft[i][col[j]]) {
          tabCell.innerHTML = tabledata;
          hiddenField.setAttribute('name', 'Item_Name');
          hiddenField.setAttribute('value', tabledata);
          tabCell.appendChild(hiddenField);
        }
        if (tableDataDraft[i]['Selling Price'] === tableDataDraft[i][col[j]]) {
          tabCell.innerHTML = tabledata;
          hiddenField.setAttribute('name', 'Selling_Price');
          hiddenField.setAttribute('value', tabledata);
          tabCell.appendChild(hiddenField);
        }
        if (tableDataDraft[i]['Outlet Id'] === tableDataDraft[i][col[j]]) {
          tabCell.innerHTML = tabledata;
          hiddenField.setAttribute('name', 'Outlet_Id');
          hiddenField.setAttribute('value', tabledata);
          tabCell.appendChild(hiddenField);
        }
        if (tableDataDraft[i]['Qty'] === tableDataDraft[i][col[j]]) {
          tabCell.classList.add("dheeraj")
          var quantityField = document.createElement("input");
          quantityField.style.border = "none";
          quantityField.style["text-align"] = "right";
          quantityField.setAttribute("name", "Quantity_field");
          quantityField.setAttribute("autocomplete", "on");
  
          if (itemsQuantiry1[i]) {
            quantityField.setAttribute("value", itemsQuantiry1[i]);
          } else {
            quantityField.setAttribute("value", tabledata);
          }
          quantityField.setAttribute("index", i);
          quantityField.setAttribute("type", "number");
          quantityField.setAttribute("min", "0");
          quantityField.setAttribute("max", "999");
          //	quantityField.setAttribute("onfocus", "this.value=''");
          quantityField.setAttribute("required", "required");
          quantityField.classList.add("dataReset");
          quantityField.toLocaleString('en-IN');
          tabCell.appendChild(quantityField);
        }
  
        if (j > 1)
          tabCell.classList.add("text-right");
      }
    }
    var divContainer = document.getElementById("indentTable");
    divContainer.innerHTML = "";
    divContainer.appendChild(table);
    table.classList.add("table");
    table.classList.add("table-striped");
    table.classList.add("table-bordered");
    table.classList.add("table-hover");
  }

  document.addEventListener("DOMContentLoaded", function(event) {
    addTableDraft(tableDataDraft);
    });

function Save() {
    count = 0;
    var qtys = document.getElementsByName("Quantity_field");

    for (i=0; i < qtys.length; i++) {
        if(qtys[i].value !== "0") {
            // There is atleast one item that the user has changed the qty for
            count += 1;
        }
    }

    if (count > 0) {
        alert("Thanks for buying something");
    }
    else {
        alert("Please buy something");
    }
}
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>

<script src="site.js"></script>

<link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/4.1.2/css/bootstrap.min.css">
<button type="button" id="save" class="commonButton" onclick="Save();">
    <i class="fas fa-save"></i>&nbsp;Save
</button>
<div class="table-responsive">
  <table id="indentTable" class="table table-bordered table-hover ">

  </table>
</div>

这将检查至少一个项目的数量是否等于或大于1。

答案 5 :(得分:0)

我在您的jquery的底部添加了一行代码。我在表格的第4个.each()中使用了<td>函数。

var tableDataDraft = [


  {
    "Code": "1248",
    "Item Name": "Tandoori Roti",
    "Selling Price": "45.0000",
    "Qty": "0"
  },
  {
    "Code": "1249",
    "Item Name": "Naan-Plain",
    "Selling Price": "50.0000",
    "Qty": "0"
  },
  {
    "Code": "1250",
    "Item Name": "Naan-Butter",
    "Selling Price": "60.0000",
    "Qty": "0"
  },
  {
    "Code": "1251",
    "Item Name": "Naan-Garlic",
    "Selling Price": "55.0000",
    "Qty": "0"
  },
  {
    "Code": "1252",
    "Item Name": "Kulcha-Plain",
    "Selling Price": "50.0000",
    "Qty": "0"
  },
  {
    "Code": "1253",
    "Item Name": "Kulcha-Butter",
    "Selling Price": "60.0000",
    "Qty": "0"
  },
  {
    "Code": "1254",
    "Item Name": "Kulcha-Amritsari",
    "Selling Price": "65.0000",
    "Qty": "0"
  },
  {
    "Code": "1255",
    "Item Name": "Kulcha-Punjabi",
    "Selling Price": "60.0000",
    "Qty": "0"
  },
  {
    "Code": "1256",
    "Item Name": "Kulcha-Jaipuar",
    "Selling Price": "60.0000",
    "Qty": "0"
  },
  {
    "Code": "1257",
    "Item Name": "Paratha-Aloo",
    "Selling Price": "60.0000",
    "Qty": "0"
  },
  {
    "Code": "1258",
    "Item Name": "Paratha-Methi",
    "Selling Price": "55.0000",
    "Qty": "0"
  },
  {
    "Code": "1259",
    "Item Name": "Paratha-Pudina",
    "Selling Price": "60.0000",
    "Qty": "0"
  },
  {
    "Code": "1260",
    "Item Name": "Paratha-Lacha",
    "Selling Price": "55.0000",
    "Qty": "0"
  },

  {
    "Code": "603",
    "Item Name": "AMUL FRESH CREAM",
    "Selling Price": "134.8700",
    "Qty": "0"
  }
]

var itemsQuantiry1 = [];

function addTableDraft(tableDataDraft) {
  var col = Object.keys(tableDataDraft[0]);
  var countNum = col.filter(i => !isNaN(i)).length;
  var num = col.splice(0, countNum);
  col = col.concat(num);
  var table = document.createElement("table");
  var tr = table.insertRow(-1);
  for (var i = 0; i < col.length; i++) {
    var th = document.createElement("th");
    th.innerHTML = col[i];
    tr.appendChild(th);
    tr.classList.add("text-center");
    tr.classList.add("head")
  }
  for (var i = 0; i < tableDataDraft.length; i++) {
    tr = table.insertRow(-1);
    tr.classList.add("item-row");
    for (var j = 0; j < col.length; j++) {
      var categoryName = tableDataDraft[i]["Category Name"];
      tr.dataset.category = categoryName;
      let tabCell = tr.insertCell(-1);
      var hiddenField = document.createElement("input");
      hiddenField.style.display = "none";
      var tabledata = tableDataDraft[i][col[j]];
      if (tableDataDraft[i]['Code'] === tableDataDraft[i][col[j]]) {
        tabCell.innerHTML = tabledata;
        hiddenField.setAttribute('name', 'Item_Code');
        hiddenField.setAttribute('value', tabledata);
        tabCell.appendChild(hiddenField);
      }
      if (tableDataDraft[i]['Item Name'] === tableDataDraft[i][col[j]]) {
        tabCell.innerHTML = tabledata;
        hiddenField.setAttribute('name', 'Item_Name');
        hiddenField.setAttribute('value', tabledata);
        tabCell.appendChild(hiddenField);
      }
      if (tableDataDraft[i]['Selling Price'] === tableDataDraft[i][col[j]]) {
        tabCell.innerHTML = tabledata;
        hiddenField.setAttribute('name', 'Selling_Price');
        hiddenField.setAttribute('value', tabledata);
        tabCell.appendChild(hiddenField);
      }
      if (tableDataDraft[i]['Outlet Id'] === tableDataDraft[i][col[j]]) {
        tabCell.innerHTML = tabledata;
        hiddenField.setAttribute('name', 'Outlet_Id');
        hiddenField.setAttribute('value', tabledata);
        tabCell.appendChild(hiddenField);
      }
      if (tableDataDraft[i]['Qty'] === tableDataDraft[i][col[j]]) {
        tabCell.classList.add("dheeraj")
        var quantityField = document.createElement("input");
        quantityField.style.border = "none";
        quantityField.style["text-align"] = "right";
        quantityField.setAttribute("name", "Quantity_field");
        quantityField.setAttribute("autocomplete", "on");

        if (itemsQuantiry1[i]) {
          quantityField.setAttribute("value", itemsQuantiry1[i]);
        } else {
          quantityField.setAttribute("value", tabledata);
        }
        quantityField.setAttribute("index", i);
        quantityField.setAttribute("type", "number");
        quantityField.setAttribute("min", "0");
        quantityField.setAttribute("max", "999");
        //	quantityField.setAttribute("onfocus", "this.value=''");
        quantityField.setAttribute("required", "required");
        quantityField.classList.add("dataReset");
        quantityField.toLocaleString('en-IN');
        tabCell.appendChild(quantityField);
      }

      if (j > 1)
        tabCell.classList.add("text-right");
    }
  }
  var divContainer = document.getElementById("indentTable");
  divContainer.innerHTML = "";
  divContainer.appendChild(table);
  table.classList.add("table");
  table.classList.add("table-striped");
  table.classList.add("table-bordered");
  table.classList.add("table-hover");
}
addTableDraft(tableDataDraft)

$("#save").click(function(event) {
  var emptyQuantity = $(".dataReset").val(); //on click of save want to check quantity field should be greater then zero	
  var data = [];
  $("tr td:nth-child(4)").each(function() {
      data.push($(this).find("input").val());
    });
  
  if(data.indexOf("0") > -1){
    event.preventDefault();
    alert("Quantity field Value  Should be greater then 0");
  }
  else{
    alert("Submitted");
  }
});
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/4.1.2/css/bootstrap.min.css">
<button type="button" id="save" class="commonButton">
				<i class="fas fa-save"></i>&nbsp;Save
			</button>
<div class="table-responsive">
  <table id="indentTable" class="table table-bordered table-hover ">

  </table>
</div>