DG DC Change dropdown text on select

This commit is contained in:
Dennis Collinson 2012-03-07 17:47:34 -08:00
parent e77d7608cd
commit a3ecd32264
4 changed files with 37 additions and 6 deletions

View file

@ -6,7 +6,7 @@ app.forms.Post = app.forms.Base.extend({
}, },
formAttrs : { formAttrs : {
".text" : "text", "textarea.text" : "text",
"input.aspect_ids" : "aspect_ids" "input.aspect_ids" : "aspect_ids"
}, },

View file

@ -1,6 +1,8 @@
<div class="btn-group aspects_dropdown check-group"> <div class="btn-group aspects_dropdown check-group">
<a class="btn btn-info dropdown-toggle" data-toggle="dropdown" href="#">All Aspects <span class="caret"></span></a> <a class="btn btn-info dropdown-toggle" data-toggle="dropdown" href="#">
<span class="text"></span> <span class="caret"></span>
</a>
<ul class="dropdown-menu"> <ul class="dropdown-menu">
<li><a href="#" class="public" data-visibility="public">Public</a></li> <li><a href="#" class="public" data-visibility="public">Public</a></li>
<li><a href="#" class="all-aspects" data-visibility="all-aspects">All Aspects</a></li> <li><a href="#" class="all-aspects" data-visibility="all-aspects">All Aspects</a></li>

View file

@ -4,24 +4,34 @@ app.views.AspectsDropdown = app.views.Base.extend({
"click .dropdown-menu a" : "setVisibility" "click .dropdown-menu a" : "setVisibility"
}, },
postRenderTemplate : function(){
this.setVisibility({target : this.$("a[data-visibility='all-aspects']").first()})
},
setVisibility : function(evt){ setVisibility : function(evt){
var linkVisibility = $(evt.target).data("visibility") var link = $(evt.target)
, visibilityCallbacks = { , visibilityCallbacks = {
'public' : setPublic, 'public' : setPublic,
'all-aspects' : setPrivate 'all-aspects' : setPrivate
} }
visibilityCallbacks[linkVisibility].call(this) visibilityCallbacks[link.data("visibility") || "all-aspects"].call(this)
function setPublic (){ function setPublic (){
this.setAspectIds("public") this.setAspectIds("public")
this.setDropdownText(link.text())
} }
function setPrivate (){ function setPrivate (){
this.setAspectIds("all_aspects") this.setAspectIds("all_aspects")
this.setDropdownText(link.text())
} }
}, },
setDropdownText : function(text){
$.trim(this.$(".dropdown-toggle .text").text(text))
},
setAspectIds : function(val){ setAspectIds : function(val){
this.$("input.aspect_ids").val(val) this.$("input.aspect_ids").val(val)
} }

View file

@ -8,18 +8,37 @@ describe("app.views.AspectsDropdown", function(){
this.view.render() this.view.render()
}) })
it("defaults to All Aspects Visibility", function(){
expect(this.view.$("input.aspect_ids").val()).toBe("all_aspects")
expect($.trim(this.view.$(".dropdown-toggle .text").text())).toBe("All Aspects")
})
describe("selecting Public", function(){ describe("selecting Public", function(){
it("calls set aspect_ids to 'public'", function(){ beforeEach(function(){
this.view.$("a[data-visibility='public']").click() this.view.$("a[data-visibility='public']").click()
})
it("calls set aspect_ids to 'public'", function(){
expect(this.view.$("input.aspect_ids").val()).toBe("public") expect(this.view.$("input.aspect_ids").val()).toBe("public")
}) })
it("sets the dropdown title to 'public'", function(){
expect(this.view.$(".dropdown-toggle .text").text()).toBe("Public")
})
}) })
describe("selecting All Aspects", function(){ describe("selecting All Aspects", function(){
it("calls set aspect_ids to 'all'", function(){ beforeEach(function(){
this.view.$("a[data-visibility='all-aspects']").click() this.view.$("a[data-visibility='all-aspects']").click()
})
it("calls set aspect_ids to 'all'", function(){
expect(this.view.$("input.aspect_ids").val()).toBe("all_aspects") expect(this.view.$("input.aspect_ids").val()).toBe("all_aspects")
}) })
it("sets the dropdown title to 'public'", function(){
expect($.trim(this.view.$(".dropdown-toggle .text").text())).toBe("All Aspects")
})
}) })
}) })
}) })