Cart Licenses Contact Support Online Creator Log in/Register
Try
Free
v 1.9.45

Expression Validator with async functions


                        
        
            Survey.StylesManager.applyTheme("bootstrap");
            Survey.defaultBootstrapCss.navigationButton = "btn btn-green";
        

//Function that returns the value on callback async
function isCountryExist(params) {
    if (params.length < 1) return false;
    var countryName = params[0];
    //If the question is empty then do nothing
    if (!countryName) {
        //It doesn't matter what the function returns. The library is wating for this.returnResult(resultValue) callback
        this.returnResult(false);
        return false;
    }
    var self = this;
    //call the ajax method
    $.ajax({url: "https://surveyjs.io/api/CountriesExample?name=" + countryName}).then(function (data) {
        var found = data.length > 0;
        // return the value into the library. Library is waiting for this callback
        self.returnResult(found);
    });
    //May return any value. The library will ignore it.
    return false;
}

// It is important to tell the library that the function is async, the last parameter
// and you will return the value on this.returnResult callback
Survey.FunctionFactory.Instance.register("isCountryExist", isCountryExist, true);

/*
If you do not need to support es5 (IE), then you may use async/await operators
async function isCountryExist(params) {
    if (params.length < 1) return false;
    var countryName = params[0];
    if (!countryName) {
        this.returnResult(false);
        return false;
    }
    var self = this;
    var res = await $.ajax({
        url: "https://surveyjs.io/api/CountriesExample"
    }).then(function(data) {
        var found = false;
        var countries = data;
        for (var i = 0; i < countries.length; i++) {
        if (countries[i].name == countryName) {
            found = true;
            break;
        }
        }
        self.returnResult(found);
    });
    return false;
}
*/

                
                    var json = {
  elements: [
    {
      type: "text",
      name: "country",
      title: "Type a country:",
      validators: [
        {
          type: "expression",
          expression: "isCountryExist({country}) = true",
          text: "Please type the country correctly"
        }
      ]
    },
    {
        type: "comment",
        name: "aboutCountry",
        title: "Please tell us about country: '{country}'",
        visibleIf: "isCountryExist({country}) = true"
    }
  ]
};

                    window.survey = new Survey.Model(json);
                
        
            survey.onComplete.add(function(sender) {
            document.querySelector('#surveyResult').textContent =
            "Result JSON:\n" + JSON.stringify(sender.data, null, 3);
            });
        
        
            var app = new Vue({
            el: '#surveyElement',
            data:
            {
            survey: survey
            }
            });
        

                    
<!DOCTYPE html>
<html lang="en">
<head>
    <title>Expression Validator with async functions, Vue Survey Library Example</title>
    
<meta name="viewport" content="width=device-width" />
    <script src="https://unpkg.com/jquery"></script>
    <script src="https://unpkg.com/vue@2.6.14/dist/vue.js"></script>
    <script src="/DevBuilds/survey-core/survey.core.min.js"></script>
    <script src="/DevBuilds/survey-core/survey.i18n.min.js"></script>
    <script src="/DevBuilds/survey-vue-ui/survey-vue-ui.min.js"></script>
    <link rel="stylesheet" href="https://unpkg.com/bootstrap@3.3.7/dist/css/bootstrap.min.css">
    <link rel="stylesheet" href="./index.css">

</head>
<body style="margin: 0">
    
            <div id="surveyElement" style="display:inline-block;width:100%;">
                <survey :survey='survey' />
            </div>
    <div id="surveyResult"></div>

<script type="text/javascript" src="./index.js"></script>

</body>
</html>

Tell Us What You Think

Help us serve you better by taking this brief survey.
We are interested to learn more about your
experience of using our libraries.

We'd really appreciate your feedback.

Start the Survey

Approximate time to complete: 2 min.