首页 > 解决方案 > 在 SurveyJS 中完成调查的自定义“呈现”显示值

问题描述

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

我们已经按照这里的描述实现了一个自定义小部件,它运行良好。我们接下来要做的是在测试创建者的调查时更改“调查结果”部分的显示值。换句话说,“签名”问题的结果显示为data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAASwAAADICAYAAABS39xVAAAUGklEQVR4nO3dz28j53kH8PwZFYM6btOGAnIwWpRCe2iLAFSK2IgLUD20PTRa9GL4IiUHF2hBnZxDUuoSyT8623rLxAmpbFdCxaVn15n1luQOC3K7IW1yzRKt6HpEgQfyMOSBGPDy9CC9s8MhJc4MZzjvkN8PwIN3sdrZxerr933meZ/3KwQAEBBf8fsBAACsQmABQGAgsAAgMBBYABAYCCwACAwEFgAEBgILAAIDgQUAgYHAAoDAQGABQGAgsABM1JFGtX6Xav0upZUGHZ1ffm63qhOfYu+Cir0LqvW7fj/2SkBgwcpSRxqJnTPab5bp1tMsbebSFMocUihzSGFRoIiUpJh8rH+2y9mx/47mUhSRkhQWBf3XrYsCbRVPaLci0e1WlWr9LinDgd9...

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

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

标签: surveyjs

解决方案


提交前显示答案预览

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

  • 显示所有问题
  • 显示已回答的问题

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

该功能还可以通过调查设置面板的“导航”部分下的调查创建者 UI 获得。

这是一个例子:

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

渲染上传的图像

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

这是一个例子:

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

推荐阅读