x11 Posted April 2, 2021 Share Posted April 2, 2021 Спасибо разработчикам, за то, что подсказали как скрывать значки в ActionColumn с помощью CSS Но проблема в том, что в ActionColumn теперь не отображаются данные. Т.е. цель такого функционала - это: 1. По умолчанию скрывать все кнопки и показывать только при наведении (это реализовано). 2. Отображать не просто пустую колонку, а колонку с данными (как реализовать этот функционал). спасибо Link to comment Share on other sites More sharing options...
Sherzod Posted April 2, 2021 Share Posted April 2, 2021 47 minutes ago, x11 said: Отображать не просто пустую колонку Здравствуйте, Простите, а почему пустая строка? Вы имеете в виду пустую строку? Link to comment Share on other sites More sharing options...
x11 Posted April 2, 2021 Author Share Posted April 2, 2021 Не строка, а колонка (столбец сетки). Вот есть колонка ID. Я хотел бы отображать там ID объектов, а при наведении мышки показывать кнопки действий (редактировать, просмотреть, удалить и т.д.) вместо цифры. Но как только я включаю ActionColumn.Enabled (картинка 1), то данные уже в колонке отсутствуют (картинка 2). И еще одна проблема всплыла. Если включено ActionColumn.Enabled, то автоматически отключается возможность изменять ширину колонку (стрелка на картинке 2). Link to comment Share on other sites More sharing options...
Sherzod Posted April 2, 2021 Share Posted April 2, 2021 24 minutes ago, x11 said: Вот есть колонка ID. Я хотел бы отображать там ID объектов, а при наведении мышки показывать кнопки действий (редактировать, просмотреть, удалить и т.д.) вместо цифры. Но как только я включаю ActionColumn.Enabled (картинка 1), то данные уже в колонке отсутствуют (картинка 2). Теперь ясно. Link to comment Share on other sites More sharing options...
x11 Posted April 3, 2021 Author Share Posted April 3, 2021 On 4/2/2021 at 12:12 PM, Sherzod said: Теперь ясно. ну так получиться или нет? Link to comment Share on other sites More sharing options...
Sherzod Posted April 3, 2021 Share Posted April 3, 2021 10 minutes ago, x11 said: ну так получиться или нет? На данный момент у меня не получается. Link to comment Share on other sites More sharing options...
Sherzod Posted April 5, 2021 Share Posted April 5, 2021 On 4/3/2021 at 7:26 PM, x11 said: ну так получиться или нет? Вот такой вид получается на данный момент, с использованием UniPanel (кнопки), mouseover событие ячейки... Link to comment Share on other sites More sharing options...
x11 Posted April 5, 2021 Author Share Posted April 5, 2021 а как такое сделать? Link to comment Share on other sites More sharing options...
Sherzod Posted April 5, 2021 Share Posted April 5, 2021 6 minutes ago, x11 said: а как такое сделать? Черновой код (JS): MainForm.UniDBGrid1.getView().getEl().addListener('mouseover', function(event, target) { MainForm.UniPanel1.setWidth(Ext.get(target).getWidth()); MainForm.UniPanel1.setHeight(Ext.get(target).getHeight()); MainForm.UniPanel1.alignTo(Ext.get(target), 't-t', [0, 0]) }, null, { delegate: '.x-grid-cell-first .x-grid-cell-inner' }); Link to comment Share on other sites More sharing options...
x11 Posted April 5, 2021 Author Share Posted April 5, 2021 мда, слишком сложно для меня без полностью готового примера, я не справлюсь. Link to comment Share on other sites More sharing options...
Sherzod Posted April 5, 2021 Share Posted April 5, 2021 3 hours ago, x11 said: мда, слишком сложно для меня без полностью готового примера, я не справлюсь. Надеюсь, что есть более простой способ, проанализируем... Link to comment Share on other sites More sharing options...
Sherzod Posted April 5, 2021 Share Posted April 5, 2021 8 hours ago, x11 said: без полностью готового примера, я не справлюсь. Кажется, получается: 1 Link to comment Share on other sites More sharing options...
x11 Posted April 6, 2021 Author Share Posted April 6, 2021 супер... ждем решения 1 Link to comment Share on other sites More sharing options...
Sherzod Posted April 6, 2021 Share Posted April 6, 2021 24 minutes ago, x11 said: ждем решения Попробуйте следующие шаги: 1. CustomCSS (если несколько гридов, то можно добавить cls...) .x-grid-cell-inner-action-col { line-height: inherit; font-size: inherit; } .x-grid-cell-inner-action-col:hover { line-height: 0; font-size: 0; } .x-action-col-icon { margin-right: 10px; } 2. UniDBGrid1->ClientEvents->ExtEvents-> (также, можно модифицировать код, для всех actionColumns) function reconfigure(sender, store, columns, oldStore, oldColumns, eOpts) { var actionColIndx = 6; columns[actionColIndx].items.forEach(function(actioncol) { actioncol.getClass = function(value, metadata, record) { return "x-hidden" } }); } 3. UniDBGrid1->ClientEvents->ExtEvents-> (при использовании иконок, не проверял...) (тестировано на демо примере \FMSoft\Framework\uniGUI\Demos\Desktop\Grid - ActionColumn) function afterrender(sender, eOpts) { var me = sender.getView().getEl(); me.addListener('mouseout', function(event, target) { Ext.get(target).select('img').elements.forEach(function(img) { Ext.get(img).addCls('x-hidden') }) }, null, { delegate: '.x-action-col-cell' }); me.addListener('mouseover', function(event, target) { Ext.get(target).select('img').elements.forEach(function(img) { Ext.get(img).removeCls('x-hidden') }) }, null, { delegate: '.x-action-col-cell' }); } 4. UniDBGrid1.Columns[ActionCol].FieldName = 'xx' UniDBGrid1.Columns[ActionCol].Alignment = ... Link to comment Share on other sites More sharing options...
x11 Posted April 6, 2021 Author Share Posted April 6, 2021 22 minutes ago, Sherzod said: var actionColIndx = 6; но ведь в разных сетках положение колонки почти всегда разное т.е. нужно отдельный код для каждой сетки? Link to comment Share on other sites More sharing options...
x11 Posted April 6, 2021 Author Share Posted April 6, 2021 26 minutes ago, Sherzod said: UniDBGrid1.Columns[ActionCol].Alignment = ... подскажите, а это что обозначает? Link to comment Share on other sites More sharing options...
Sherzod Posted April 6, 2021 Share Posted April 6, 2021 3 minutes ago, x11 said: но ведь в разных сетках положение колонки почти всегда разное т.е. нужно отдельный код для каждой сетки? Тогда, попробуйте такой код: function reconfigure(sender, store, columns, oldStore, oldColumns, eOpts) { //var actionColIndx = 6; //columns[actionColIndx].items.forEach(function(actioncol) { // actioncol.getClass = function(value, metadata, record) { // return "x-hidden" // } //}); columns.forEach(function(col){ if (col.xtype && col.xtype == 'actioncolumn') { col.items.forEach(function(actioncol) { actioncol.getClass = function(value, metadata, record) { return "x-hidden" } }) } }); } Link to comment Share on other sites More sharing options...
Sherzod Posted April 6, 2021 Share Posted April 6, 2021 4 minutes ago, x11 said: подскажите, а это что обозначает? Выравнивание "значения" в сетке... Link to comment Share on other sites More sharing options...
x11 Posted April 6, 2021 Author Share Posted April 6, 2021 Я понимаю, что выравнивание, а значение три точки вы указали - что это обозначает? Link to comment Share on other sites More sharing options...
Sherzod Posted April 6, 2021 Share Posted April 6, 2021 Выравнивание значения, выравнивание images. Link to comment Share on other sites More sharing options...
x11 Posted April 6, 2021 Author Share Posted April 6, 2021 Ну, так и что там указать? Я так понял, что вы специально обратили внимание на это свойство, что там что-то надо указать. Но что именно? Там возможны только три значения. Пустое значение недопустимо ведь. Link to comment Share on other sites More sharing options...
x11 Posted April 6, 2021 Author Share Posted April 6, 2021 Еще 2 вопроса. Как разрешить менять ширину ActionColumn? Зачем вообще запрещать менять ширину этой колонки? И второй. Как добавить меню в заголовке такое же, как и остальных обычных колонок? спасибо Link to comment Share on other sites More sharing options...
x11 Posted April 6, 2021 Author Share Posted April 6, 2021 1 hour ago, Sherzod said: Ext.get(target).select('img').elements.forEach(function(img) Подскажите, а если используются иконки fontawesome font? Должно работать или не будет? Link to comment Share on other sites More sharing options...
Sherzod Posted April 6, 2021 Share Posted April 6, 2021 1 hour ago, Sherzod said: (при использовании иконок, не проверял...) (тестировано на демо примере \FMSoft\Framework\uniGUI\Demos\Desktop\Grid - ActionColumn) 3 minutes ago, x11 said: Подскажите, а если используются иконки fontawesome font? Должно работать или не будет? Не тестировал. Link to comment Share on other sites More sharing options...
x11 Posted April 6, 2021 Author Share Posted April 6, 2021 1 hour ago, Sherzod said: var me = sender.getView().getEl(); приложение не запускается function afterrender(sender, eOpts) { //фильтры let fp = sender.addPlugin('gridfilters'); fp.setConfig({menuFilterText: 'Фільтр'}); var me = sender; if (me.editingPlugin.isRowEditor) { me.editingPlugin.saveBtnText = 'Підтвердити'; me.editingPlugin.cancelBtnText = 'Відмінити'; me.editingPlugin.editorCfg.cls = "_roweditor"; me.addCls('_roweditor'); me.editingPlugin.editorCfg.listeners = { show: function() { if (me.activeTD) { me.getEl().select('.x-grid-row-editor-buttons').setX(Ext.get(me.activeTD).getX()); } } }; } var me = sender.getView().getEl(); me.addListener('mouseout', function(event, target) { Ext.get(target).select('img').elements.forEach(function(img) { Ext.get(img).addCls('x-hidden') }) }, null, { delegate: '.x-action-col-cell' }); me.addListener('mouseover', function(event, target) { Ext.get(target).select('img').elements.forEach(function(img) { Ext.get(img).removeCls('x-hidden') }) }, null, { delegate: '.x-action-col-cell' }); } Quote Cannot read property 'getView' of undefined Link to comment Share on other sites More sharing options...
Recommended Posts
Please sign in to comment
You will be able to leave a comment after signing in
Sign In Now