Author Topic: Need to be able to select text in a column  (Read 260 times)

jplevene

  • Pro Ultimate
  • Full Member
  • *
  • Posts: 100
    • View Profile
Need to be able to select text in a column
« on: November 08, 2023, 01:15:50 am »
I have a basic grid setup as below, however I want to be able to select the text in the "code" column so that CTRL+C can be pressed to copy it.  Is that possible?  Notice it is select row and there are check boxes.

Code: [Select]
.pqGrid({
dataModel: {data: []},
colModel : [
{dataIndx:"state", maxWidth:30, minWidth:30, align:"center", resizable:false, title:"", menuIcon:false, type:"checkBoxSelection", cls:"ui-state-default", sortable:false, editor:false, dataType:'bool',
                    cb: {
                        all: true, // Checkbox selection in the header affect current page only.
                        header: true // Show checkbox in header.
                    }
                },
{dataIndx:'qty', maxWidth:80, dataType:"float", editable:false},
{dataIndx:'code', maxWidth:100, editable:false},
{dataIndx:'something', maxWidth:150, editable:false}
],
numberCell: {show: false},
menuIcon: false,
scrollModel:{autoFit:true}, // show scroll
flex: {on:true}, // Width of headers auto fit
width: "100%",
height: "100%",
hoverMode: "row",
dragColumns: {enabled:false},
showTitle: false,
            showToolbar: false,
showTop: false,
wrap: true, // Cell content on one line
hwrap: false,
selectionModel: { type:"row", mode:"single", column:false, all:false}, // Select rows !!!!
virtualWin: true,
rowClick: function(event, ui) {
// Must be a data row
if(!empty(ui.rowData))
{
// It will be true, false or undefined
var checked = ui.rowData["state"];
// Edit the row and toggle the state (checkbox)
that.infoGrid.pqGrid("updateRow", {rowIndx:ui.rowIndx, newRow:{"state":!checked} });
}
},
check: function(event, ui) {
that.change_info_grid_checked();
},
groupModel: {
on: true,
header: false,
grandSummary: true,
agg: {
qty: 'sum'
}
},
summaryTitle:{ count: "{0}", sum: "{0}" ,avg:"{0}" }
});

paramvir

  • Administrator
  • Hero Member
  • *****
  • Posts: 6263
    • View Profile
Re: Need to be able to select text in a column
« Reply #1 on: November 08, 2023, 07:03:30 am »
Yes, to be able to copy entire columns with Ctrl + C, you need to enable column selections by removing column: false from selectionModel. Then you can select whole column by clicking on the header cell of that column and press Ctrl + C to copy it.

In order to copy few cells ( not entire column ), you have to change selectionModel.type to 'cell' and checkboxes can be used for row selections as in this example:

https://paramquery.com/pro/demos/selection_checkbox

« Last Edit: November 08, 2023, 12:12:42 pm by paramvir »

jplevene

  • Pro Ultimate
  • Full Member
  • *
  • Posts: 100
    • View Profile
Re: Need to be able to select text in a column
« Reply #2 on: November 08, 2023, 10:45:20 pm »
Sorry, I didn't make myself clear, I just need to select and copy the text in a single cell in one specific column.

I also need the row to select as in my example.  I just want the browser text editor to select text inside a cell so that I can right click and use the browser copy.  Setting
Code: [Select]
selectionModel: { type:"row", mode:"single", column:false, all:false}, I want to keep and I don't want to be selecting cells, I just want to select a bit of text inside a cell like I can on this forum page by clicking on some text and dragging the cursor.
« Last Edit: November 08, 2023, 10:49:30 pm by jplevene »

paramvir

  • Administrator
  • Hero Member
  • *****
  • Posts: 6263
    • View Profile
Re: Need to be able to select text in a column
« Reply #3 on: November 09, 2023, 11:45:27 am »
Text is copied based on the selections. Whole rows are copied when row selections are used and cells are copied when cell selections are used.

So cell selections need to be enabled in order to copy cell text.

Code: [Select]
selectionModel: { type:"cell" }

In order to use browser native selections and copy paste,

1) both custom row and cell selections in pqgrid have to be disabled.

Example: https://paramquery.com/pro/demos/selection_native

2) or a cell can be put in edit mode and text ( partial or whole ) can be selected from editor.