Question

我使用的模板允许用户选择他们喜欢的颜色和许多其他东西。它看起来像那样：

顶栏颜色

        <ul class="clearfix" id="topBar_style_switch">                
            <li class="@Model.Color_0" title="topBar_style_0"><span class="icon_check_alt2"></span></li>
            <li class="@Model.Color_1" title="topBar_style_1"><span class="icon_check_alt2"></span></li>
            <li class="@Model.Color_2" title="topBar_style_2"><span class="icon_check_alt2"></span></li>
            ....
        </ul>

固定布局：

 <div class="clearfix hidden-sm hidden-md hidden-xs sepH_b">
        <label>Fixed layout</label>
        <div class="pull-right">
            @Html.CheckBoxFor(Model => Model.IsFixedLayout, 
             new { @class = "js-switch mini-switch", @id = "fixed_layout_switch" })
            @if (Model.IsFixedLayout)
            {
                <script>
                    $('body').addClass('fixed_layout');
                    $('#fixed_layout_bg_switch').show();
                </script>
            }
            else
            {
                <script>
                    $('body').removeClass('fixed_layout');
                    $('#fixed_layout_bg_switch').hide();
                </script>
            }
        </div>
    </div>

标记“li”的类css在点击颜色后发生变化，从' sw_tb_style_x '到' sw_tb_style_x style_active '。我无法在动作帖子中获得颜色选择的值，但我确实得到了复选框'FixedLayout'的值，有没有更好的方法来实现它或如何在单击保存按钮

后获取颜色选择的值

谢谢！

Answer 1

这段代码对我很有用，

<ul class="clearfix" id="topBar_style_switch">
    @foreach (var color in Model.Colors)
    {
      <li id="@color.ID" class="@color.CssClass" title="@color.Title">
      <span class="icon_check_alt2"></span></li>
     }
     @Html.HiddenFor(Model => Model.IdSelectedTopBarColor, new { id = "selectedTopBarColor" })
</ul>


 // top bar style
   $('#topBar_style_switch li').on('click', function () {
        var topBarStyle = $(this).attr('title');
        $('#topBar_style_switch li').removeClass('style_active');
        $(this).addClass('style_active');
        $('#main_header').removeClass('topBar_style_1 topBar_style_2 ...').addClass(topBarStyle);            
        $("#selectedTopBarColor").val(this.id)            
    });

Razor绑定视图到viewModel

1 个答案: