This class allows creation of ThumbsUp/ThumbsDown component which can be used to display Like/Dislike state and handle article feedback.
This class allows creation of "Was this article helpful?" component which can be used to handle article feedback.
Namespace object for feedback enums.
1. Add script to your page:
<script src="https://<AccountName>.nanorep.co/web/include.js?sdk=feedback-survey,feedback-thumbs&api=feedback"></script>
2. Create two empty <div>:
<div id="example-container1"></div> <div id="example-container2"></div>
3. Initialize Feedback component:
// initialize SDK with common parameters
nanorep.sdk.init({
host: 'product_demo.nanorep.co',
account: 'product_demo',
kb: 'docs'
});
// create FeedbackThumbs instance
var thumbs = new nanorep.sdk.FeedbackThumbs({ id: '1046126072' }, document.getElementById('example-container1'));
var survey = new nanorep.sdk.FeedbackSurvey({ id: '1046126072' }, document.getElementById('example-container2'));
Type: String
Article id for feedback
new nanorep.sdk.FeedbackThumbs({
id: 'fakeArticleId1'
}, document.getElementById('example-options-thumbs_id'));
<div id="example-options-thumbs_id"></div>
Type: Number
Default: 1
feedback dialog type could be any values from nanorep.api.feedback.feedbackDialogTypeEnum object
new nanorep.sdk.FeedbackThumbs({
id: 'fakeArticleId2',
feedbackDialogType: nanorep.api.feedback.feedbackDialogTypeEnum.multipleChoiceOpenText
}, document.getElementById('example-options-thumbs_feedbackDialogType'));
<div id="example-options-thumbs_feedbackDialogType"></div>
setState(state) : void
Set feedback state
state: Number |
Specific state of the feedback component. Must be any value from nanorep.sdk.FeedbackThumbs.stateEnum |
var feedbackThumbsSetState = new nanorep.sdk.FeedbackThumbs({
id: 'fakeArticle3'
}, document.getElementById('example-methods-setState'));
<div id="example-methods-setState"></div> <button onclick="feedbackThumbsSetState.setState(nanorep.sdk.FeedbackThumbs.stateEnum.LIKE)">set like</button> <button onclick="feedbackThumbsSetState.setState(nanorep.sdk.FeedbackThumbs.stateEnum.DISLIKE)">set dislike</button>
disable() : void
Disable component and ignore all user actions
var feedbackThumbsDisable = new nanorep.sdk.FeedbackThumbs({
id: 'fakeArticle4'
}, document.getElementById('example-methods-thumbs_disable'));
<div id="example-methods-thumbs_disable"></div> <button onclick="feedbackThumbsDisable.disable()">disable feedback</button>
enable() : void
Disable component and ignore all user actions
var feedbackThumbsEnable = new nanorep.sdk.FeedbackThumbs({
id: 'fakeArticle5'
}, document.getElementById('example-methods-thumbs_enable'));
feedbackThumbsEnable.disable()
<div id="example-methods-thumbs_enable"></div> <button onclick="feedbackThumbsEnable.enable()">enable feedback</button>
feedbackThumbsInstance.on('like', function() {})
Occurred when user pressed "Like" button (only if thumbs were not disabled)
new nanorep.sdk.FeedbackThumbs({
id: 'fakeArticle6'
}, document.getElementById('example-events-thumbs_like')).on('like', function() {
alert('Excellent!');
});
<div id="example-events-thumbs_like"></div>
feedbackThumbsInstance.on('dislike', function() {})
Occurred when user pressed "Dislike" button (only if thumbs were not disabled)
new nanorep.sdk.FeedbackThumbs({
id: 'fakeArticle7'
}, document.getElementById('example-events-thumbs_dislike')).on('dislike', function() {
alert('Sorry about that!');
});
<div id="example-events-thumbs_dislike"></div>
Type: Object
Object with enums for feedback state
{
DEFAULT: 0,
LIKE: 1,
DISLIKE: 2
}
Type: String
Article id for feedback
new nanorep.sdk.FeedbackSurvey({
id: 'fakeArticleSurveyId1'
}, document.getElementById('example-options-survey_id'));
<div id="example-options-survey_id"></div>
Type: Number
Default: 2
feedback dialog type could be any values from nanorep.api.feedback.feedbackDialogTypeEnum object
new nanorep.sdk.FeedbackSurvey({
id: 'fakeArticleSurveyId2',
feedbackDialogType: nanorep.api.feedback.feedbackDialogTypeEnum.multipleChoiceOpenText
}, document.getElementById('example-options-survey_feedbackDialogType'));
<div id="example-options-survey_feedbackDialogType"></div>
setState(state) : void
Set feedback state
state: Number |
Specific state of the feedback component. Must be any value from nanorep.sdk.FeedbackSurvey.stateEnum |
var feedbackSurveySetState = new nanorep.sdk.FeedbackSurvey({
id: 'fakeArticleSurvey3'
}, document.getElementById('example-methods-setState'));
<div id="example-methods-setState"></div> <button onclick="feedbackSurveySetState.setState(nanorep.sdk.FeedbackSurvey.stateEnum.HELPFUL)">set helpful</button> <button onclick="feedbackSurveySetState.setState(nanorep.sdk.FeedbackSurvey.stateEnum.UNHELPFUL)">set unhelpful</button>
disable() : void
Disable component and ignore all user actions
var feedbackSurveyDisable = new nanorep.sdk.FeedbackSurvey({
id: 'fakeArticleSurvey4'
}, document.getElementById('example-methods-survey_disable'));
<div id="example-methods-survey_disable"></div> <button onclick="feedbackSurveyDisable.disable()">disable feedback</button>
enable() : void
Disable component and ignore all user actions
var feedbackSurveyEnable = new nanorep.sdk.FeedbackSurvey({
id: 'fakeArticleSurvey5'
}, document.getElementById('example-methods-survey_enable'));
feedbackSurveyEnable.disable()
<div id="example-methods-survey_enable"></div> <button onclick="feedbackSurveyEnable.enable()">enable feedback</button>
feedbackSurveyInstance.on('select', function() {})
Occurred after user pressed "Yes" or "No"
isHelpful: Boolean |
Status of feedback |
feedbackText: String |
Text from the textarea in feedback popup |
new nanorep.sdk.FeedbackSurvey({
id: 'fakeArticleSurvey6'
}, document.getElementById('example-events-survey_select')).on('select', function(isHelpful, feedbackText) {
alert('Feedback is ' + (isHelpful ? 'helpful' : 'unhelpful') + '. And that\'s why - ' + feedbackText);
});
<div id="example-events-survey_select"></div>
Type: Object
Object with enums for feedback state
{
DEFAULT: 0,
HELPFUL: 1,
UNHELPFUL: 2
}
addFeedback(options) : void
This API method is used to send article feedback
options: Object |
Plain object containing type, feedbackText |
options.articleId: String |
Id of the article |
options.type: String |
Value from nanorep.api.feedback.feedbackReasonEnum (required) |
options.feedbackText (optional) String |
Feedback text |
Type: Object
Object with feedback popup type enums
{
multipleChoiceOpenText: 0,
multipleChoice: 1,
openText: 2
}
Type: Object
Object with feedback reason type enums
{
none: 'none',
wrongAnswer: 'wrongAnswer',
wrongContent: 'wrongContent',
wrongContext: 'wrongContext'
}