seo Question posted in
Some basic information to get you started with this can be found here.

How to get data in ng-Dialog Modal in angularJS – SEO

Hi i am new to angular JS the problem is i am getting all the data in table listing by mysqldatabase in form of json array but i want to show that table data in Modal as well for details:

Here is my html i am including the file in bottom of the page named _detail_modal.html

<table ng-table="table.tableParams5" class="table table-bordered table-striped table_feature">
  <tbody>
    <tr>
      <th>S.No</th>
      <th>Name</th>
      <th>Order</th>
      <th>Status</th>
      <th>SEO</th>
      <th>Action</th>
    </tr>
    <tr ng-repeat="user in $data | filter:searchText">
      <td data-title="'pkCategoryId'" >{{$index + 1}}</td>
      <td data-title="'Name'" >{{user.Name}}</td>
      <!--  <td data-title="'Order'">{{user.Order}}</td> -->
      <td>
        <select class="form-control input-sm" ng-model="rec.orders"  name="Order">
          <option ng-repeat="orders in order"  ng-selected="{{orders.Order == user.Order}}"  value="{{orders.order}}">{{orders.Order}}</option>
        </select>
      </td>
      <td data-title="'Status'">{{user.Status}}</td>
      <td><button class="btn btn-sm btn-info"  title="SEO" ng-click="seo()">  
        <em class="fa fa-search"></em>
        </button> 
      </td>
      <td>
        <button class="btn btn-sm btn-info"  title="View Category" ng-click="details()" >  
        <em class="fa fa-list"></em>
        </button>
        <!--modal start -->
        <!-- Modal end -->
        <button class="btn btn-sm btn-info" title="Edit Category" ui-sref="app.editmanage_category({id:user.pkCategoryId})" >
        <em class="fa fa-pencil"></em>
        </button>
        <button class="btn btn-sm btn-danger" title="Delete Category" ng-click="delete(user.pkCategoryId);">
        <em class="fa fa-trash"></em>
        </button>
      </td>
    </tr>
  </tbody>
</table>
</div>
</div>
<div ng-include="'app/views/_confirm_modal.html'"></div>
<div ng-include="'app/views/manage_category/_details_modal.html'"></div>
<div ng-include="'app/views/manage_category/_seo_modal.html'"></div>

here is _detail_modal.html

<script type="text/ng-template" id="modalDetailsDialogId">
  <div class="ngdialog-message"><h3> Manage Category Details</h3>
  <p> Name:{{user.Name}} </p>
  
  <button type="button" ng-click="closeThisDialog('button')" class="btn btn-default">Cancel</button>
  </div>
</script>

finally here is my JS

$scope.details = function() {
  ngDialog.open({
    template: 'modalDetailsDialogId',
    scope: $scope,
    className: 'ngdialog-theme-default'
  });
};

Any help would be appreciated thanks.

Tags:

2

Answers


  1. 0 
    $scope.details = function() {
  ngDialog.open({
    template: 'app/views/_confirm_modal.html',
    scope: $scope,
    className: 'ngdialog-theme-default'
  });
};

    you can include template via controller and then access data via {{user.Name}}

    Login or Signup to reply.
  2. 0

    Call ngdialog.open as below – Very important is to pass data option. (data: dataO)

    from one controller : 

     $scope.EditShow = function(dataO) {

        ngDialog.open({
            template: 'showDialog',
            controller: 'TopController',
            className: 'ngdialog-theme-default',
            disableAnimation: true,
            scope: $scope,
            data: dataO
        });

    }

    in another controller ($scope.ngDialogData gives all selected values which has been passed as data in Editshow(dataO)

    App.controller('TopController', function ($scope, $http) {
  $scope.Detail =  $scope.ngDialogData.Description
});
    Login or Signup to reply.
Please signup or login to give your own answer.

Back To Top
Search