Search code examples
blazor-webassemblyblazor-jsinterop

Can Blazor JavaScript return an array?


I'm trying to get some html element position in javascript and passe it back to the C# but i get that error : Serialization and deserialization of 'System.Type' instances are not supported.

Blazor:

double[] jsResult =  await _jsRuntime.InvokeAsync<double[]>("getBottomOffset", _element);
double bottomOffset = jsResult[0];
double height = jsResult[1];
_resultsStyle = Options.Count * ResultHeight < bottomOffset ? $"top: 0; left: 0; " : $"bottom: -{height}px; left: 0;";

JS :

function getBottomOffset(el) {
const rect = el.getBoundingClientRect();
return [(window.innerHeight - rect.bottom), rect.height];

}


Solution

  • Try using this

    public class data
        {
            public double bottomOffset { get; set; } 
            public double height { get; set; } 
        }
    

    Calling javascript function

    data obj = await _jsRuntime.InvokeAsync<data>("getBottomOffset", _element);
    

    your javascript function

    function getBottomOffset(el) {
        const rect = el.getBoundingClientRect();
        
        return { bottomOffset: (window.innerHeight - rect.bottom), height: rect.height };
    }