How to allow text to be copied in a ui-sortable table?

[imTachu]

I'm sorry if this has been addressed before, I couldn't find it. I want to allow users to copy the text inside the rows of a ui-sortable table. In specific in this case, the pn-custom directive only contains a span with text. That is the text I want to allow to be copied.

<table class="table">
       <thead>
          <tr>
             <th>Column 1</th>
             <th>Column 2</th>
             <th>Column 3</th>
          </tr>
       </thead>
       <tbody ui-sortable="sortableOptions" ng-model="aModel">
          <tr ng-repeat="prwd in aModel">
             <td><pn-custom id="{{prwd.article_id}}"></pn-custom></td>
             <td>{{prwd.label}}</td>
             <td>{{prwd.attribute}}</td>
          </tr>
       </tbody>
    </table>

Of what I've read in the README file, I should use a cancel? Is this wrong? Is there any simple way to achieve this that I'm ignoring?

$scope.sortableOptions = {
  update: function(e, ui) {
    if (ui.item.sortable.span) {
      ui.item.sortable.cancel();
    }
  }
};

The reason why I post this here and not in SO is because if I think this is a simple use case, and if I can fix I would like to document it in the README.md file.

[thgreasi]

Does the directive handle the coping part or you just need to select the text? I think that you might need to use a handle. If you actually need to check the DOM element that was clicked, you can do something like if ($(e.originalEvent.target).is('span')) { /*...*/ }. But, since cancel() only reverts the sorting after the dragging, you might want to take a look at the cancel option as well.

[thgreasi]

Any feedback on this?

[imTachu]

So sorry! I forgot to tell you, it was solved like this:

<tbody ui-sortable="sortableOptions" ng-model="aModel">

  $scope.sortableOptions = {
    cancel: 'pn-custom id, .input-sm'
  };

To me, it looks very clean and works very well:

• The cursor changes when hovering on the text
• The rest of the row executes the sortable function

WDYT?

[thgreasi]

Yea, that's exactly what I was thinking of. 👍 for making it work and 👍 for sharing back your findings.