Print Page - Datagrid cell question

Title: Datagrid cell question
Post by: shumakosik 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.

Title: Re: Datagrid cell question
Post by: stworthy 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>

Title: Re: Datagrid cell question
Post by: shumakosik 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
                                                        });
                                        }
                                      });

Title: Re: Datagrid cell question
Post by: stworthy on January 17, 2018, 12:00:52 AM

Please refer to this example http://code.reloado.com/ayibuk3/edit#preview

Title: Re: Datagrid cell question
Post by: shumakosik 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 (http://code.reloado.com/ayibuk3/8/edit#html,live)

Code:

var data = service.getData(indexColumn, indexRow); //get new data with column and row indexes

Title: Re: Datagrid cell question
Post by: stworthy on January 18, 2018, 07:13:48 PM

Please look at this updated example http://code.reloado.com/ayibuk3/9/edit

Title: Re: Datagrid cell question
Post by: shumakosik on January 19, 2018, 04:27:50 AM

You are the best. Thanks :)

EasyUI Forum

General Category => EasyUI for jQuery => Topic started by: shumakosik on January 15, 2018, 10:58:09 PM