使用 javascript 根据用户类型隐藏/取消隐藏文本字段？
[英]Hide/ unhide text fields based on user type using javascript?
问题描述
When the form page is loaded, it automatically pulls the type of user account from the DB into a text field called, check_type.
加载表单页面时，它会自动将用户帐户的类型从数据库中提取到名为 check_type 的文本字段中。 I want to hide/ unhide a text field based on user account type.我想根据用户帐户类型隐藏/取消隐藏文本字段。 If it is an Admin account then show textfield1, and for any other account, type hide textfield1.如果是管理员帐户，则显示 textfield1，对于任何其他帐户，键入 hide textfield1。
Here is the code I wrote;这是我写的代码； but, it is not working.但是，它不起作用。 Maybe, I have used incorrect syntax.也许，我使用了不正确的语法。
<?php
// Include config file
require_once "config.php";
$sql="SELECT * FROM users WHERE username = '$user' ";
$result = mysqli_query($mysqli,$sql);
while($row = mysqli_fetch_array($result)) {
$type = $row['acct_type'];
}
?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Hide/ Unhide</title>
<script language="javascript" type="text/javascript">
$(document).ready(function() {
var check_type = document.getElementById("check_type");
var atype = document.getElementById("atype");
if(check_type == 'Admin')
{
atype.style.display = "block";
}
else
{
atype.style.display = "none";
}
});
</script>
</head>
<body>
<form>
<div>
<input name="check_type" id="check_type" type="hidden" value="<?php echo $type; ?>">
</div>
<div class="form-group">
<label>Account Type</label>
<select type="text" name="atype" id="atype" class="form-control" value="<?php echo $atype; ?>">
<option value="<?php echo $atype; ?>" selected><?php echo $atype; ?></option>
<option value="User">User</option>
<option value="Admin">Admin</option>
</select>
<span></span>
</div>
<div>
<input type="submit" id="submit" value="Submit"/>
</div>
</form>
</body>
</html>
2 个解决方案
解决方案1
1 已采纳 2021-03-23 09:41:30
You need to check the value of check_type .您需要检查check_type的值。 But it depends on what types of the element you are using for check_type.但这取决于您用于 check_type 的元素类型。 If its input type then value otherwise innerHTML如果它的输入类型那么值，否则为innerHTML
UPDATED更新
Type: Admin类型：管理员
$(document).ready(function() { // Input Type var check_type = document.getElementById("check_type"); var textfield1 = document.getElementById("atype"); if(check_type.value == 'Admin') { textfield1.style.display = "block"; } else { textfield1.style.display = "none"; } });
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script> <form> <div> <input name="check_type" id="check_type" type="hidden" value="Admin"> </div> <div class="form-group"> <label>Account Type</label> <select type="text" name="atype" id="atype" class="form-control"> <option value="User">User</option> <option value="Admin">Admin</option> </select> </div> <div> <input type="submit" id="submit" value="Submit"/> </div> </form>
Type: User类型：用户
$(document).ready(function() { // Input Type var check_type = document.getElementById("check_type"); var textfield1 = document.getElementById("atype"); if(check_type.value == 'Admin') { textfield1.style.display = "block"; } else { textfield1.style.display = "none"; } });
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script> <form> <div> <input name="check_type" id="check_type" type="hidden" value="User"> </div> <div class="form-group"> <label>Account Type</label> <select type="text" name="atype" id="atype" class="form-control"> <option value="User">User</option> <option value="Admin">Admin</option> </select> </div> <div> <input type="submit" id="submit" value="Submit"/> </div> </form>
解决方案2
0 2021-03-23 09:27:14
Just add value in your get element to get the element value try:只需在您的 get 元素中添加值即可获取元素值尝试：
check_type.value
<script language="javascript" type="text/javascript">
$(document).ready(function() {
var check_type = document.getElementById("check_type");
var textfield1 = document.getElementById("textfield1");
if(check_type.value == 'Admin')
{
textfield1.style.display = "block";
}
else
{
textfield1.style.display = "none";
}
});
</script>
声明:本站的技术帖子网页，遵循CC BY-SA 4.0协议，如果您需要转载，请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.