--- title: Pain Assessment Form product: PDF Generator description: Download a printable pain assessment form in PDF. Create editable or prefilled patient pain evaluation forms with SurveyJS PDF Generator. framework: Vanilla JS source: https://surveyjs.io/pdf-generator/examples/pdf-healthcare-pain-assessment-form-template/vanillajs index: https://surveyjs.io/pdf-generator/examples/overview.md --- # Pain Assessment Form (Vanilla JS) ## Files ### `public/index.html` ```html
``` ### `src/index.css` ```css /* You can add your custom CSS here. */ ``` ### `src/index.js` ```js import { Model } from "survey-core"; import "survey-js-ui"; import { SurveyPDF } from "survey-pdf"; import "survey-core/survey-core.min.css"; import "./index.css"; import { json } from "./json"; function createSurveyPdfModel (surveyModel) { const surveyPDF = new SurveyPDF(json); if (surveyModel) { surveyPDF.data = surveyModel.data; surveyPDF.locale = surveyModel.locale; } return surveyPDF; } function saveSurveyToPdf (filename, surveyModel) { const pdfDoc = createSurveyPdfModel(surveyModel); if (!pdfDoc) return; pdfDoc.save(filename); } const previewDiv = document.getElementById("pdf-preview"); const previewEmbed = document.getElementById("pdf-preview-frame"); let pdfBlobUrl; function showPdfPreview(surveyModel) { if (!previewDiv || !previewEmbed) return; const pdfDoc = createSurveyPdfModel(surveyModel); if (!pdfDoc) return; pdfDoc.raw("blob").then((blob) => { if (pdfBlobUrl) { URL.revokeObjectURL(pdfBlobUrl); } pdfBlobUrl = URL.createObjectURL(blob); previewEmbed.setAttribute("src", pdfBlobUrl); previewDiv.style.display = "block"; }); } function previewPdf(surveyModel) { if (!previewDiv) return; if (previewDiv.style.display !== "none") { previewDiv.style.display = "none"; return; } showPdfPreview(surveyModel); } const survey = new Model(json); survey.showCompleteButton = false; survey.navigationButtonsLocation = "topBottom"; survey.addNavigationItem({ id: "survey_save_as_file", title: "Download PDF", action: () => { saveSurveyToPdf("surveyResult.pdf", survey); } }); survey.addNavigationItem({ id: "survey_pdf_preview", title: "Preview PDF", visible: window.navigator.pdfViewerEnabled, action: () => { previewPdf(survey); } }); survey.render(document.getElementById("surveyElement")); ``` ### `src/json.js` ```js export const json = { "title": "Pain Assessment Form", "description": "Cognitively Intact", "pages": [ { "name": "patient-details", "questionTitleWidth": "110px", "questionTitleLocation": "left", "title": "Patient details", "elements": [ { "type": "text", "name": "full-name", "title": "Full name" }, { "type": "text", "name": "id-number", "startWithNewLine": false, "title": "ID #" }, { "type": "text", "name": "health-care-provider", "title": "Health care provider" }, { "type": "text", "name": "room-number", "startWithNewLine": false, "title": "Room #" }, { "type": "text", "name": "assessment-date", "title": "Assessment date", "inputType": "date" }, { "type": "text", "name": "time", "startWithNewLine": false, "title": "Time", "inputType": "time" } ] }, { "name": "pain-assessment", "title": "Pain assessment", "elements": [ { "type": "radiogroup", "name": "pain-control-goal", "title": "Individual's pain control goal", "choices": [ "Sleep comfortably", "Comfort at rest", "Comfort with movement", "Total pain control", "Stay alert", "Perform desired activities" ], "showOtherItem": true, "otherText": "Other (please specify)", "colCount": 2 }, { "type": "rating", "name": "pain-intensity-goal", "title": "Individual's pain intensity goal", "rateCount": 10, "rateMax": 10, "minRateDescription": "No pain", "maxRateDescription": "Worst pain imaginable" }, { "type": "text", "name": "current-diagnosis", "title": "Current pain-related diagnosis(es)" }, { "type": "radiogroup", "name": "assessment-reason", "title": "Reason for assessment", "choices": [ "MDS admission", "MDS significant change", "MDS readmission", "MDS quarterly", "MDS annual", "New condition", "Routine monitoring" ], "colCount": 2 }, { "type": "radiogroup", "name": "pain-type", "title": "Type of pain", "choices": [ "Nociceptive (Joint/bone/soft tissue)", "Neuropathic", "Mixed" ], "colCount": 2 }, { "type": "panel", "name": "depression-panel", "title": "Depression", "description": "Please provide details regarding depression symptoms if applicable.", "elements": [ { "type": "radiogroup", "name": "depression-scale", "title": "Scale", "choices": [ "1-5 (no depression)", "6-10 (mild)", "11-15 (moderate)", "16-20 (severe)" ], "colCount": 2 }, { "type": "radiogroup", "name": "depression-score", "title": "Score", "choices": [ "0 to 4 points", "5 to 9 points", "10 to 14 points", "15 to 19 points", "20 to 27 points" ], "colCount": 2 }, { "type": "text", "name": "depression-diagnosis-date", "title": "Diagnosis date", "inputType": "date" } ] }, { "type": "rating", "name": "rate-severity", "title": "Intensity of Pain", "description": "Rate the severity of your pain.", "rateCount": 11, "rateMin": 0, "rateMax": 10, "minRateDescription": "No pain", "maxRateDescription": "Worst pain possible" }, { "type": "imagepicker", "name": "faces-pain-scale", "title": "Faces pain scale", "description": "Choose the face that best describes how you are feeling.", "choices": [ { "value": "Item 1", "imageLink": "https://api.surveyjs.io/private/Surveys/files?name=952dd683-462a-4903-a33b-d35492c36a43" }, { "value": "Item 2", "imageLink": "https://api.surveyjs.io/private/Surveys/files?name=f95c1e74-8404-4d95-bf18-66ea0bd437fc" }, { "value": "Item 3", "imageLink": "https://api.surveyjs.io/private/Surveys/files?name=053e9a2f-9f43-42e1-8f40-214372a63efd" }, { "value": "Item 4", "imageLink": "https://api.surveyjs.io/private/Surveys/files?name=afa9a3a8-d07e-4c7d-b24b-785387ec6bab" }, { "value": "Item 5", "imageLink": "https://api.surveyjs.io/private/Surveys/files?name=2fee0fae-1af2-47cd-88fd-b99f6cd99946" }, { "value": "Item 6", "imageLink": "https://api.surveyjs.io/private/Surveys/files?name=df1906f8-d7c5-4507-96e2-b43e9c05270f" } ], "imageFit": "cover", "minImageWidth": 120, "minImageHeight": 100, "maxImageWidth": 240, "maxImageHeight": 200 }, { "type": "radiogroup", "name": "verbal-descriptor", "title": "Verbal descriptor scale", "description": "Select the words that best represent the intensity of your pain now.", "choices": [ "No pain", "Mild pain", "Moderate pain", "Severe pain", "Extreme pain", "Pain as bad as could be" ], "colCount": 2 }, { "type": "panel", "name": "pain-location-panel", "questionTitleLocation": "hidden", "title": "Pain location", "description": "Mark the areas where you feel pain. If you feel more than one sensation in the same area, mark that area with all applicable symbols. Make sure to mark all affected areas.", "elements": [ { "type": "signaturepad", "name": "pain-type-marks", "maxWidth": "30%", "signatureWidth": 213, "signatureHeight": 292, "showPlaceholder": false, "backgroundImage": "https://api.surveyjs.io/private/Surveys/files?name=6de9d008-5f99-459f-a01b-3c8e272666ef", "waitForUpload": true }, { "type": "signaturepad", "name": "pain-location-body", "startWithNewLine": false, "signatureWidth": 957, "signatureHeight": 676, "signatureAutoScaleEnabled": true, "showPlaceholder": false, "backgroundImage": "https://api.surveyjs.io/private/Surveys/files?name=4fa86ea3-7a97-4344-9857-06ee6c9fe630", "penColor": "#f01919", "waitForUpload": true } ] } ] }, { "name": "pain-history", "elements": [ { "type": "panel", "name": "pain-history-panel", "title": "History of pain", "elements": [ { "type": "radiogroup", "name": "pain-onset", "title": "Onset of pain", "choices": [ "New (last 7 days)", "Recent (last 3 months)", "More distant (> 3 months)", "Unknown" ], "colCount": 2 }, { "type": "radiogroup", "name": "pain-frequency", "title": "Frequency of pain", "choices": [ "Constant", "Frequent", "Infrequent", "Unknown" ], "colCount": 2 }, { "type": "checkbox", "name": "pain-description", "title": "Description of pain", "choices": [ "Aching", "Burning", "Cramping", "Crushing", "Dull", "Numbness", "Pins & Needles", "Sharp", "Shooting", "Throbbing" ], "showOtherItem": true, "otherText": "Other (please describe)", "colCount": 2, "maxSelectedChoices": 3, "minSelectedChoices": 1 }, { "type": "radiogroup", "name": "pattern-change", "title": "Change in pattern of pain", "description": "Has the pain changed in description or intensity the last 7 days?", "choices": [ "Yes", "No", "Unknown" ], "otherText": "Other (please describe)", "colCount": 2 }, { "type": "comment", "name": "pattern-change-description", "title": "Describe how your pain pattern has changed if you indicated 'Yes' above", "rows": 2, "autoGrow": true }, { "type": "radiogroup", "name": "what-increases-pain", "title": "What causes or increases the pain?", "choices": [ "Movement", "Coughing", "Cold", "Heat", "Fatigue", "Anxiety" ], "showOtherItem": true, "otherText": "Other (please describe)", "colCount": 2 }, { "type": "radiogroup", "name": "what-relieves-pain", "title": "What relieves the pain?", "choices": [ "Cold", "Heat", "Exercise", "Eating", "Opioids", "Non-opioid meds", "Adjuvants", "Herbals", "Massage", "Relaxation", "Rest", "Repositioning", "Distraction" ], "showOtherItem": true, "otherText": "Other (please specify)", "colCount": 2 }, { "type": "comment", "name": "pain-medication-history", "title": "Pain medication history", "maxLength": 250, "rows": 2, "autoGrow": true }, { "type": "matrix", "name": "pain-effects", "title": "Effects of pain", "description": "Using the following scale, rate how the pain has had an effect in each area in the past 24 hours.", "showCommentArea": true, "commentText": "", "alternateRows": true, "rowTitleWidth": "250px", "columns": [ { "value": "Column 1", "text": "0 (no effect)" }, { "value": "Column 2", "text": "2 (mild effect)" }, { "value": "Column 3", "text": "5 (moderate effect)" }, { "value": "Column 4", "text": "10 (severe effect)" } ], "rows": [ { "value": "Row 1", "text": "Accompanying symptoms (e.g., nausea)" }, { "value": "Row 2", "text": "Sleep disturbance" }, { "value": "Row 3", "text": "Appetite change" }, { "value": "Row 4", "text": "Physical activity change" }, { "value": "Row 5", "text": "Mood/behavior" }, { "value": "Row 6", "text": "Concentration" }, { "value": "Row 7", "text": "Relationship with others" }, { "value": "Row 8", "text": "Other (please describe below)" } ], "eachRowRequired": true }, { "type": "rating", "name": "worst-pain-lately", "title": "Worst pain in 24 hours", "rateCount": 11, "rateMin": 0, "rateMax": 10, "minRateDescription": "No pain", "maxRateDescription": "Worst pain possible" }, { "type": "rating", "name": "recent-medication-effectiveness", "title": "In the past 24 hours, how much have the medications or treatments eased your pain?", "rateCount": 11, "rateMin": 0, "rateMax": 10, "minRateDescription": "No relief", "maxRateDescription": "Complete relief" }, { "type": "radiogroup", "name": "plan", "title": "Plan for addressing pain", "showCommentArea": true, "commentText": "Comments:", "choices": [ "Initiate pain management flow sheet", "Call Prescriber", "Refer to pain team", "Rehab referral (PT, OT, ST)", "Non-med intervention", "Medications prescribed", "Spiritual counseling", "Staff education/communication" ], "showOtherItem": true, "colCount": 2 } ] }, { "type": "signaturepad", "name": "signature", "maxWidth": "50%", "title": "Signature of person completing assessment", "signatureHeight": 100, "waitForUpload": true }, { "type": "text", "name": "title", "maxWidth": "30%", "startWithNewLine": false, "title": "Title" }, { "type": "text", "name": "date", "maxWidth": "20%", "startWithNewLine": false, "title": "Date", "inputType": "date" } ] } ], "showPrevButton": false, "questionsOnPageMode": "singlePage", "headerView": "advanced" }; ``` ### `src/theme.js` ```js export const themeJson = {}; ``` ### `package.json` ```json { "dependencies": { "survey-core": "latest", "survey-js-ui": "latest", "survey-pdf": "latest" } } ``` ## Other Frameworks - [Angular](https://surveyjs.io/pdf-generator/examples/pdf-healthcare-pain-assessment-form-template/angular.md) - [React](https://surveyjs.io/pdf-generator/examples/pdf-healthcare-pain-assessment-form-template/reactjs.md) - [Vue 3](https://surveyjs.io/pdf-generator/examples/pdf-healthcare-pain-assessment-form-template/vue3js.md) - [jQuery](https://surveyjs.io/pdf-generator/examples/pdf-healthcare-pain-assessment-form-template/jquery.md)