lbenie / angular-elastic-grid

Wrapper of jquery-elastic-grid for angular 1.x https://github.com/vukhanhtruong/jquery-elastic-grid
MIT License
0 stars 2 forks source link

angular-elastic grid not able to implement button click #1

Open aishwhensheds opened 8 years ago

aishwhensheds commented 8 years ago

@lbenie great work!

I try to used directive according the step given by you, but not getting success to implement. Can you give demo how to implement click event on button list, I want to add button in button_list and on click call function from the controller.

Thanks

lbenie commented 8 years ago

Hi @aishwhensheds

I have not implemented a click event on the buttons. AFAIK they are all anchor tags.

the original libs does this

 for (i = 0; i < urlList.length; i++)
 {
   var linkTarget = (urlList[i]['new_window']) ? '_blank' : '_self';
   var ObjA = $('<a target="'+linkTarget+'"></a>');
   ObjA.addClass('link-button');
   if(i==0){
     ObjA.addClass('first');
   }
   ObjA.attr("href", urlList[i]['url']);
   ObjA.html( urlList[i]['title']);
   this.$detailButtonList.append(ObjA);
 }

So when you use the directive, the url option is an anchor tag.

"button_list": [{"title": "Demo", "url": "http://#"}, {"title": "Download", "url": "http://#"}]

I agree that it would be nice to have a click event !

I'll keep that in mind for the future release when I get some time or maybe you could provide a PR with the fix.

aishwhensheds commented 8 years ago

HI @lbenie

Thanks for your response.

can you at least provide me html page you implemented with the angular-elastic-grid.

lbenie commented 8 years ago

I can't seem to find my little test project.

I have this directive implemented in a project but it has a shitloads of other components.

You can scaffold any angular app and add this via bower

this is the code that I'm using

<div class="row">
  <elastic-grid items="projects" filter="popup"></elastic-grid>
</div>
angular.module('gisWebApp')
  .controller('WorkCtrl', function ($scope, $translate, api, socket) {
     api.project($translate.preferredLanguage()).getList().then(function (projects) {
        $scope.projects = projects;
        socket.syncUpdates('project', $scope.projects);
        });
   }
 }

I am using restangular and made my own service and I am fetching projects from my DB.

Sorry that I can't help more :disappointed:

aishwhensheds commented 8 years ago

Thanks @lbenie, I will try to make it, if get any success than definitely share over here.