Created
September 11, 2019 06:50
-
-
Save karims/95a6b19a788cf2a51c4fe0599b5b6600 to your computer and use it in GitHub Desktop.
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| function doOnCurrentPageChanged(survey) { | |
| document | |
| .getElementById('surveyPrev') | |
| .style | |
| .display = !survey.isFirstPage | |
| ? "inline" | |
| : "none"; | |
| document | |
| .getElementById('surveyNext') | |
| .style | |
| .display = !survey.isLastPage | |
| ? "inline" | |
| : "none"; | |
| document | |
| .getElementById('surveyComplete') | |
| .style | |
| .display = survey.isLastPage | |
| ? "inline" | |
| : "none"; | |
| document | |
| .getElementById('surveyProgress') | |
| .innerText = "Page " + ( | |
| survey.currentPageNo + 1) + " of " + survey.visiblePageCount + "."; | |
| if (document.getElementById('surveyPageNo')) | |
| document | |
| .getElementById('surveyPageNo') | |
| .value = survey.currentPageNo; | |
| } | |
| // var defaultThemeColors = Survey | |
| // .StylesManager | |
| // .ThemeColors["bootstrap"]; | |
| // // defaultThemeColors["$text-color"] = "#000"; | |
| // // defaultThemeColors["$header-color"] = "#1ab394"; | |
| // Survey | |
| // .StylesManager | |
| // .applyTheme(); | |
| Survey | |
| .StylesManager | |
| .applyTheme("bootstrap"); | |
| var json = { | |
| title: "Little things to know you better", | |
| pages: [{ | |
| title: "", | |
| questions: [ | |
| { | |
| name: "height", | |
| type: "text", | |
| title: "Height:", | |
| placeHolder: "5'5''", | |
| isRequired: true | |
| }, | |
| { | |
| name: "age", | |
| type: "text", | |
| title: "Age:", | |
| placeHolder: "27", | |
| isRequired: false | |
| }, | |
| { | |
| name: "city", | |
| type: "text", | |
| title: "City:", | |
| placeHolder: "Bangalore", | |
| isRequired: false | |
| } | |
| ] | |
| }, | |
| { | |
| title: "", | |
| questions: [{ | |
| name: "work", | |
| type: "radiogroup", | |
| title: "Which from the below resonates with your nature of work", | |
| isRequired: true, | |
| hasNone: true, | |
| colCount: 2, | |
| choices: [ | |
| "Desk job", | |
| "Desk job with considerable amount of running around", | |
| "Field job", | |
| "Client facing" | |
| ] | |
| }, | |
| { | |
| name: "designation", | |
| type: "matrixdropdown", | |
| choices: [ | |
| "Most often", "Occasionally", "Rarely", "Never" | |
| ], | |
| columns: [ | |
| { | |
| name: "rate", | |
| title: "Please choose" | |
| } | |
| ], | |
| title: "Choose what resonates most with your typical work day attire", | |
| isRequired: false, | |
| rows: [ | |
| { | |
| value: "boardroom", | |
| text: "BOARDROOM" | |
| }, { | |
| value: "bizzcasual", | |
| text: "BUSINESS CASUAL" | |
| }, { | |
| value: "casual", | |
| text: "CASUAL" | |
| }, { | |
| value: "fusion", | |
| text: "FUSION" | |
| } | |
| ] | |
| }, | |
| { | |
| name: "city", | |
| type: "radiogroup", | |
| title: "Marital Status (Optional)", | |
| isRequired: false, | |
| choices: [ | |
| "Married", | |
| "Single", | |
| "Do not want to specify" | |
| ] | |
| } | |
| ] | |
| }, | |
| { | |
| title: "Images", | |
| questions: [ | |
| { | |
| type: "radiogroup", | |
| name: "bodytype", | |
| title: "What category would your body type fall among below?", | |
| html: "<table><body><row><td><img src='https://res.cloudinary.com/mintash/image/upload/v1543314006/uploads/body-types.png' width='500px' /></td></row></body></table>", | |
| isRequired: false, | |
| colCount: 2, | |
| choices: [ | |
| "Straight", | |
| "Pear", | |
| "Hourglass", | |
| "Heart", | |
| "Oval" | |
| ] | |
| }, | |
| { | |
| type: "checkbox", | |
| name: "brand", | |
| title: "Which brand(s) from the below list are you likely to shop from for clothes/accessories you wear to office?", | |
| isRequired: true, | |
| colCount: 2, | |
| choices: [ | |
| "Zara", | |
| "West side", | |
| "AND", | |
| "VanHeusen", | |
| "Allen Solly", | |
| "AND", | |
| "Marks & Spencer", | |
| "H&M", | |
| "Forever 21", | |
| "W" | |
| ] | |
| }, | |
| { | |
| type: "radiogroup", | |
| name: "brandsize", | |
| title: "What size fits best to you when you shop from the above mentioned brand?", | |
| isRequired: false, | |
| colCount: 2, | |
| choices: [ | |
| "XXS", | |
| "S", | |
| "M", | |
| "L", | |
| "XL" | |
| ] | |
| }, | |
| { | |
| type: "radiogroup", | |
| name: "attr", | |
| title: "What is the most important attribute you have in mind when choosing attire for work?", | |
| isRequired: true, | |
| colCount: 2, | |
| choices: [ | |
| "Fit", | |
| "Functionality", | |
| "Aesthetics", | |
| "Comfort", | |
| "Other" | |
| ] | |
| } | |
| ] | |
| } | |
| ] | |
| }; | |
| window.survey = new Survey.Model(json); | |
| survey.showProgressBar = "top"; | |
| survey | |
| .onComplete | |
| .add(function (result) { | |
| // document | |
| // .querySelector('#surveyResult') | |
| // .textContent = "Result JSON:\n" + JSON.stringify(result.data, null, 3); | |
| displayRegister(JSON.stringify(result.data, null, 3)) | |
| }); | |
| jQuery(window).load(function(){ | |
| data = {}; | |
| }); | |
| $(document).ready(function() { | |
| $('a[href="#survey"]').click(function(event) { | |
| event.preventDefault(); | |
| $(this).modal({ | |
| escapeClose: true, | |
| clickClose: true, | |
| showClose: true | |
| }); | |
| $("#surveyElement").Survey({model: survey}); | |
| }); | |
| }); | |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment