Unplanned
Last Updated: 01 Aug 2022 11:07 by ADMIN
Created by: Dominik
Comments: 1
Category: Card
Type: Feature Request
1

Hello,

please provide support for "onError" or something similar for CardImage. If Image.png is not available show NoImage.png.

<img class="" style="" src="@($"https://xyz.blob.core.windows.net/amsmedia/image.png")"

onError="this.src='\NoImage.png'" alt="article photo" />

How can I do the same with CardImage?

 <CardImage Src="@image.Uri.AbsoluteUri" onError="???"></CardImage>

Thanks

Unplanned
Last Updated: 30 Jul 2024 10:06 by Jerome
Created by: Jerome
Comments: 0
Category: Card
Type: Feature Request
1

We have a Telerik card control that uses the Card Image. Upon inspecting the HTML issues, I see that it is missing an alt tag for a few images. When I drill down, these images are from our card image. Is there a plan to add an alt tag?

 

=====ADMIN EDIT======

Possible workaround in the meantime:

<TelerikCard Width="300px">
    <CardHeader>
        <CardTitle>Tourism</CardTitle>
    </CardHeader>
    <img class="k-card-media" alt="test" src="https://docs.telerik.com/blazor-ui/components/card/images/rome.jpg" />
    <CardBody>
        <CardTitle>Rome</CardTitle>
        <CardSubTitle>Capital of Italy</CardSubTitle>
        <CardSeparator></CardSeparator>
        <p>
            Rome is a sprawling, cosmopolitan city with nearly 3,000 years of globally influential art, architecture and culture on display.

            Ancient ruins such as the Forum and the Colosseum evoke the power of the former Roman Empire.
        </p>
    </CardBody>
    <CardActions Layout="@CardActionsLayout.Stretch">
        <TelerikButton Class="k-flat" Icon="@SvgIcon.HeartOutline" Title="Like"></TelerikButton>
        <TelerikButton Class="k-flat" Icon="@SvgIcon.Comment" Title="Comment"></TelerikButton>
        <TelerikButton Class="k-flat">Read More</TelerikButton>
    </CardActions>
    <CardFooter>
        <span style="float:left">Created by @@john</span>
        <span style="float:right">March 05, 2021</span>
    </CardFooter>
</TelerikCard>