[英]Hide Buttons and Show JavaScript
I have run into a problem with our javascript. 我的JavaScript出现了问题。 I have two buttons.
我有两个按钮。 When a certain input has a value, we hide the button, otherwise, we show it.
当某个输入具有值时,我们将隐藏按钮,否则,将其显示。
Here are the buttons we want to hide and show: 这是我们要隐藏和显示的按钮:
<button class="btn btn-info" style="visibility: hidden;" type="button" id="button1" data-id="{{receiptno}}" data-toggle="modal" data-target="#myModal" contenteditable="false">Pay</button>
<form action="/payments/report/{{receiptno}}.pdf" method=post>
<input type=hidden value="{{receiptno}}" name="row_print"></input>
<button class="btn btn-danger" style="visibility: hidden;" type="submit" id="anotherbutton1" name="delete">
<span class="glyphicon glyphicon-print"></span> Print Receipt
</button>
</form>
We are getting our value here. 我们在这里获得价值。 If it's '' we show the pay button, else we show the print receipt button:
如果是',我们显示付款按钮,否则我们显示打印收据按钮:
<input style="visibility: hidden;" id="referto" value="{{paymentmethod}}">
Here's our javascript: 这是我们的JavaScript:
<script type="text/javascript">
$(document).ready(function() {
console.log($("#referto").val());
if ( $("#referto").val() == '') {
document.getElementById('button1').style.visibility = 'visible';
}
else {
document.getElementById('anotherbutton1').style.visibility = 'visible';
}
});
</script>
I'm really not sure why this isn't working. 我真的不确定为什么这不起作用。 Any help is appreciated.
任何帮助表示赞赏。 Thank you!
谢谢!
Can you please try this and see if it works? 您可以尝试一下,看看是否可行吗?
if ( $("#referto").val()) {
It covers a lot of cases, like empty strings, nulls, etc. 它涵盖了很多情况,例如空字符串,空值等。
It works fine it seems. 看起来不错。 I have tested it as below.
我已经对其进行了如下测试。 Perhaps your value="{{paymentmethod}}" is not really returning nothing, but some whitespace.
也许您的value =“ {{paymentmethod}}”并未真正返回任何内容,而是返回了空白。 Check what is being returned from that value.
检查从该值返回什么。 Good luck.
祝好运。
$(document).ready(function() { console.log($("#referto").val()); if ($("#referto").val() == '' || $("#referto").val() == ' ') { document.getElementById('button1').style.visibility = 'visible'; } else { document.getElementById('anotherbutton1').style.visibility = 'visible'; } $("#referto").on("change keydown keyup", function(){ document.getElementById('anotherbutton1').style.visibility = 'hidden'; document.getElementById('button1').style.visibility = 'hidden'; if ($("#referto").val() == '' || $("#referto").val() == ' ') { document.getElementById('button1').style.visibility = 'visible'; } else { document.getElementById('anotherbutton1').style.visibility = 'visible'; } }); });
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> I have run into a problem with our javascript, let's say I have two buttons here I when a certain input has a value we hide the button, otherwise show it Here's our buttons that we want to hide and show: <button class="btn btn-info" style="visibility: hidden;" type="button" id="button1" data-id="{{receiptno}}" data-toggle="modal" data-target="#myModal" contenteditable="false">Pay</button> <form action="" method=post> <input type=hidden value="" name="row_print"> <button class="btn btn-danger" style="visibility: hidden;" type="submit" id="anotherbutton1" name="delete"><span class="glyphicon glyphicon-print"></span> Print Receipt</button> </form> We are getting our values here, if its '' we show the pay button if it's not '' we show the print receipt button: <input style="visibility: block;" id="referto" value="">
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.