surveyjs / surveyjs_angular_cli

SurveyJS + Angular CLI Quickstart Template
http://surveyjs.io/
41 stars 52 forks source link

Autocomplete custom widget #36

Closed ameruddinjamil closed 4 years ago

ameruddinjamil commented 4 years ago

Hi Everyone,

I am using survey-js in my project. One of the requirement, I need to use the autocomplete searching in the survey.

I want to create something similar like this https://www.surveyjs.io/Examples/Library/?id=custom-widget-autocomplete&platform=jQuery&theme=modern

This is my questionnaire json export const seksyenE = { pages: [ { name: 'E', elements: [ { name: "autocomplete1", title: "What car are you driving?", type: "text", choices: [ "None", "Ford", "Vauxhall", "Volkswagen", "Nissan", "Audi", "Mercedes-Benz", "BMW", "Peugeot", "Toyota", "Citroen" ] } ] } ] };

and this is my .ts file import { Component, OnInit } from '@angular/core';

import as Survey from 'survey-angular'; import as widget from 'surveyjs-widgets'; import { seksyenE } from '../../../../shared/questionnaire/seksyenE';

widget.inputmask(Survey); widget.autocomplete(Survey); @Component({ selector: 'app-seksyen-e', templateUrl: './seksyen-e.page.html', styleUrls: ['./seksyen-e.page.scss'], }) export class Questionnaire implements OnInit {

questionnarieModel: any; surveyJson = seksyenE;

constructor( ) { }

ngOnInit() { this.questionnarieModel = new Survey.Model(this.surveyJson); this.questionnarieModel.showQuestionNumbers = 'off'; this.questionnarieModel.showCompletedPage = false;

Survey.StylesManager.applyTheme('bootstrap');
Survey.SurveyNG.render('surveyElement', {
  model: this.questionnarieModel
});

} }

But in the questionnaire, the autocomplete is not working as expected. Kindly advice me how

tsv2013 commented 4 years ago

Can you provide us with a live sample illustrating the issue?