我将以下设置视图的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);