i create table using bootstrap , angular use object display data. want open popup window change object property clicking row (and use angular binding in modal work object). issue doesn't understand how pass object table modal.
i found many examples passing values , changing html on fly in case want use angular binding , want pass reference object.
sample of table:
<table class="table table-condensed table-bordered"> <thead>...</thead> <tbody> <tr ng-repeat="property in properties" data-toggle="modal" data-id="property" data-target="#editpropertymodal"> <td>{{property.name}}<td/> <td>{{property.value}}<td/> <td>...<td/> </tr> </tbody> </table>
so clicking row want open modal , pass there property object , use controls input, combobox bind values via angular. sample of modal:
<div class="modal fade" id="editpropertymodal" tabindex="-1" role="dialog" aria-labelledby="editpropertymodallabel" aria-hidden="true"> <div class="modal-dialog"> <div class="modal-content"> <div class="modal-header"> <button type="button" class="close" data-dismiss="modal" aria-label="close"><span aria-hidden="true">×</span></button> <h4 class="modal-title" id="editpropertymodallabel">property details</h4> </div> <div class="modal-body"> {{currentproperty.name}} - {{currentproperty.value}} </div> <div class="modal-footer"> <button type="button" class="btn btn-default" data-dismiss="modal">close</button> <button type="button" class="btn btn-primary">save changes</button> </div> </div> </div>
try pass property via javascript:
$(document).on("click", ".open-editpropertymodal", function (e) { e.preventdefault(); var _self = $(this); var property = _self.data('id'); $("#currentproperty").val(property); $(_self.attr('href')).modal('show'); });
doesn't work.
you can use this that. helped me.
Comments
Post a Comment