EasyUI Forum
May 04, 2024, 02:38:26 AM *
Welcome, Guest. Please login or register.

Login with username, password and session length
News:
 
   Home   Help Search Login Register  
Pages: [1]
  Print  
Author Topic: Datagrid cell question  (Read 7041 times)
shumakosik
Newbie
*
Posts: 15


View Profile
« on: January 15, 2018, 10:58:09 PM »

Hello!
Can I get cell value on hover mouse by cells in datagrid?
All methods of datagrid getting Row data, but I need to know what cell selected (hover mouse). How I can do it?
I want to show additional information in cell by tooltip.
Logged
stworthy
Administrator
Hero Member
*****
Posts: 3581


View Profile Email
« Reply #1 on: January 16, 2018, 12:29:24 AM »

You can define a 'formatter' function on a cell to display a tooltip message.
Code:
<th data-options="field:'attr1',width:250,formatter:formatAttribute">Attribute</th>
<script type="text/javascript">
function formatAttribute(value,row){
return '<span title="tooltip content">'+value+'</span>';
}
</script>
Logged
shumakosik
Newbie
*
Posts: 15


View Profile
« Reply #2 on: January 16, 2018, 09:20:09 PM »

Thanks. It work's
But if I want show dialog as tooltip?
I need return tooltip for a every cell in datagrid as a different dialog contents
How I can use something in function formatAttribute , for example:
Code:
var clickedData = resultData.rows;
var clickedCell = clickedData[index];
var cell = clickedCell[field];
$('#dlg').dialog({
                                        title: 'Замеры за ' + field,
                                        width: 220,
                                        height: height,
                                        closed: false,
                                        cache: false,
                                        content: function () {
                                          var tableDialog = document.createElement(
                                              'table');
                                          tableDialog.style.width = "100%";
                                          tableDialog.id =
                                              'dataGridDialog' + wellId;
                                          document.getElementById('dlgCheckerboard'
                                                                  + wellId)
                                              .appendChild(tableDialog);
                                          $('#dataGridDialog' + wellId)
                                              .datagrid({
                                                          data: obj,
                                                          title: 'Параметр '
                                                                 + clickedCell["NAME"],
                                                          striped: true,
                                                          bodyCls: "dialog-color",
                                                          singleSelect: true,
                                                          fit: true,
                                                          border: false,
                                                          fitColumns: true,
                                                          remoteSort: false,
                                                          remoteFilter: false,
                                                          columns: [[
                                                            {
                                                              field: 'time',
                                                              title: 'Время',
                                                              halign: 'center',
                                                              width: "45%"
                                                            },
                                                            {
                                                              field: 'value',
                                                              title: 'Значение',
                                                              halign: 'center',
                                                              width: "55%",
                                                              sortable: true,
                                                              styler: cellDialogStyler
                                                            }
                                                          ]],
                                                          showFooter: true
                                                        });
                                        }
                                      });
Logged
stworthy
Administrator
Hero Member
*****
Posts: 3581


View Profile Email
« Reply #3 on: January 17, 2018, 12:00:52 AM »

Please refer to this example http://code.reloado.com/ayibuk3/edit#preview
Logged
shumakosik
Newbie
*
Posts: 15


View Profile
« Reply #4 on: January 18, 2018, 02:48:46 AM »

Okay. It work's. Thanks
But if I need to know what cell (index row and index column id datagrid) is mouse hover. I want to get new data by id column and id row?
Example: http://code.reloado.com/ayibuk3/8/edit#html,live
Code:
var data = service.getData(indexColumn, indexRow); //get new data with column and row indexes
Logged
stworthy
Administrator
Hero Member
*****
Posts: 3581


View Profile Email
« Reply #5 on: January 18, 2018, 07:13:48 PM »

Please look at this updated example http://code.reloado.com/ayibuk3/9/edit
Logged
shumakosik
Newbie
*
Posts: 15


View Profile
« Reply #6 on: January 19, 2018, 04:27:50 AM »

You are the best. Thanks Smiley
Logged
Pages: [1]
  Print  
 
Jump to:  

Powered by MySQL Powered by PHP Powered by SMF 1.1.18 | SMF © 2013, Simple Machines Valid XHTML 1.0! Valid CSS!