在 SurveyJS 中完成调查的显示值的自定义“呈现”

问题描述

我在 SurveyJS 的文档中找不到任何内容。如果有什么我错过了,一个链接会很棒!

我们已经按照 here 的描述实现了自定义小部件,并且运行良好。我们接下来要做的是在测试创建者的调查时更改“调查结果”部分的显示值。换言之,“签名”问题的结果显示data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAASwAAADICAYAAABS39xVAAAUGklEQVR4nO3dz28j53kH8PwZFYM6btOGAnIwWpRCe2iLAFSK2IgluD20PTRa9GL4IiUHF2hBnZxDUuoSyT8623rLxAmpbFdCxaVn15n1luQOC3K7IW1yzRKt6HpEgQfyMOSBGPDy9CC9s8MhJc4MZzjvkN8PwIN3sdrZxerr933meZ/3KwQAEBBf8fsBAACsQmABQGAgsAAgMBBYABAYccwACAwEFgAEBgILAAIDgQUAgYHAAoDAQGABQGAgsABM1JFGtX6Xav0upZUGHZ1ffm63qhOfYu+Cir0LqvW7fj/2SkBgwcpsRxqJnTPab5bp1tMsbebSFMocUihzSGFRoIiUpJh8rH+2y9mx/47mUhSRkhQwbf3XrYsCbRVPaLci0e1WlWr9LinDgd9...

但我们不想这样做,我们想呈现结果……但不是为了签名,而是为了我们的自定义小部件。

另外,是否有在提交前检查您的答案的功能?如果有,我们很可能还需要在此处显示我们的自定义小部件的呈现答案。

解决方法

提交前显示答案预览

SurveyJS 功能可以做到这一点。要启用它,您需要添加一个名为 showPreviewBeforeComplete 的调查级参数。您可以从以下值中进行选择:

  • showAllQuestions
  • showAnsweredQuestions

此功能将自动呈现预览页面上的所有图像或签名。

该功能也可通过调查设置面板的“导航”部分下的调查创建者用户界面使用。

这是一个例子:

{
 "pages": [
  {
   "name": "page1","elements": [
    {
     "type": "signaturepad","name": "question1"
    }
   ]
  }
 ],"showPreviewBeforeComplete": "showAnsweredQuestions"
}

渲染上传的图片

如果您想创建自己的小部件来呈现上传的图像或签名,您可以基于 HTML 小部件。它应该包含一个 <img src='{question1}' /> 标记,其中 src 参数的值应该是您从签名板小部件中检索到的 base64 数据字符串。

这是一个例子:

{
 "pages": [
  {
   "name": "page1","name": "question1"
    }
   ]
  },{
   "name": "page2","elements": [
    {
     "type": "html","name": "question2","html": "<img src='{question1}' />"
    }
   ]
  }
 ]
}