Print Page - Datagrid Grouping from Menu Button.

Title: Datagrid Grouping from Menu Button.
Post by: AJLX on September 09, 2015, 01:16:38 AM

Hey guys,

I have a menu that looks like this.

Code:

  <div class="menu-sep"></div>
            <div>
                <span>Group...</span>
                <div>
                    <div>Clear Grouping</div>
                    <div class="menu-sep"></div>
                    <div>By Fixture</div>
                    <div>By Location</div>
                    <div>By Universe</div>
                    
                </div>
            </div>

I would like to add an "onclick" function to each of these options which then updates my datagrid so that it looks like this:

http://www.jeasyui.com/demo/main/index.php?plugin=DataGrid&theme=default&dir=ltr&pitem= (http://www.jeasyui.com/demo/main/index.php?plugin=DataGrid&theme=default&dir=ltr&pitem=)

I'm very new to Js so need some help with this. I'm not necessarily asking for the exact code, but at least some tips on what I need to look at to achieve this.

Regards,

AJLX

Title: Re: Datagrid Grouping from Menu Button.
Post by: stworthy on September 09, 2015, 01:50:25 AM

You do not need to add 'onclick' function to all the menu items, just listen to the 'onClick' event on the menu. Please refer to the code below:

Code:

<div id="mm" class="easyui-menu" style="width:120px;" data-options="
		onClick: function(item){
			//alert(item.text)
		}
		">
    <div>
        <span>Group...</span>
        <div>
            <div>Clear Grouping</div>
            <div class="menu-sep"></div>
            <div>By Fixture</div>
            <div>By Location</div>
            <div>By Universe</div>
        </div>
    </div>
</div>

Title: Re: Datagrid Grouping from Menu Button.
Post by: AJLX on September 14, 2015, 01:25:33 AM

Hey all,

I'm totally stuck with this! I can easily use something like:

Code:

 div.hide

and

Code:

div.show

to show the correct tables. The problem with this is it seems very clunky! The only bit of the table that needs updating is the opening tag:

Code:

<table data-options:             data-options="
                singleSelect:true,
                collapsible:true,
                rownumbers:true,
                fitColumns:true,
                data:data,
                view:groupview,
                groupField:'productid',
                groupFormatter:function(value,rows){
                    return value + ' - ' + rows.length + ' Item(s)';
                }

Does anyone have any ideas? I'm used to being able to solve a problem like this in php by storing the relevant code in a variable, and then being able to echo it when it's needed.

Thanks

AJLX

EasyUI Forum

General Category => EasyUI for jQuery => Topic started by: AJLX on September 09, 2015, 01:16:38 AM