5/1/22 - 6/1/22 - CodeGuru

<style>/*<meta name='google-adsense-platform-account' content='ca-host-pub-1556223355139109'/>
<meta name='google-adsense-platform-domain' content='blogspot.com'/>

<!-- data-ad-client=ca-pub-7262226700898423 -->

</head><body>*/</style>

.net core , blazor

How to Call JavaScript Functions with C# in Blazor-Live Demo

Blazor is a free and open-source web framework that enables developers to create web apps using C# and HTML. It is being developed by Micr...

santosh 26 May, 2022

.net core , blazor

Blazor Advanced Tutorial

List of Blazor Post In this blog post, I will demonstrate some Blazor-related tutorials essential for every developer to be familiar with....

santosh 24 May, 2022

Create Custom Modal Component Using Bootstrap in Blazor

.net core , blazor

Create Custom Modal Component Using Bootstrap in Blazor

This blog will show you how to create Confirmation Modal Dialog in blazor without using any third party. I am using the Microsoft scaffold a...

santosh 19 May, 2022

How to capture reference of another component in Blazor App

.net core , blazor

How to capture reference of another component in Blazor App

This blog post will show you how to reference components in another component. To make the demo simple, I have created a simple contact lis...

santosh 15 May, 2022

.net core , blazor

How To Integrate Fluent Validation in Blazor Application

FluentValidation is a popular validation library for.NET Core. It provides advantages over the DataAnnotations validation system integrat...

santosh 15 May, 2022

How To Add Form Validation In Blazor Application

.net core , blazor

How To Add Form Validation In Blazor Application

This blog post will show you how to add validation in blazor form. Before implementing the validation, you must get familiar with the mos...

santosh 15 May, 2022

.net core , blazor

How To Get Current User in a Blazor component

Let’s assume you have configured Blazor authentication and authorization in your project, and you want to access the username/claim in you...

santosh 14 May, 2022

Build reusable UI components with Blazor-Real World Example

.net core , ASP.NET , blazor

Build reusable UI components with Blazor-Real World Example

One of the most appealing features of blazor is the ability to encapsulate reusable user interface (UI) code into reusable UI components. ....

santosh 14 May, 2022

<style>/*
<script type="text/javascript" src="https://www.blogger.com/static/v1/widgets/4290687098-widgets.js"></script>
<script type='text/javascript'>
window['__wavt'] = 'AOuZoY50Za2aGW4U6_VX8h0C3DElGC32XA:1714977104505';_WidgetManager._Init('//www.blogger.com/rearrange?blogID\x3d6673695286148904603','//www.codeguru.co.in/2022/05/','6673695286148904603');
_WidgetManager._SetDataContext([{'name': 'blog', 'data': {'blogId': '6673695286148904603', 'title': 'CodeGuru', 'url': 'https://www.codeguru.co.in/2022/05/', 'canonicalUrl': 'https://www.codeguru.co.in/2022/05/', 'homepageUrl': 'https://www.codeguru.co.in/', 'searchUrl': 'https://www.codeguru.co.in/search', 'canonicalHomepageUrl': 'https://www.codeguru.co.in/', 'blogspotFaviconUrl': 'https://www.codeguru.co.in/favicon.ico', 'bloggerUrl': 'https://www.blogger.com', 'hasCustomDomain': true, 'httpsEnabled': true, 'enabledCommentProfileImages': true, 'gPlusViewType': 'FILTERED_POSTMOD', 'adultContent': false, 'analyticsAccountNumber': 'UA-162334206-1', 'encoding': 'UTF-8', 'locale': 'en', 'localeUnderscoreDelimited': 'en', 'languageDirection': 'ltr', 'isPrivate': false, 'isMobile': false, 'isMobileRequest': false, 'mobileClass': '', 'isPrivateBlog': false, 'isDynamicViewsAvailable': true, 'feedLinks': '\x3clink rel\x3d\x22alternate\x22 type\x3d\x22application/atom+xml\x22 title\x3d\x22CodeGuru - Atom\x22 href\x3d\x22https://www.codeguru.co.in/feeds/posts/default\x22 /\x3e\n\x3clink rel\x3d\x22alternate\x22 type\x3d\x22application/rss+xml\x22 title\x3d\x22CodeGuru - RSS\x22 href\x3d\x22https://www.codeguru.co.in/feeds/posts/default?alt\x3drss\x22 /\x3e\n\x3clink rel\x3d\x22service.post\x22 type\x3d\x22application/atom+xml\x22 title\x3d\x22CodeGuru - Atom\x22 href\x3d\x22https://www.blogger.com/feeds/6673695286148904603/posts/default\x22 /\x3e\n', 'meTag': '', 'adsenseClientId': 'ca-pub-7262226700898423', 'adsenseHostId': 'ca-host-pub-1556223355139109', 'adsenseHasAds': false, 'adsenseAutoAds': false, 'boqCommentIframeForm': true, 'loginRedirectParam': '', 'view': '', 'dynamicViewsCommentsSrc': '//www.blogblog.com/dynamicviews/4224c15c4e7c9321/js/comments.js', 'dynamicViewsScriptSrc': '//www.blogblog.com/dynamicviews/a26ecadc30bb77e6', 'plusOneApiSrc': 'https://apis.google.com/js/platform.js', 'disableGComments': true, 'interstitialAccepted': false, 'sharing': {'platforms': [{'name': 'Get link', 'key': 'link', 'shareMessage': 'Get link', 'target': ''}, {'name': 'Facebook', 'key': 'facebook', 'shareMessage': 'Share to Facebook', 'target': 'facebook'}, {'name': 'BlogThis!', 'key': 'blogThis', 'shareMessage': 'BlogThis!', 'target': 'blog'}, {'name': 'Twitter', 'key': 'twitter', 'shareMessage': 'Share to Twitter', 'target': 'twitter'}, {'name': 'Pinterest', 'key': 'pinterest', 'shareMessage': 'Share to Pinterest', 'target': 'pinterest'}, {'name': 'Email', 'key': 'email', 'shareMessage': 'Email', 'target': 'email'}], 'disableGooglePlus': true, 'googlePlusShareButtonWidth': 0, 'googlePlusBootstrap': '\x3cscript type\x3d\x22text/javascript\x22\x3ewindow.___gcfg \x3d {\x27lang\x27: \x27en\x27};\x3c/script\x3e'}, 'hasCustomJumpLinkMessage': false, 'jumpLinkMessage': 'Read more', 'pageType': 'archive', 'pageName': '5/1/22 - 6/1/22', 'pageTitle': 'CodeGuru: 5/1/22 - 6/1/22', 'metaDescription': 'Code Guru - A blog where you can find the latest article and source code. The blog covers Angular, Javascript, TypescriptC#, .NET Core, and front-end'}}, {'name': 'features', 'data': {}}, {'name': 'messages', 'data': {'edit': 'Edit', 'linkCopiedToClipboard': 'Link copied to clipboard!', 'ok': 'Ok', 'postLink': 'Post Link'}}, {'name': 'template', 'data': {'name': 'custom', 'localizedName': 'Custom', 'isResponsive': true, 'isAlternateRendering': false, 'isCustom': true}}, {'name': 'view', 'data': {'classic': {'name': 'classic', 'url': '?view\x3dclassic'}, 'flipcard': {'name': 'flipcard', 'url': '?view\x3dflipcard'}, 'magazine': {'name': 'magazine', 'url': '?view\x3dmagazine'}, 'mosaic': {'name': 'mosaic', 'url': '?view\x3dmosaic'}, 'sidebar': {'name': 'sidebar', 'url': '?view\x3dsidebar'}, 'snapshot': {'name': 'snapshot', 'url': '?view\x3dsnapshot'}, 'timeslide': {'name': 'timeslide', 'url': '?view\x3dtimeslide'}, 'isMobile': false, 'title': 'CodeGuru', 'description': 'Code Guru - A blog where you can find the latest article and source code. The blog covers Angular, Javascript, TypescriptC#, .NET Core, and front-end', 'url': 'https://www.codeguru.co.in/2022/05/', 'type': 'feed', 'isSingleItem': false, 'isMultipleItems': true, 'isError': false, 'isPage': false, 'isPost': false, 'isHomepage': false, 'isArchive': true, 'isLabelSearch': false, 'archive': {'year': 2022, 'month': 5, 'rangeMessage': 'Showing posts from May, 2022'}}}, {'name': 'widgets', 'data': [{'title': 'Upload Image', 'type': 'Image', 'sectionId': 'upload-image', 'id': 'Image10'}, {'title': 'Logo', 'type': 'HTML', 'sectionId': 'header-main', 'id': 'HTML10'}, {'title': 'Icons, Dark, Search', 'type': 'LinkList', 'sectionId': 'header-main', 'id': 'LinkList10'}, {'title': 'Menu', 'type': 'LinkList', 'sectionId': 'header-main', 'id': 'LinkList11'}, {'title': '#Advertisement', 'type': 'HTML', 'sectionId': 'before-blog', 'id': 'HTML11'}, {'title': 'Featured Post', 'type': 'FeaturedPost', 'sectionId': 'before-blog', 'id': 'FeaturedPost1', 'postId': '7941086859200934255'}, {'title': '#Advertisement', 'type': 'HTML', 'sectionId': 'before-post', 'id': 'HTML12'}, {'title': 'Blog Posts', 'type': 'Blog', 'sectionId': 'blog-post', 'id': 'Blog1', 'posts': [{'id': '703608251678356204', 'title': 'How to Call JavaScript Functions with C# in Blazor-Live Demo', 'showInlineAds': false}, {'id': '1259097965914078036', 'title': 'Blazor Advanced Tutorial', 'showInlineAds': false}, {'id': '2692890060218426572', 'title': 'Create   Custom Modal Component Using Bootstrap in Blazor', 'featuredImage': 'https://blogger.googleusercontent.com/img/a/AVvXsEi4v3Noh3bh3kjSrnWGwhgPOTM0K56t7gvYsLT9YISbb_sNqX_BufTGMCMwGAil7wRcnNlpvcvkBWgtt7TiE9bRSLsBmVeMa6OtqVAeh1Yi7hQssRcwr3bk_SL0FCQAVJqxH9Lie8-HXMR6WFTa1lZL_ito05OYjmUfH_XGnP5m1z8xVWQ_lhsyDC4_HQ\x3dw640-h218', 'showInlineAds': false}, {'id': '3707773730482251322', 'title': 'How to capture reference of another component in Blazor App', 'featuredImage': 'https://blogger.googleusercontent.com/img/a/AVvXsEgHAxNabPs-CmM2XWGiLFr1NenDSPDsJ5UZXBZY7P_FZ7J7YsL0aD-2PU5HnKYib29MwqpxFOQI9pht_dC_LxdusIZCuCIupbvSJaBrvR9tklrLnqbsMTtpTytzm3U62a0u1BqX1NwGWShfhuZR_A5eagz2Movc3b2a8KxQnzg6SbewGgdoJ5y8Gh-RIg\x3dw400-h136', 'showInlineAds': false}, {'id': '889658240566590677', 'title': 'How To Integrate Fluent Validation in Blazor Application', 'showInlineAds': false}, {'id': '2546432046502691865', 'title': 'How To Add Form Validation In Blazor Application', 'featuredImage': 'https://blogger.googleusercontent.com/img/a/AVvXsEh6lelNQk-YpJ4vKsrKeUNSW4zKYlqNIUnPbA9I7FXC3NvANAuoFCnUWvYr54HEC-ZOqhq5EME19OC8M2gCj6NlNLOsMyaItWMUHd-aM_VccND4ZBX65XsDrwRH-EDqUtJWo9hCGYTRseCLmmjWqZgN0HPB2c6Zwivv5GfdGbZE8DfVEmd6SAl2e7J3qQ\x3dw400-h194', 'showInlineAds': false}, {'id': '99713425760785093', 'title': 'How To  Get Current User in a Blazor component', 'showInlineAds': false}, {'id': '7628734253106929126', 'title': 'Build reusable UI components with Blazor-Real World Example', 'featuredImage': 'https://blogger.googleusercontent.com/img/a/AVvXsEjJOfaz0Zyr0fIblvMECZyiUWwXwUBGbkIbKshwdIG8JZuosnPvEmX84Z-_P7wvLZMDDHC2v0Uc8H584yfeBxwWLr2izzj_AaJWURXRwgGt6yJ992STmATXUOBEet6aMvfsjwMAyJFRSBA_z0iI_ln4aB2GSLzp5lmTVJfGZIBmiHbPvkPRsupvFyVMFA\x3dw640-h218', 'showInlineAds': false}], 'footerBylines': [{'regionName': 'footer1', 'items': [{'name': 'author', 'label': 'by'}, {'name': 'timestamp', 'label': 'd MMM, yyyy'}, {'name': 'comments', 'label': 'Comment'}, {'name': 'icons', 'label': ''}, {'name': 'share', 'label': ''}]}, {'regionName': 'footer2', 'items': [{'name': 'labels', 'label': 'Tags:'}]}], 'allBylineItems': [{'name': 'author', 'label': 'by'}, {'name': 'timestamp', 'label': 'd MMM, yyyy'}, {'name': 'comments', 'label': 'Comment'}, {'name': 'icons', 'label': ''}, {'name': 'share', 'label': ''}, {'name': 'labels', 'label': 'Tags:'}]}, {'title': '#Advertisement', 'type': 'HTML', 'sectionId': 'ads-post', 'id': 'HTML13'}, {'title': '#Advertisement', 'type': 'HTML', 'sectionId': 'ads-post', 'id': 'HTML14'}, {'title': '#You may also like', 'type': 'HTML', 'sectionId': 'ads-post', 'id': 'HTML15'}, {'title': '#Advertisement', 'type': 'HTML', 'sectionId': 'ads-post', 'id': 'HTML16'}, {'title': '#Advertisement', 'type': 'HTML', 'sectionId': 'ads-post', 'id': 'HTML17'}, {'title': 'Popular Posts', 'type': 'PopularPosts', 'sectionId': 'sidebar-static', 'id': 'PopularPosts10', 'posts': [{'title': 'How to create binary search tree in c#', 'id': 664765978891149643}, {'title': 'Vscode Rename Or Change All Instances Of a Variable Everywhere', 'id': 739634734225374594}, {'title': 'State Management in Angular Using NgRx Part 1', 'id': 8518266454812694453}, {'title': 'RSA encryption/decryption C# example', 'id': 7524215632635924991}, {'title': 'C# Dependency Injection  In Constructor With Parameters', 'id': 5084721119584362715}]}, {'title': 'Categories', 'type': 'Label', 'sectionId': 'sidebar-static', 'id': 'Label10'}, {'title': 'Hashtag', 'type': 'Label', 'sectionId': 'sidebar-static', 'id': 'Label11'}, {'title': '#Recent Post', 'type': 'HTML', 'sectionId': 'sidebar-static', 'id': 'HTML19'}, {'title': '#Advertisement', 'type': 'HTML', 'sectionId': 'sidebar-sticky', 'id': 'HTML20'}, {'title': 'About Us', 'type': 'HTML', 'sectionId': 'footer-widget', 'id': 'HTML21'}, {'title': 'Follow Us', 'type': 'LinkList', 'sectionId': 'footer-widget', 'id': 'LinkList14'}, {'title': 'Copyright', 'type': 'HTML', 'sectionId': 'copyright', 'id': 'HTML23'}, {'title': 'SVG Icons', 'type': 'HTML', 'sectionId': 'jet-options', 'id': 'HTML24'}]}]);
_WidgetManager._RegisterWidget('_ImageView', new _WidgetInfo('Image10', 'upload-image', document.getElementById('Image10'), {'resize': false}, 'displayModeFull'));
_WidgetManager._RegisterWidget('_HTMLView', new _WidgetInfo('HTML10', 'header-main', document.getElementById('HTML10'), {}, 'displayModeFull'));
_WidgetManager._RegisterWidget('_LinkListView', new _WidgetInfo('LinkList10', 'header-main', document.getElementById('LinkList10'), {}, 'displayModeFull'));
_WidgetManager._RegisterWidget('_LinkListView', new _WidgetInfo('LinkList11', 'header-main', document.getElementById('LinkList11'), {}, 'displayModeFull'));
_WidgetManager._RegisterWidget('_HTMLView', new _WidgetInfo('HTML11', 'before-blog', document.getElementById('HTML11'), {}, 'displayModeFull'));
_WidgetManager._RegisterWidget('_FeaturedPostView', new _WidgetInfo('FeaturedPost1', 'before-blog', document.getElementById('FeaturedPost1'), {}, 'displayModeFull'));
_WidgetManager._RegisterWidget('_HTMLView', new _WidgetInfo('HTML12', 'before-post', document.getElementById('HTML12'), {}, 'displayModeFull'));
_WidgetManager._RegisterWidget('_BlogView', new _WidgetInfo('Blog1', 'blog-post', document.getElementById('Blog1'), {'cmtInteractionsEnabled': false, 'lightboxEnabled': true, 'lightboxModuleUrl': 'https://www.blogger.com/static/v1/jsbin/1666805145-lbx.js', 'lightboxCssUrl': 'https://www.blogger.com/static/v1/v-css/13464135-lightbox_bundle.css'}, 'displayModeFull'));
_WidgetManager._RegisterWidget('_HTMLView', new _WidgetInfo('HTML13', 'ads-post', document.getElementById('HTML13'), {}, 'displayModeFull'));
_WidgetManager._RegisterWidget('_HTMLView', new _WidgetInfo('HTML14', 'ads-post', document.getElementById('HTML14'), {}, 'displayModeFull'));
_WidgetManager._RegisterWidget('_HTMLView', new _WidgetInfo('HTML15', 'ads-post', document.getElementById('HTML15'), {}, 'displayModeFull'));
_WidgetManager._RegisterWidget('_HTMLView', new _WidgetInfo('HTML16', 'ads-post', document.getElementById('HTML16'), {}, 'displayModeFull'));
_WidgetManager._RegisterWidget('_HTMLView', new _WidgetInfo('HTML17', 'ads-post', document.getElementById('HTML17'), {}, 'displayModeFull'));
_WidgetManager._RegisterWidget('_PopularPostsView', new _WidgetInfo('PopularPosts10', 'sidebar-static', document.getElementById('PopularPosts10'), {}, 'displayModeFull'));
_WidgetManager._RegisterWidget('_LabelView', new _WidgetInfo('Label10', 'sidebar-static', document.getElementById('Label10'), {}, 'displayModeFull'));
_WidgetManager._RegisterWidget('_LabelView', new _WidgetInfo('Label11', 'sidebar-static', document.getElementById('Label11'), {}, 'displayModeFull'));
_WidgetManager._RegisterWidget('_HTMLView', new _WidgetInfo('HTML19', 'sidebar-static', document.getElementById('HTML19'), {}, 'displayModeFull'));
_WidgetManager._RegisterWidget('_HTMLView', new _WidgetInfo('HTML20', 'sidebar-sticky', document.getElementById('HTML20'), {}, 'displayModeFull'));
_WidgetManager._RegisterWidget('_HTMLView', new _WidgetInfo('HTML21', 'footer-widget', document.getElementById('HTML21'), {}, 'displayModeFull'));
_WidgetManager._RegisterWidget('_LinkListView', new _WidgetInfo('LinkList14', 'footer-widget', document.getElementById('LinkList14'), {}, 'displayModeFull'));
_WidgetManager._RegisterWidget('_HTMLView', new _WidgetInfo('HTML23', 'copyright', document.getElementById('HTML23'), {}, 'displayModeFull'));
_WidgetManager._RegisterWidget('_HTMLView', new _WidgetInfo('HTML24', 'jet-options', document.getElementById('HTML24'), {}, 'displayModeFull'));
</script>
</body>*/</style>