List edit in a Data table widget

[brittany_sorrel]

Hi all,

I've embedded the Data table with Filter widget into a custom widget and now trying to see if it is possible to perform a list edit action on the table. I've searched through the community and haven't found anything yet.

I'm doubtful that the Data table with Filter widget will allow me to perform inline edits based on what the code was showing, but I wanted to ask if anyone has found a workaround for this limitation. Or do I need to use a different widget to be able to do inline list editing?

Thanks,

~britt

[Jon Barnes]

I don't currently know of a widget OOB, but I have created one by cloning the data table widget and using sp-editable-field directives. This seems to work pretty well, but haven't tested it thoroughly yet. My widget was built for Kingston, which version are you running?

I can create a version of it for earlier versions and share it here if you want.

[brittany_sorrel]

We are on Istanbul. I haven't tried the sp-editable-field directive.

Did you use the directive to replace the td or within the td of the OOB widget?

<tbody>
<tr ng-repeat="item in data.list track by item.sys_id">
<td class="pointer" ng-class="{selected: item.selected}" ng-click="go(data.table, item)" ng-repeat="field in data.fields_array" data-field="{{field}}" data-th="{{data.column_labels[field]}}">{{item[field].display_value}}</td>
</tr>
</tbody>


Thanks,
~britt

[Jon Barnes · Accepted solution]

I put it inside the td. but there are a few other issues that I had to overcome in that the sp-editable-field directive requires a data model that you would normally get from the $sp.getForm call. But I didn't want to call that for every record in the list, so created a custom script include to give me the data I needed for each field. If you think of a better way, let me know, but here is the update set for what I did. hope that helps you.

[brittany_sorrel]

Thanks so much for sharing this!

Could you expand on what the script include is doing? If I understand correctly it is populating the value(s) for the different field types, but wanted to make sure I fully understood the script.