regarding Dropdownlist (with virtual scrolling enabled) which is initialised by kendo.init

[Kian Hin]

 

 

<script type="text/x-kendo-template" id="gDropdownListTemplate">
    # var required = typeof options.required === 'undefined' ? false : options.required; #
    # var isRemote = typeof options.isRemote === 'undefined' ? false : options.isRemote; #
    # var filterable = typeof options.filterable === 'undefined' ? true : options.filterable; #
    # var enable = typeof options.enable === 'undefined' ? true : options.enable; #

    <input 
        required="#= required ? 'required': '' #"
        id="#= options.key #" 
        name="#= options.key #" 
        data-role="dropdownlist" 
        data-value-primitive="true"
        data-text-field="label" 
        data-value-field="value"
        data-filter="#= isRemote && filterable ? 'contains' :'none' #"
        data-index="#= options.index || -1 #"
        data-auto-bind="#= options.autoBind #"
        data-option-label="#= options.optionLabel || '' #"
        data-enable="#= enable #"
        data-min-length="#= options.minLength || 1 #"
        data-value="#= options.value || '' #"
        data-change="#= options.change #"
        data-bound="#= options.dataBound #"
        data-source="#= options.dataSource #"
        data-required-msg="#= $.gForm.requiredMessage #"
        data-height="#= isRemote ? 250 : 200 #" 
        data-virtual="#= options.virtual ? '{ itemHeight: 32, valueMapper: $.gCommon.valueMapper }' : false #"
    />
</script>
 
 
when autobind is true (isEdit=false), the api is triggered, but no loading effect 
 
when autobind is false, then manually set the value .
 the api is not triggered.
 
but if I disable virtual scrolling, everything works fine....
 
plus if I do it in this way, it works , too
 
 

 

[Kian Hin]

my scenario is using this dropdownlist in a dialog. 

there is a button "create", after clinking on it, open a dialog, then init form

[Martin]

Hello, Kian,

Based on the provided code snippets, I cannot assemble a runnable example where I can observe the issues you are experiencing. Would it be possible to provide an example/project where I can debug? Also, in the code snippets I cannot see the valueMapper function.

In the meantime, you can check our Virtualization demo, along with our Virtualization documentation so that you can compare your configuration to see if everything is set correctly. 

Looking forward to your reply.

Regards,
Martin
Progress Telerik

[Kian Hin]

 

https://dojo.telerik.com/dQrqmKsQ/3

 

 

I found that removing <form> html markup could solve the problem...

[Kian Hin]

you can see when opening the dialog, no loading effect. after removing <form>, loading effect will work

[Martin]

Hello, Kian,

I am still not sure what the issue is, based on the provided example. I don't see any difference in the example after removing the form tag. Kindly elaborate a bit more how to reproduce the issue, and what the expected result is, so that we can assist you on the matter. Thank you in advance for the cooperation.

[Kian Hin]

there is no loading circle if the form html markup has  data-role="form"