У меня есть список, сгенерированный Handlebars #each, когда кто-либо нажимается, модал должен перечислить характеристики. Модал открывается, но данные не отображаются. Обратите внимание, что console.log показывает объект.
<div class="row">
<ul>
{{#each dbBeer}}
<div class="col-m-4 col-sm-4 col-xs-4">
<button class="btn btn-block" onclick="showThisBeer({{json this}})">{{this.name}} /button>
</div>
{{/each}}
</ul>
</div>
обратите внимание на помощника для разрешения json. jscript, чтобы справиться с этим:
var showThisBeer = function(stuff) {
console.log(stuff);
$("#showThisBeerModal").modal('toggle', function(){
$(".modal-body #newData").val( stuff);
});
};
открывает модальное окно, но я не могу отобразить данные - примечание: я пытался всеми способами найти различные элементы:
<!-- Modal to show the details of the selected beer -->
<div class="modal fade" id="showThisBeerModal" role="dialog">
<div class="modal-dialog">
<!-- Modal content-->
<div class="modal-content">
<div class="modal-header">
<h2>Details about this Beer</h2>
</div>
<div class="modal-body">
<p>some content</p>
<input type="text" name="newData" id="newData" value=""/>
</div>
<div class="col-md-6 modal-body">
<input type="text" name="newData" id="newData" value="name">
<div class="form-group">
<p> some content </p>
<input type="text" name="newData" id="newData" value={newData.name}>{{newData.name}}
</div>
<textarea class="form-control" id="{{newData.name}}"></textarea>
<div class="form-group">
<div class="btn btn-block" href="#" role="button" id="" > {{incommingData.color}}
</div>
</div>
<div class="form-group">
<input type="text" name="newData" id="" value="incommingData.feel"/>
</div>
<div class="form-group">
<div class="btn btn-block" href="#" role="button" id=""> {{this.newData.style}}
</div>
</div>
<div class="form-group">
<div class="btn btn-block" href="#" role="button" id="newData" value={{newData.smell}}> </div>
</div>
<div class="form-group">
<div class="btn btn-block" href="#" role="button" id="" value="{{newData.feel}}"> {{newData.feel}}</div>
</div>
</div>
</div>
<div class="modal-footer">
...
</div>
</div>
</div>
Также обратите внимание, что журнал консоли показывает объект:
{id: 15, name: "Founders Doom", color: 5, hoppieness: 100, style: "IPA", …}
color: 5
feel: "Medium"
hoppieness: 100
id: 15
name: "Founders Doom"
smell: "Caramel"
style: "IPA"
triedThis: 0
__proto__: Object