2017-10-04 64 views
0

我一直在试图稍微修改文档中发现的observables示例。根据用户在单选按钮中的选择,我不希望使用不同的枚举,而是希望以下字段更改标题。羊驼标题更改不会生效后更新

这是一个正在运行的fiddle

而下面的代码片段至今:

var teams = { 
 
    "None": "None", 
 
    "Milwaukee": "Milwaukee", 
 
    "Cleveland": "Cleveland", 
 
    "Boston": "Boston" 
 
}; 
 

 
$("#form1").alpaca({ 
 
    "schema": { 
 
    "type": "object", 
 
    "properties": { 
 
     "city": { 
 
     "title": "Pick a City", 
 
     "type": "string", 
 
     "enum": ["Milwaukee", "Cleveland", "Boston"] 
 
     }, 
 
     "team": { 
 
     "title": "nothing yet", 
 
     "type": "string", 
 
     } 
 
    } 
 
    }, 
 
    "postRender": function(control) { 
 
    var city = control.childrenByPropertyId["city"]; 
 
    var team = control.childrenByPropertyId["team"]; 
 
    team.subscribe(city, function(val) { 
 
     //city.schema.title = teams[project.data]; 
 
     console.log('updating field title'); 
 
     this.schema.title = teams[val]; 
 
     //this.parent.refresh(); 
 
     this.refresh(); 
 
     console.log('refreshed') 
 
    }); 
 
    } 
 
});
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.1/js/bootstrap.min.js"></script> 
 
<link href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.1/css/bootstrap.min.css" rel="stylesheet"/> 
 
<script src="https://cdnjs.cloudflare.com/ajax/libs/handlebars.js/4.0.5/handlebars.min.js"></script> 
 
<script src="https://code.jquery.com/jquery-1.11.1.min.js"></script> 
 

 
<script src="https://code.cloudcms.com/alpaca/1.5.17/bootstrap/alpaca.min.js"></script> 
 
<link href="https://code.cloudcms.com/alpaca/1.5.17/bootstrap/alpaca.min.css" rel="stylesheet"/> 
 

 
<div id="form1"></div>

回答

2

为了改变你的领域,你应该使用选项不是模式的标签。

this.options.label = teams[val]; 

告诉我,如果这不适合你。

+0

这绝对解决了它,谢谢! – Yondaime008

+0

很高兴工作:) – vert3x