This library provides mechanism that will help you use knockout in SharePoint for field rendering
This library expose next API:
This variable containts relative url where loader will search for template when you're using fromUrl loader.
This variable containt file version that will be appended as a query param when you're using fromUrl loader.
Example: /_layout/15/someproject/templates/file.html?v=fileVersion
This namespace contains client validators that can be used with ko.
This object contains instantiated component view models that are used for field rendering.
If you want to use knockout registered component you should call this methods before field rendered and provide options to it:
Options can have next properties:
property name | description | |
---|---|---|
fieldInternalName | required | SharePoint field internal name |
component | required | registered knockout component name |
json | optional | this boolean option can be used for fields that stores information in JSON format. You can access JS object in component view model constructor by params.value. |
params | optional | you can specify object with additional parameters that should be passed to knockout component. This option can be function (i.e. function (schema) { return {}; } ) that receive field schema as an argument and return object with additional parameters. |
Component view model receives params object with next properties.
- fieldInternalName - field internal name
- editable - boolean that is set to true for NewForm, EditForm
- value - contains field value
- additional options that were specified.
View model instance should have getData function, that will be called on form submit for getting new value (if it's a json field you should return JS object that would be converted to string automatically).
If you want to use custom validation you can specify hasErrors function. It should return message string when field is invalid, otherwise it should return falthy value.
- lodash
- knockout
- jQuery
- ko-sharepoint
(function (koSharepoint) {
koSharepoint.settings.layoutsUrl = '/_layouts/15/MySolution.CurrentProject';
})(koSharepoint);
You should register all knockout components before usage like in example below:
ko.components.register('my-component', {
viewModel: MyComponentViewModel,
template: '<span data-bind="text: value"></span>',
});
NOTE: if you want to use component for list field rendering you should specify viewModel property and pass constructor to it.
You can specify JSLink script with next content:
koSharepoint.useComponentForField({
fieldInternalName: 'FieldInternalName',
component: 'my-component',
json: true,
});
If you want to pass additional params to viewModel:
koSharepoint.useComponentForField({
fieldInternalName: 'FieldInternalName',
component: 'currency',
params: {
negativeDisabled: true
}
});
If you need to get values for choice field from schema you can do next:
koSharepoint.useComponentForField({
fieldInternalName: 'FieldInternalName',
component: 'currency',
params: function (fieldSchema) {
return { /* everything you need */ }
}
});