angular2-grid icon indicating copy to clipboard operation
angular2-grid copied to clipboard

How to make inputs copyable?

Open vitalybibikov opened this issue 8 years ago • 3 comments

Currenlty, I expirience a problem with copying texts from inputs, which are located inside the grid. How I can achieve the behavior?

   <div *ngFor="let goal of goals; let i = index" [(ngGridItem)]="goalBoxes[i].config" class="goals"
         (onItemChange)="updateItem(i, $event)"
         (onDrag)="onDrag(i, $event)">
         <div class="goal-box">
            <ss-goal-box [goal]="goal"></ss-goal-box>
         </div>
    </div>

And inside my goal-box component I have something like this:

  <dx-text-box class="box-input" placeholder="{{ 'planning-quarterly-responsible-filler' |translate}}"
                 (onFocusOut)="onChangeGoal()"
                 [(ngModel)]="goalData.responsible">
    </dx-text-box>

Thanks

vitalybibikov avatar May 19 '17 14:05 vitalybibikov

Hey! What config have you got? Are you using a drag/resize handle at all?

BTMorton avatar Jun 03 '17 00:06 BTMorton

Here is an example of the grid config:

public gridConfig: NgGridConfig = <NgGridConfig> {
    'max_cols': 1,
    'margins': [0, 0, 20, 0],
    'auto_resize': true,
    'row_height': 300,
    'resizable': false
};

And example of grid item config:

private getDashConfig(): NgGridItemConfig[] {
    return [
        {'dragHandle': '.goal-box', 'col': 1, 'row': 0},
    ];
}

What I'm trying to achieve is to drag the whole div with class .goal-box. Inside that div I have several inputs, so I expect that everything should be draggable except for those inputs. But now I can only drag some sub-div named "header" of that div by specifying class on it or drag all the div with "draggable inputs"

So, what I wanted to find out, how can I specify ignore rule: drag all that container with .goal-box class, except for those items with ".some-imaginary-not-draggable" class inside of it.

Currently I'm doing the thing by specifying "relative" property on main div, and "absolute" on content. But it would be a lot better to have just a ignore-class to use.

vitalybibikov avatar Jun 05 '17 11:06 vitalybibikov

The dragHandle supports css selectors, so theoretically, you should be able to use .goal-box :not(input) as your dragHandle to achieve this.

BTMorton avatar Sep 01 '17 17:09 BTMorton