因此,我在我的网站上有一个按钮,允许人们将游戏类别添加到个人资料中,除非用户在下拉列表中选择了某些内容,否则我不希望用户单击添加到个人资料中。我已经尝试了一些方法,但是看到了想要的结果,这是代码的形式:
<div class="form-group">
<label for="" class="col-md-3 control-label">Game Categories *</label>
<div class="col-md-9">
<select name="game_categories_id" id="game_categories_id" class="form-control">
<option value="0">Select One...</option>
<?php foreach ($game_categories as $game_category): ?>
<option value="<?php echo $game_category->ID; ?>">
<?php echo $game_category->name; ?>
</option>
<?php endforeach; ?>
</select>
</div>
</div>
在我的提交区域中,我有以下内容:
<div class="modal-footer">
<?php if (!empty($_POST['game_categories_id']) && ($_POST['game_categories_id'] == 0)) { ?>
<button type="button" class="btn btn-primary" id="save_game_categories_id" ?>">Add Game</button>
<?php } elseif (!empty($_POST['credit_reporting_org_id']) && ($_POST['credit_reporting_org_id'] != 0)) { ?>
<button type="button" class="btn btn-primary" disabled id="save_game_categories_id" ?>">Add Game</button>
<?php } ?>
<button type="button" class="btn btn-default" data-dismiss="modal">Close</button>
我想发生的事情是,直到他们在下拉菜单中选择某项之前,“添加游戏”按钮才是可单击的,但是现在除了“关闭”按钮以外,什么都没有显示。
此外,我在处理添加游戏类别的js文件中拥有此文件:
// Save game categories
$('#modal').on('click', '#save_game_categories_id', function() {
var errors = 0;
var $form = $('#add_game_categories_form');
// Make sure game fields are filled
$.each([$('#game_categories_id'), $('#game_type_id')], function(i, $input) {
if ($input.val() == '' || $input.val() == 0) {
$input.parents('.form-group').addClass('has-error');
errors++;
} else {
$input.parents('.form-group').removeClass('has-error');
}
});
if (errors > 0) return false; // Don't proceed if there are errors
$.post('/game/approved_game/' + game_topic_id, $form.serialize(), function(
data
) {
if (data.success == true) {
refresh_approved_game();
$('#modal').modal('hide');
} else {
$form.find('.alert').show();
}
});
});
所以我已经有了js,我知道它的工作方式是Im可以添加游戏,但是我只想能够禁用提交按钮,只要他们在下拉菜单中选择了任何内容即可
答案 0 :(得分:1)
您可能希望使用一些Javascript完成此操作。您可以像这样使用Jquery:
$('#game_categories_id').on('change', function(){
var noAnswer = ($(this).val() == 0);
$('#save_game_categories_id').attr('disabled', noAnswer);
});
如果您需要使用Vanilla JS,我也可以在其中添加解决方案。
答案 1 :(得分:0)
此:
<?php if (!empty($_POST['game_categories_id']) && ($_POST['game_categories_id'] == 0)) { ?>
应该是:
<?php if (!empty($_POST['game_categories_id']) && ($_POST['game_categories_id'] != 0)) { ?>
以便用户在选择某些内容时添加游戏。
答案 2 :(得分:-1)
据我了解,在下面附加示例代码:
<button type="button" class="btn btn-primary" <?php if(userSelectedCategory == ''){ echo'disabled';} ?> id="save_game_categories_id" ?>">Add Game</button>
如果未选择任何类别,则将禁用您的按钮,否则请删除禁用的属性,这意味着添加游戏按钮已启用