获取元素外部单选按钮的标签值

时间:2016-07-28 10:06:59

标签: jquery razor backbone.js radio-button backbone-views

我将以下设置视图的HTML / Razor定义为el,并且在定义的元素之外是3个单选按钮及其标签。

设置视图

<div id="settingsView" class="cardHeader">@Resources.DecisionSupport.Index.Timetable
  <span id="currentTtHeader"></span> 
  <i id="settingsButton" class="octicon octicon-gear dsTtSettingsButton dsDisabledElement"></i>
<span id="selectedSettings"></span>
</div>
<div class="cardBody">
    <div id="calendar"></div>
</div>

收音机按钮

<div id="settingsRadios">
    <div class="radio radio-info radio-inline">
        <input type="radio" id="simpleRadio" name="settingsRadio" />
        <label for="simpleRadio">@Resources.DecisionSupport.Index.SimpleViewLabel</label>
    </div>
    <span class="dsSettingsDesc">'Simple' shows suitable and unsuitable timeslots</span>
    <div class="radio radio-info radio-inline">
        <input type="radio" id="overlayRadio" name="settingsRadio" checked="" />
        <label for="overlayRadio">@Resources.DecisionSupport.Index.OverlayViewLabel</label>
    </div>
    <span class="dsSettingsDesc">'Overlay' some description here</span>
    <div class="radio radio-info radio-inline">
        <input type="radio" id="detailedRadio" name="settingsRadio" />
        <label for="detailedRadio">@Resources.DecisionSupport.Index.DetailedViewLabel</label>
    </div>
    <span class="dsSettingsDesc">'Detailed' gives information about events and clashes</span>
</div>

我目前有以下Backbone代码,但console.log(value);函数中的prevSetting目前返回undefined。我怎样才能使它返回单选按钮的标签?任何帮助将不胜感激。

var TimetableSettingsView = Backbone.View.extend({
            el: "#settingsView",
            ui: {
                selectedSettings: $('#selectedSettings'),
                settingsButton: $('#settingsButton')
            },
            events: {
                'click #settingsButton': 'showSettings'
            },
            initialize: function() {
                var self = this;

                this.settingsTpl = _.template($('#timetableSettingsTpl').html());

                $(document).on('change', '#settingsRadios', function(e) {
                    self.changeCalType(e);
                });
                $(document).on('click', '#selectButton', function() {
                    self.prevSetting();
                });
                this.render();

            },
            render: function() {
                this.ui.settingsButton.webuiPopover({
                    title: "Timetable Settings",
                    content: this.settingsTpl,
                    animation: 'pop',
                    closeable: true,
                    width: 400,
                    height: "auto",
                    placement: "auto"
                });
            },
            prevSetting: function() {
                console.log("Button Clicked");
                var value = $(":radio[name=settingsRadio]:checked").val();
                console.log(value);
            },

我确实有另一个函数可以返回正确的值,但是我也想在prevSetting函数中返回值。

changeCalType: function(e) {
        var checkedType = typeof (e) !== "string" ? $(e.currentTarget).find('input:radio:checked').attr('id') : e;
        console.log("Checked Type = " + checkedType);

0 个答案:

没有答案