Question

我很难理解这段代码，因为我是Javascript / HTML / C的新手＃Razor

目前我有以下

<li class="control-group">
        <label for="autoReload" class="control-label">Auto Reload</label>
        <div class="controls">
            <div class="btn-group radioButtons radioToggleCollapse" data-toggle-id="#autoReloadExtra" data-toggle="buttons-radio">
                <button type="button" data-value="no" class="btn active">No</button>
                <button type="button" data-value="yes" class="btn">Yes</button>
            </div>
            <input type="hidden" class="radioHidden" value="'$'+@(Model.IsAutoReload ? "True" : "False")" id="autoReload" name="IsAutoReload">
        </div>
</li>

我要做的是当我点击按钮No，将该文本框中的值更改为False，或者如果我单击true，那么我希望将该值更改为true

我找到了以下Javascript，

   <script>
        $(document).ready(function(){

            $("#autoReload").on('change',function(){
                if ($(this).val() == 'yes') {
                    $(".saveCardSwitch button[data-value='true']").trigger('click');
                    $(".saveCardSwitch button").each(function(){
                        $(this).addClass('disabled').prop('disabled',true);
                    });
                }
                if ($(this).val() == 'no') {
                    $(".saveCardSwitch button").each(function(){
                        $(this).removeClass('disabled').prop('disabled',false);
                    });
                }
            });

        });
   </script>

现在我已经尝试将我的按钮上的实际数据值切换为true / false，但是当我这样做时，我打开的隐藏消息不再显示，所以我有点卡在这一点上。我还想澄清一下，当我打电话给@（Model.IsReload？“True”：“False”时，将值传递回我的控制器中的post方法吧？

Answer 1

当您使用Jquery时，您可以通过以下方式执行此操作：

$('.btn').click(function(){
   $('.radioHidden').val($(this).attr('data-value') === 'yes');
});

<强> Fiddle

Answer 2

根据我的理解，您需要的是一个在特定元素上设置值的函数。您可以使用以下代码

执行此操作

<li class="control-group">
<label for="autoReload" class="control-label">Auto Reload</label>
<div class="controls">
    <div class="btn-group radioButtons radioToggleCollapse" data-toggle-id="#autoReloadExtra" data-toggle="buttons-radio">
        <button type="button" data-value="no" onclick="setValue(false, 'autoReload');" class="btn active">No</button>
        <button type="button" data-value="yes" onclick="setValue(true, 'autoReload');" class="btn">Yes</button>
    </div>
    <input type="hidden" class="radioHidden" value="" id="autoReload" name="IsAutoReload">
</div>

你的函数setValue可以是：

var setValue = function(value, id)
{
    var domEl = document.getElementById(id);
    domEl.value = value;
}

Answer 3

您似乎没有任何事件绑定到您想要用来切换的按钮，这是您需要的第一件事，您可以执行onclick事件

<button type="button" data-value="no" onclick="updateHidden(this.dataset.value)" class="btn active">No</button>
<button type="button" data-value="yes" onclick="updateHidden(this.dataset.value)" class="btn">Yes</button>

然后更新隐藏输入的代码是

function updateHidden(value){
value = value==="yes"?"TRUE":"FALSE";
document.getElementById("autoReload").value = value;
}

使用Javascript更改我的隐藏字段的值

3 个答案: