javascript - angularjs submit within Bootsrap Modal -

i have bootstrap 3 modal containing list of items choose from, list populated via angular. when click on item in list, populate hidden field hold chosen values using bit of js, see below. hidden fields tied $scope. when submit form, items not passed. have seen number of comments suggest need refer parent scope, e.g. ng-model="$parent.description", not seem work either. suggestions?

$scope.openfavsmodal = function () {                   var url = "/getfavs/";                   $http.get(url)                         .success(function (data) {                             $scope.mydata = data;                             $('#addfavsmodal').modal('show');                          });               };       <form class="form-horizonatal" ng-submit="insertfavourite()" id="frmaddfav">     <div class="modal fade" id="addfavsmodal" tabindex="-1" role="dialog" aria-labelledby="mymodallabel" aria-hidden="true" >                  <div class="modal-dialog">                   <div class="modal-content">                     <div class="modal-header">                       <button type="button" class="close" data-dismiss="modal" aria-hidden="true">&times;</button>                       <h4 class="modal-title"><strong>add</strong></h4>                     </div>                        <div class="modal-body">                              <input type="text" id="hiddescription" class="form-control" ng-model="mydata.description"  />                             <input type="text" id="hidspectrefno" class="form-control" ng-model="mydata.id" />                           <ul style="height:300px; overflow-y:scroll; float:left;" id="uls" >                               <li ng-repeat="fav in mydata" value="{{fav.id}}" >                                     {{fav.description}}                                  </li>                           </ul>                        </div>                       <div class="modal-footer">                       <button type="button" class="btn btn-default" data-dismiss="modal">close</button>                       <button type="submit" id="btnsubmit"  class="btn btn-primary">save changes</button>                     </div>                     </div><!-- /.modal-content -->                 </div><!-- /.modal-dialog -->                </div><!-- /.modal -->             </form>   <script type="text/javascript" >     $(document).ready(function () {          $("#uls").on("click", "li", function () {             $("#hiddescription").val($(this).text());             $("#hidid").val($(this).val());         });         });   </script> 

i managed working putting ng-click on

, passing favourites object in click event. have been scope.

<ul style="height:300px; overflow-y:scroll; float:left;" id="ul" > <li ng-repeat="fav in favourites" value="{{fav.refno}}"  ng-model="fav.refno" ng-click="insertfavourite(fav)"> {{fav.description}}  </li> </ul>