Question T3342
Visible to All Users

Surveyjs widgets not loading

created 5 years ago

Hello, I have tried to load the custom widgets using this line:

<script src="https://cdnjs.cloudflare.com/ajax/libs/select2/4.0.4/js/select2.min.js"></script>
<link href="https://cdnjs.cloudflare.com/ajax/libs/select2/4.0.4/css/select2.min.css" rel="stylesheet"/>
<script src="https://surveyjs.azureedge.net/1.5.4/surveyjs-widgets.js"></script>

It works ok in the survey creator but is is not showing in the survey page.
The imports are at the bottom of the body, just before the closing tag. Do you have any idea what can I be missing? What additional information do you require from me to move forward with this?

Thank you very much.

Answers approved by surveyjs Support

created 5 years ago

Hello,

We have the live sample on our site - https://surveyjs.io/Examples/Library?id=custom-widget-select2&platform=jQuery&theme=modern
Have you seen it? Does it work for you?

Thanks, Serge
SurveyJS Team

    Comments (2)

      No sorry, it renders as a normal dropdown for me. It works in my survey creator though. I think I have all the requirements:

      Code
      <script src='{localdir}/jquery-3.4.1.min.js' type="text/javascript"></script>
      Code
      <script src='{localdir}/bootstrap.js' type="text/javascript"></script>
      Code
      <meta name="viewport" content="width=device-width, initial-scale=1">
      Code
      <script src='{localdir}/knockout-debug.js' type="text/javascript"></script>
      Code
      <script src='{localdir}/survey.ko.js' type="text/javascript"></script>
      Code
      <script src='{localdir}/jspdf.min.js' type="text/javascript"></script>
      Code
      <script src="https://surveyjs.azureedge.net/1.5.4/survey.jquery.js"></script>
      Code
      <script src='{localdir}/survey.pdf.min.js' type="text/javascript"></script>
      Code
      <script src='{localdir}/fontawesome.js' type="text/javascript"></script>
      Code
      <script src='{localdir}/showdown.min.js' type="text/javascript"></script>
      Code
      <script>

      var currentSystem = 'captest';
              var csrf_name = "csrf5e3841d032dc7";
              var csrf_value = "0f19442950b5a8c82f1bec4eb5886807";
              var formReadOnly = 'false';
              var CAPUser = 'ietmp19-pmcgarry';
                      var passedFormId = "160090";
              let action = 'modify';
                              var clientId = "1087747";
                      var myCss = {
                  navigationButton: "button btn-success"
              };

      Code
      </script>
      Code
      <script src="/{localdir}/EA_TX_0001_001.js"></script> <!—json definition

      à

      Code
      <script src="https://cdnjs.cloudflare.com/ajax/libs/select2/4.0.4/js/select2.min.js"></script>
      Code
      <link href="https://cdnjs.cloudflare.com/ajax/libs/select2/4.0.4/css/select2.min.css" rel="stylesheet"/>
      Code
      <script src="{localdir}/surveyjs-widgets.js"></script>

      Does it look right?
      Thanks.

        Hi, I’ve managed to get it working.
        I had a wrong order in the import statements.
        Thank you much for your time.