Who can i set width and high include any images?

hello sir:

I Have a question in my code,can you help me now?

I upload an Image in html ,is that

in grid ,is that. who can i set  width and high include any images?  I asked for help. 

<div class="col-lg-12 control-section">

    <div class="content-wrapper">

        <div class="row">

            <SfGrid DataSource="@oGot" AllowGrouping="true" AllowSorting="true" AllowFiltering="true" AllowPaging="true" ShowColumnMenu="true" @ref="DefaultGrid" Toolbar="@(new List<string>() { "Search" })" AllowResizing="true">

                <GridGroupSettings Columns="@GroupedColumns"></GridGroupSettings>

                <GridFilterSettings Type="@Syncfusion.Blazor.Grids.FilterType.CheckBox"></GridFilterSettings>

                <GridEditSettings AllowAdding="true" AllowDeleting="true" AllowEditing="true"></GridEditSettings>

                <GridColumns>

                    <GridColumn AutoFit="true">

                        <Template>

                            @{

                                var ticket = (context as Cim100);

                                <SfButton @ref="EditBtnResolved" @onclick="@((args) => onToggleClick_Resolved(args,ticket))" IsToggle="true" IsPrimary="true">√</SfButton>

                            }

                        </Template>

                    </GridColumn>

                    <GridColumn Field=@nameof(Cim100.Id) HeaderText="序號" TextAlign="TextAlign.Right" Visible="false"></GridColumn>

                    <GridColumn Field=@nameof(Cim100.Department) HeaderText="單位" AutoFit="true"></GridColumn>

                    <GridColumn Field=@nameof(Cim100.Creater) HeaderText="創立人" AutoFit="true"></GridColumn>


                    <GridColumn Field=@nameof(Cim100.CreateDate) HeaderText=" 建檔時間" Format="d" Type="ColumnType.Date" TextAlign="TextAlign.Right" AutoFit="true"></GridColumn>

                    <GridColumn Field=@nameof(Cim100.AbnormalInformTime) HeaderText="發生時間" AutoFit="true"></GridColumn>

                    <GridColumn Field=@nameof(Cim100.TransferTime) HeaderText="轉交現場時間" AutoFit="true"></GridColumn>

                    <GridColumn Field=@nameof(Cim100.Symptoms) HeaderText="問題" AutoFit="true"></GridColumn>

                    <GridColumn Field=@nameof(Cim100.Tactics) HeaderText="手法" AutoFit="true"></GridColumn>

                    <GridColumn Field=@nameof(Cim100.Executor) HeaderText="執行人" AutoFit="true"></GridColumn>

                    <GridColumn Field=@nameof(Cim100.Flag) HeaderText="完成|未完成" AutoFit="true" Visible="false"></GridColumn>

                    <GridColumn Field=@nameof(Cim100.Event) HeaderText="事件" AutoFit="true" Visible="false"></GridColumn>

                    <GridColumn HeaderText="圖片" TextAlign="TextAlign.Center" AutoFit="false">

                        <Template>

                            @{

                                var Cim100 = (context as Cim100);

                                <div class="image">

                                    <img src="@Cim100.Status" asp-append-version="true" width="auto" />

                                </div>

                            }

                        </Template>

                    </GridColumn>

                    <GridColumn HeaderText="Manage Records" AutoFit="true">

                        <GridCommandColumns>

                            <GridCommandColumn Type="CommandButtonType.Edit" ButtonOption="@(new CommandButtonOptions() {IconCss="e-icons e-edit", CssClass="e-flat" })"></GridCommandColumn>

                            <GridCommandColumn Type="CommandButtonType.Delete" ButtonOption="@(new CommandButtonOptions() {IconCss="e-icons e-delete", CssClass="e-flat" })"></GridCommandColumn>

                            <GridCommandColumn Type="CommandButtonType.Save" ButtonOption="@(new CommandButtonOptions() {IconCss="e-icons e-save", CssClass="e-flat" })"></GridCommandColumn>

                            <GridCommandColumn Type="CommandButtonType.Cancel" ButtonOption="@(new CommandButtonOptions() {IconCss="e-icons e-cancel-icon", CssClass="e-flat" })"></GridCommandColumn>

                        </GridCommandColumns>

                    </GridColumn>

                </GridColumns>

            </SfGrid>

        </div>

    </div>

</div>


1 Reply 1 reply marked as answer

JP Jeevakanth Palaniappan Syncfusion Team August 10, 2021 05:36 AM UTC

Hi Wen-Ting Zhuang, 

Greetings from Syncfusion support. 

We have validated your query and you can set the height and width for the images by using the image class present in the image div. Please refer the below documentation in which we have specified the height and width in the style tag. 


Get back to us if you have any other queries. 

Regards, 
Jeevakanth SP. 


Marked as answer
Loader.
Up arrow icon