如果任何一个输入字段不为空或不等于0 javascript



我有库存表。我使用sql语句从堆栈表中提取数据,使用while循环在网页上显示。

请参阅图片。库存页面

我在每一行股票旁边都有一个空的输入字段。用户应该查看库存并通过在空字段中输入数字来更新库存。所以我希望它的工作方式是用户浏览股票,输入股票编号,然后在页面底部有一个按钮,用户必须单击该按钮才能更新股票。

如何隐藏所有字段的更新按钮=0。如果用户输入了任何字段,则会出现更新按钮,如果用户更改了值,则返回到0,则会再次隐藏。

如果我给输入字段一个类"stock val",而不是使用.change函数,它是有效的,问题是如果用户编辑1个库存项,而不是另一个,然后返回并将上一个标记为0,按钮就会隐藏。我通过选择类来完成,如果我将其标记为0,change将隐藏它。

如果至少有1个字段大于0,我需要一种显示更新按钮的方法,如果所有字段为空并设置为0,则需要隐藏按钮。

谢谢。

我的Html:

<div class="table-responsive">          
<table class="table">
<tbody>
<?php
if(mysqli_num_rows($result_miscellaneous) > 0){
while($row = mysqli_fetch_array($result_miscellaneous,MYSQLI_ASSOC)){
?>
<tr>
<td><?php echo $row['description_stk']?></td>
<td><input class="form-control" type="text" value="<?php echo $row['clipbundleinfo_stk']?>"</td>
<td><input class="form-control clips-assign-val" type="text" value="0"</td>
</tr>
<?php
} 
}
?> 
</tbody>
</table>
</div>

Javascript:

<script>
$(document).ready(function(){
$(".clips-assign-val").change(function(){
var val = $(this).val();
if(val > 0 ){
$('#clip-bundles-assign-button1').show();
}else {
$('#clip-bundles-assign-button2').show();
}
});
});
</script>

所以如何隐藏更新按钮,如果所有的输入字段都是空的,并且只有当至少1个字段不为空并且大于0时才显示。

每次更改时,都需要检查是否存在非零输入值。该值可以在change事件发生的输入元素之外的任何其他输入元素中,因此应该检查所有输入元素。这可以用each来完成。这里有一个简化的HTML来演示它:

$(document).ready(function(){
	$(".clips-assign-val").change(function(){
		var allZero = true;
		$(".clips-assign-val").each(function () {
			var val = +$(this).val(); // convert string to number
			allZero = allZero && val === 0;
			return allZero; // if false, the loop will be aborted
		});
		$('#clip-bundles-assign-button1').toggle(!allZero);
		$('#clip-bundles-assign-button2').toggle(allZero);
}).change();
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<input class="clips-assign-val" value=0><br>
<input class="clips-assign-val" value=0><br>
<button id="clip-bundles-assign-button1">Not All Zero</button><br>
<button id="clip-bundles-assign-button2">All Zero</button>

注意:如果你只想要数字输入,你可以考虑输入type="number"而不是type="text"

最新更新