Intersoft Community - WebGrid Enterprise - CSS file to stylize webgrid

CSS file to stylize webgrid

andi@intersoftpt.com — Mon, 12 Jul 2010 09:31:56 GMT

Hi Adam,

Since you are not using SmartWebResources, I will assume that your project is at Local Host instead of File System. In this case, when we disabled, please ensure to create that particular folder as a virtual directory in your IIS. Because when disabled, it will retrieve using the classic physical path through IIS Virtual Directory.

I have tried to create a WebGrid and set the the "EnableWebResources="ResourcesOnly", and tried under you scenario, it seems that it still gave me a fine result in the end. I hope it helps. Thank you and have a nice day.

Best Regards,

Andi Santoso

CSS file to stylize webgrid

aspnet@softwarestudio.com.pl — Fri, 09 Jul 2010 18:03:21 GMT

Hi Andi

ok you have right, but the problem is becouse i want to read images and scripts from from my folder on server not using web resource. How can i this doing? I have create folder /templates/grid/ and i put all scripts and images from webgrid component but is only read at first time after change is loaded from resource...

Thx for help...

Regards

Adam

CSS file to stylize webgrid

andi@intersoftpt.com — Fri, 09 Jul 2010 02:33:55 GMT

Hi Adam,

Forgive me, however I am not able to replicate the issue for you first problem. I have tried using the same code of yours and the image is not changing back after I performed sorting in that specific column. Please ensure that you put those block of code in OnInitializeLayout server side event.

For the second problem, yes what you have written is correct already. Here is the snippet on how to use a class only for the header.

protected void WebGrid1_InitializeLayout(object sender, ISNet.WebUI.WebGrid.LayoutEventArgs e)
{
   WebGrid1.LayoutSettings.HeaderStyle.CssClass = "headerfont";
        
   WebGrid1.LayoutSettings.ImageSettings.SortAscImage = "resume_arrow_up.png";
}

Noted that I have already included the css file in the html page. Here is the snippet as well.

<link href="Default.css" type="text/css" />

I hope it helps. Thank you and have a nice day.

Best Regards,

Andi Santoso

CSS file to stylize webgrid

aspnet@softwarestudio.com.pl — Thu, 08 Jul 2010 20:15:32 GMT

Hi Andy

thanks for you last reply i have try and many thinks works ok, but i have two problems to solved:

1. if i set for example

WebGrid1.LayoutSettings.ImageSettings.SortAscImage = "arrow-up.png";

the arrow show when the page is load, but after header click and back to sort ascending the arow dont show again? Can you help me why ?

2. i set difrent style for each of elements but how can i bind specify css file to webgrid, that be use the class bind as example

WebGrid1.LayoutSettings.CheckedRowStyle.CssClass = "checkedrow_grid";

thanks for help....

regards

adam

CSS file to stylize webgrid

aspnet@softwarestudio.com.pl — Thu, 08 Jul 2010 20:15:30 GMT

Hi Andy

thanks for you last reply i have try and many thinks works ok, but i have two problems to solved:

1. if i set for example

CSS file to stylize webgrid

andi@intersoftpt.com — Mon, 28 Jun 2010 21:59:16 GMT

Hi Adam,

To use the css style class, we will need to decide on what element we wanted to change the style. For example. In my attachment of screenshot, we can change the Header style by setting the CssClass into our .css file.

All the style that can be included in this css file are the one that available for the Header its self. I hope it can help. Thank you and have a nice day.

Best Regards,

Andi Santoso

CSS file to stylize webgrid

aspnet@softwarestudio.com.pl — Mon, 28 Jun 2010 18:22:28 GMT

it possible to set layout of webgrid using only css class? without :

<link rel="stylesheet" href="/ISRes.axd?G/ISMenu.css/707200402" type="text/css" /><link rel="stylesheet" href="/WebResource.axd?d=2z19vlamxvWttyvE1ArClWTflihmOd1b51aw6gplI_hYEYZJnJpPWxQhrroxY-Ew2txaEXXd47qMrNV4_8fpCw2&t=634077193597680000" type="text/css" /><link rel="stylesheet" href="/WebResource.axd?d=2z19vlamxvWttyvE1ArClWTflihmOd1b51aw6gplI_hYEYZJnJpPWxQhrroxY-EwEnZqhXE6qs24pH7c1knCEg2&t=634077193597680000" type="text/css" /><style id="ISWebUI_Styles" type="text/css">
 .W1FE32E{border: #000000 1px solid; border-left-width: 0px; border-top-width:0px; ;} .WGJ26E{overflow:Hidden;overflow-x:Visible;overflow-y:Visible;} .W2IG8GD{overflow:Hidden;overflow-x:Visible;overflow-y:Visible;} div[popupProvider="Intersoft"], div[popupProvider="Intersoft"] *{-moz-box-sizing: border-box;}</style>

how can i this doing ?

thanks

regards

Adam