Survey.StylesManager.applyTheme("default");
function rowsWithValue(params) {
if (!params && params.length < 2) return false;
var matrixValue = params[0];
var value = params[1];
var rowCount = 0;
for(var key in matrixValue) {
if(matrixValue[key] == value) rowCount++;
}
return rowCount;
}
Survey.FunctionFactory.Instance.register("rowsWithValue", rowsWithValue);
var json = {
"elements": [
{
"type": "matrix",
"name": "quality",
"title": "Please indicate if you agree or disagree with the following statements",
"columns": [
{
"value": "agree",
"text": "Agree"
},
{
"value": "disagree",
"text": "Disagree"
}
],
"rows": [
{
"value": "affordable",
"text": "Product is affordable"
},
{
"value": "doeswhatitclaims",
"text": "Product does what it claims"
},
{
"value": "betterthanother",
"text": "Product is better than other products on the market"
},
{
"value": "easytouse",
"text": "Product is easy to use"
}
]
},
{
"type": "comment",
"name": "disappointedComment",
"title": "We are really sorry that our products doesn't suite your needs. Could provide us with some comments to help us imporove it?",
"visibleIf": "rowsWithValue({quality}, 'disagree') >= 3"
},
{
"type": "comment",
"name": "approvedComment",
"title": "Thank you for appreciating our product. Could provide us with some comments to make it event better?",
"visibleIf": "rowsWithValue({quality}, 'agree') >= 3"
}
]
};
window.survey = new Survey.Model(json);
survey.onComplete.add(function(sender) {
document.querySelector('#surveyResult').textContent =
"Result JSON:\n" + JSON.stringify(sender.data, null, 3);
});
$("#surveyElement").Survey({
model: survey
});
<!DOCTYPE html>
<html lang="en">
<head>
<title>Use custom function in expressions, jQuery Survey Library Example</title>
<meta name="viewport" content="width=device-width" />
<script src="https://unpkg.com/jquery"></script>
<script src="/DevBuilds/survey-jquery/survey.jquery.min.js"></script>
<link href="/DevBuilds/survey-core/survey.min.css" type="text/css" rel="stylesheet" />
<link rel="stylesheet" href="./index.css">
</head>
<body style="margin: 0">
<div id="surveyElement" style="display:inline-block;width:100%;">
</div>
<div id="surveyResult"></div>
<script type="text/javascript" src="./index.js"></script>
</body>
</html>
Help us serve you better by taking this brief survey.
We are interested to learn more about your
experience of using our libraries.
We'd really appreciate your feedback.
Start the SurveyApproximate time to complete: 2 min.