Giter Site home page Giter Site logo

Comments (6)

prograhammer avatar prograhammer commented on June 19, 2024

Ah, ok, I had thought once that someone might need that. Let me see this weekend...

from bootstrap-table-contextmenu.

ibakayoko avatar ibakayoko commented on June 19, 2024

Thank you

On Saturday, November 14, 2015, David Graham [email protected]
wrote:

Ah, ok, I had thought once that someone might need that. Let me see this
weekend...


Reply to this email directly or view it on GitHub
#5 (comment)
.

from bootstrap-table-contextmenu.

prograhammer avatar prograhammer commented on June 19, 2024

Hi, @ibakayoko

See this fiddle: http://jsfiddle.net/t3a9ug81/1/
Notice in this fiddle that each button shows a different context menu. Also notice that right-clicking row 3 and right-clicking row 4 also bring up different context menus.

I added an option called beforeContextMenuRow that will allow you to more programmatically show the context menu. Set it to a function and in your function use the method showContextMenu like $('#table').bootstrapTable('showContextMenu',{event:e, ... }); to show the context menu you want. Just make sure to return false to prevent the default context menu behavior from happening afterwards. I'll update the documentation/demo tomorrow, but refer to the fiddle above for now. Feel free to ask me any more questions for clarification.

from bootstrap-table-contextmenu.

ibakayoko avatar ibakayoko commented on June 19, 2024

I will checkout the latest code and try to implement on my project.

I will report the result of my integration.

Thank you very much

On Fri, Nov 20, 2015 at 4:10 AM, David Graham [email protected]
wrote:

Hi, @ibakayoko https://github.com/ibakayoko

See this fiddle: http://jsfiddle.net/t3a9ug81/1/

I added an option called beforeContextMenuRow that will allow you to more
programmatically show the context menu. Set it to a function and use it
(along with $('#table').bootstrapTable('showContextMenu',{event:e, ... });)
to setup the context menu how you want. Just make sure to return false to
prevent the default context menu behavior. I'll update the
documentation/demo in a few days.


Reply to this email directly or view it on GitHub
#5 (comment)
.

from bootstrap-table-contextmenu.

ibakayoko avatar ibakayoko commented on June 19, 2024

Works very well.

 var $table = $('#grid');

      $table.bootstrapTable({
            //contextMenu: '#folders-menu',
            beforeContextMenuRow: function(e, row, b){  
                 if(row.type == 'folders'){
                        $table.bootstrapTable('showContextMenu',{event:e, contextMenu:'#folders-menu'});
                    }
                    else if(row.type == 'files'){
                        $table.bootstrapTable('showContextMenu',{event:e, contextMenu:'#files-menu'});
                    }  

                 return false;

            },          
            onContextMenuItem: function(row, $el){
                if($el.data("item") == "edit"){
                    alert("Edit: " + row.type + ' ' + row.name + ' ' + row.modified_at);
                } else if($el.data("item") == "delete"){
                    alert("Delete: " + row.type + ' ' + row.name + ' ' + row.modified_at);
                } else if($el.data("item") == "action1"){
                    alert("Action1: " + row.type + ' ' + row.name + ' ' + row.modified_at);
                } else if($el.data("item") == "action2"){
                    alert("Action2: " + row.type + ' ' + row.name + ' ' + row.modified_at);
                }
            }
        });

from bootstrap-table-contextmenu.

prograhammer avatar prograhammer commented on June 19, 2024

Yeah I think that looks great. And you can have conditions in your onContextMenuItem like

 if ($el.data("item") == "edit" && row.type == "folders")  {
      // edit folders
 }

from bootstrap-table-contextmenu.

Related Issues (19)

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. 📊📈🎉

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google ❤️ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.