Question

我使用PHP创建了一个购物车机制，并在JavaScript的帮助下完成了验证，验证无效。

这是我的实际php脚本：

$result = mysqli_query($conn, "SELECT * FROM products");
while($row = mysqli_fetch_array($result)){

  $fieldidval[] = $row['product_id'];
  $fieldnameval[] = $row['product_name'];
  $fieldcostval[] = $row['product_cost'];
  $fieldimgval[] = $row['product_image'];
  $fielddescval[] = $row['product_description'];

}

//printing field values

for($i = 0; $i < mysqli_num_rows($result); $i++){

  echo "<tr><form action = 'cart.php?pid=" . $fieldidval[$i] . "&name=" .$fieldnameval[$i] . "&cost=" . $fieldcostval[$i] . "' method = 'post' name = 'tocart' onsubmit = 'return(validateAll());'><td>" . $fieldnameval[$i] . "</td><td>" . $fieldcostval[$i] . "</td><td>" . $fieldimgval[$i] . "</td><td>" . $fielddescval[$i] . "</td><td><input type = 'text' name ='qty_input[$i]' ></td><td><input type = 'submit' name = 'submit'></td></form></tr>"; }

这是我在javascript中的验证：

function validateAll(){
  if( document.tocart.qty_input[0].value == "" ){
    alert("Please enter a valid number");
    document.tocart.qty_input.focus();
    return false;
  }

当我点击提交时没有任何作品。

Answer 1

将评论转换为答案

如果我们保留内联提交处理程序，请使用this

传递表单

onsubmit = 'return validateAll(this);'

然后我们可以直接在处理程序中访问表单，而不必使用更长的document.formname

function validateAll(form) { // "this" -> whatever is in (....) here
  var qty_input= form["qty_input[0]"]; 
  if (qty_input.value == "") { 
    alert("Please enter a valid number"); 
     qty_input.focus(); 
     return false; 
  }
}

这是使用不显眼的代码的更好方法

window.onload=function() { // when page loads. You can use event listener too
  document.querySelector("[name=tocart]").onsubmit=function() {
    var qty_inputs = document.querySelectorAll("[name^=qty_input]"); // starts with
    for (var i=0;i<qty_inputs.length;i++) { 
      if (qty_inputs[i].value == "") { 
         alert("Please enter a valid number"); 
         qty_inputs[i].focus(); 
         return false; 
      }
    }
  }
}

使用

可以避免所有这些

<input type = 'text' name ='qty_input[$i]' required />

表单验证未按预期工作

1 个答案: