2017-10-04 104 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