Incorrect display by sfgrid

Hello
I got a problem with the display of the grid in the browser.
The toolbar becomes very large.
I also have the problem with the example of Syncfusion.



3 Replies 1 reply marked as answer

RN Rahul Narayanasamy Syncfusion Team April 21, 2021 12:18 PM UTC

Hi Paul, 

Greetings from Syncfusion. 

Query: Incorrect display by sfgrid - The toolbar becomes very large. 

We have validated your query and checked the reported problem. We could not reproduce the reported problem at our end. The Grid toolbar is rendered properly without the mentioned behavior. Find the below sample and screenshot for your reference. 


 


Also, ensure that you have used latest corresponding CSS reference in your application or not. 

If you are still facing the problem, then could you please share the below details.  

  • Share your _Host.cshtml(if you are using server side application) or Index.html(if you are using client side applciation) file.
  • Did you performed any customization?
  • Whether did you referred any custom CSS reference in your application.
  • Reproduce the problem in the provided sample and revert back to us or share a simple reproduceable sample if possible.

The above provided information will be helpful to validate the  problem and provide a better solution. 

Regards, 
Rahul 



PR Padmini Ramamurthy Syncfusion Team April 22, 2021 12:26 PM UTC

From: Paul Vogt
Sent: Thursday, April 22, 2021 6:20 AM
To: Syncfusion Support <[email protected]>
Subject: WG: Syncfusion support community forum 164684, Incorrect display by sfgrid , has been updated. 
  
Hi, 
 
enclosed our sample project, where you can see the incorrect display of the toolbar. 
 
Have you any idea for me ? 
 
Regards 
Paul Vogt 



RN Rahul Narayanasamy Syncfusion Team April 23, 2021 01:41 PM UTC

Hi Paul, 

Thanks for sharing the details. 

We have validated your problem with the provided sample. We suggest you to move your script codes to body tag of _Host.cshtml file and ensure the problem at your end. Find the below code snippets for your reference. 

[_Host.cshtml] 
 
<script type="text/javascript"> 
    function saveAsFile(filename, bytesBase64) { 
        . . . 
    } 
</script>    à remove this script and move this script to body 
 
<!DOCTYPE html> 
<html lang="en"> 
<head> 
    . . . 
    <link rel='nofollow' href="_content/Syncfusion.Blazor.Themes/fabric.css" rel="stylesheet" /> 
 
</head> 
<body> 
   . . . 
      
 
<script type="text/javascript"> 
    function saveAsFile(filename, bytesBase64) { 
        . . . 
    } 
</script>    //move here  
    <script src="_framework/blazor.server.js"></script> 
</body> 
</html> 


Please let us know if you have any concerns. 

Regards, 
Rahul 


Marked as answer
Loader.
Up arrow icon