0

I am having UI-grid and I want to show modal on click of cell of each row and edit the value of cells of row and show the values in the cell of that row.how should I do that?

This is my code.Where TTOptionsModal is my derective for modal

            var newHtml='<div class="form-group"><div class="col-xs-6 col-md-6"><input type="text"  name="Print" placeholder="Synopsis of your production" /></div></div>';

                              $scope.rowDblClick = function(row) {

                        TTOptionsModal.scope = $scope;
                        TTOptionsModal.question = newHtml;
        TTOptionsModal.buttons=[{text:HomePropertiesService.STORY_CONFIRM_MODAL_SAVE_BUTTON_TEXT,call:"saveMyEdits()"},{text:HomePropertiesService.STORY_CONFIRM_MODAL_CANCEL_BUTTON_TEXT,call:"closeConfirmModal()"}];
        TTOptionsModal.open({text:HomePropertiesService.MODAL_CLOSE_BUTTON_TEXT,call:"closeConfirmModal()"});



                      };


                $scope.myDataNew =[];
                $scope.gridOptionsNew = { 

                         appScopeProvider: $scope,

                        data : 'myDataNew' ,
                        enableCellEdit: true,
                        enableHorizontalScrollbar: 0,
                         enableCellEditOnFocus: true,



                        columnDefs: [
                                     {
                                         enableCellEdit: false,
                                         field: 'SponsorType',
                                         displayName: me.labelText.ADD_STORY_TABLE_SPONSOR_TYPE

                                     }, {

                                         field: 'Hoarding',
                                         displayName: me.labelText.ADD_STORY_TABLE_HOARDING,
                                         cellTemplate: '<div class="text-center"><input type="text" '+
                                            ' name="Hoarding"  ng-model="Hoarding" ng-click="grid.appScope.rowDblClick(row.entity)"/></div>'
                                     },
                                     {

                                         field: 'Print',
                                         displayName: me.labelText.ADD_STORY_TABLE_PRINT,
                                         cellTemplate: '<div class="text-center"><input type="text" '+
                                            ' name="Print"  ng-model="Print" ng-click="grid.appScope.rowDblClick(row.entity)"/></div>'
                                     }]
                                     }
  • Welcome to SO, you need to include the relevant code along with the description, else your question is likely to get less attention and may lead to closure of the question. – dreamweiver May 11 '16 at 06:31
  • Here is a simple example of editable row using angularjs ,http://jsfiddle.net/NfPcH/93/ – dreamweiver May 11 '16 at 06:32
  • But i want to have modal on each cell click of ui-grid. Means when i click on the cell modal should get displayed, in that text box should be there and whatever i write in that text box that value should get assigned to that particular cell on which I have click. – Priyanka Kakade May 11 '16 at 06:42
  • hmm, that was just a reference. anyway you can share your code, what you have tried so far for achieving that – dreamweiver May 11 '16 at 06:43
  • and thank you so much for your answer :-) – Priyanka Kakade May 11 '16 at 06:44
  • hope this is what you were searching for ,http://embed.plnkr.co/WLuKSRX5GqH4rXFhGuyo/ – dreamweiver May 11 '16 at 06:45
  • i have updated my question with my code.I m so much new to angularjs. If there are some mistakes pls ignore that. – Priyanka Kakade May 11 '16 at 06:57
  • hmmm thats just partial code, it would be good if you can replicate the same on plunker, http://plnkr.co – dreamweiver May 11 '16 at 07:04

0 Answers0