Weird NullReferenceException from _Host.cshtml - blazor-server-side

I am using VS2022.
I am getting this error and I didn't think it was possible. :)
Anyone knows what could cause this? I tried to comment out the #RenderBody in my _Layout.cshtml, but the error persists...very weird. Any help is greatly appreciated.
MainLayout.razor
#inherits LayoutComponentBase
<PageTitle>TestCoreRazor</PageTitle>
<div class="page">
<div class="sidebar">
<NavMenu />
</div>
<main>
<div class="top-row px-4">
About
</div>
<article class="content px-4">
#Body
</article>
</main>
</div>
Index.razor
#page "/"
<PageTitle>Index</PageTitle>
<h1>Hello, Developer!</h1>
<p>If you are reading this, you must be building a custom component.</p>

SOLVED!
I found another post that has the same symptom and the culprit is the exactly same:
check the page directive in ALL your page Razor component...you might have a duplicate
If you have recently added a component, check all the values that assigned to the properties of the components have been defined correctly.

Related

Trouble with Google Map API

I am having trouble with getting the Google Map API to function properly. I am getting and error that says "This page can't load Google Maps correctly." I believe my key is set up correctly and I believe the code is correct. I think I need a fresh pair of eyes to correct the issue(s). Any help would be appreciated. The webpage is https://bplsv.com/contact.html
Thank you!
<section class="cd-section">
<div class="cd-block">
<div class="contact-top">
<script async defer src="https://maps.googleapis.com/maps/api/js?key=MY KEY&callback=initMap type="text/javascript"></script>
<div id="cd-google-map">
<div id="google-container"></div>
<div id="cd-zoom-in"></div>
<div id="cd-zoom-out"></div>
<address>7200 Polar Bear<br>San Antonio, Texas 78238</address>
</div>
</div>
</div>
</section>

Fabric UI Core Grid Layout DOES NOT WORK

I have a very simple HTML page that in summary includes the Fabric UI CSS file and has a body (body.ms-Fabric) with
<div class="ms-Grid">
<div class="ms-Grid-row">
<div class="ms-Grid-col ms-sm12 ms-u-md4 ms-lg2">
Column 1
</div>
<div class="ms-Grid-col ms-sm12 ms-md8 ms-lg10">
Column 2
</div>
</div>
</div>
but is displaying two rows instead of the expected two columns
What am I doing wrong?
Am I missing any other CSS include or class?
Thanks
It does work. :)
They seem to have forgotten to update their guide when they included rtl support. Simply add dir="ltr" to the html tag or at least the div parent to .ms-Grid-col
<link href="https://static2.sharepointonline.com/files/fabric/office-ui-fabric-core/9.3.0/css/fabric.min.css" rel="stylesheet" />
<div class="ms-Fabric" dir="ltr">
<div class="ms-Grid">
<div class="ms-Grid-row">
<div class="ms-Grid-col ms-sm6 ms-md4 ms-lg2">A</div>
<div class="ms-Grid-col ms-sm6 ms-md8 ms-lg10">B</div>
</div>
</div>
</div>
I have the same issue here, I dont know why we are missing float left:
.ms-Grid-col{
position:relative;
min-height:1px;
padding-left:8px;
padding-right:8px;
box-sizing:border-box}
[dir=ltr] .ms-Grid-col{float:left}
[dir=rtl] .ms-Grid-col{float:right}
if you add float:left; to .ms-grid-col class then it will be ok

Twitter Bootstrap Alert won't close

I'm using the Twitter Bootstrap Framework for some design parts od my page.
I try to set up an alert that can be closed. My code looks just like that:
<div id="index-alert" class="alert alert-danger .alert-dismissible">
<button type="button" class="close" data-dismiss="alert"><span aria-hidden="true">×</span><span class="sr-only">Close</span></button>
<b>An Error occured</b>
</div>
There is an X at the upper right corner that's clickable, but nothing happens.
The firebug console doesn't give me any errors either.
I'm using the Bootstrap Version 3.2.0
Does anybody know what i'm doing wrong?
Try this
<div id="index-alert" class="alert alert-danger alert-dismissable">
<button type="button" class="close" data-dismiss="alert" aria-hidden="true">×</button>
<b>An Error occured</b>
</div>
If that fails, ensure you have referenced <script src="js/bootstrap.min.js"></script>
You should write alert-dismissible instead of .alert-dismissible ;)
And don't forget to add both jQuery.js and bootstrap.js files before the </body> closing tag. jQuery must be added first:
<script src="/jquery-3.2.1.min.js"></script>
<script src="/bootstrap.min.js"></script>
In case none of these answers workout, you can always put inline javascript inside the HTML tag.
Disclaimer: This is a bad practice and don't write code like this if at all possible.
Now try this out:
<div class="alert alert-info alert-dismissible fade show" role="alert">
<button type="button" class="close" onclick="this.parentElement.style.display='none';"><span>×</span></button> This is a dismissable message.
</div>
I know that the answer may no longer serve you, but the following worked for me:
<div class="alert alert-warning alert-dismissible fade show" role="alert">
<strong>XXXXXX</strong> XXXXXX.
<button type="button" class="btn-close" data-dismiss="alert" aria-label="Close"></button>
</div>

Where is "sf-contener clearfix" end tag? Prestashop 1.5.3.1

I'm working on a project for Prestashop and I have the following file:
blocktopmenu.tpl
https://github.com/PrestaShop/PrestaShop/blob/master/modules/blocktopmenu/blocktopmenu.tpl
I need to know where is the end tag for "sf-contener clearfix" < / div >
Any idea?
Thks and sorry my english!
------ EDITED POST ------
i tried it, but no work for me :(((
I placed "exampleDiv" right here:
header.tpl
<div id="header_right" class="grid_6 omega">
{$HOOK_TOP}
<div id="exampleDiv"></div>
</div>
but i look this result in Firebug:
<div id="header" class="grid_9 alpha omega">
<a id="header_logo" href="#"></a>
<div id="header_right" class="grid_6 omega">
<div id="topMenu_bg_up"></div>
<div class="sf-contener clearfix"></div>
**i wanna to play here :D**
</div>
<div id="minic_slider" class="theme-default"></div>
<div style="display:none;">
<div>
<script type="text/javascript">
<div id="exampleDiv"></div>
**but it work in this other place :(**
</div>
</div>
Here :
https://github.com/PrestaShop/PrestaShop/blob/master/themes/default/header.tpl#L84
The #header_right is closed in blocktopmenu.tpl and the topmenu is displayed under.
Edit : If you want to add content just after the topmenu, the best way is to create e module, hook it on toppage and position it just after the blocktopmenu.

Dijit: Why am I getting an "Uncaught Error: Invalid Template"?

I have a dijit that looks fine as far as I can tell, but it is raising Uncaught Error: Invalid template every time. I have not been able to figure out why. All variables (e.g. ${variableName} are defined in the widget correctly.
Here is the widget:
<div class="${classPrefix}-wrapper">
<div class="${classPrefix} flair" dojoAttachPoint="flairNode"></div>
<div class="${classPrefix}-count hidden" dojoAttachPoint="countWrapperNode">
<div class="count" dojoAttachPoint="countNode">0</div>
</div>
<div class="${classPrefix} ${secondaryClass} action hidden" dojoAttachPoint="secondaryClickNode" dojoAttachEvent="onclick:_onSecondaryClick">
<div class="${classPrefix}-inner"></div>
<div class="${classPrefix}-icon"></div>
</div>
<div class="${classPrefix} ${primaryClass} action" dojoAttachPoint="primaryClickNode" dojoAttachEvent="onclick:_onPrimaryClick">
<div class="${classPrefix}-inner"></div>
<div class="${classPrefix}-icon"></div>
</div>
<div class="${classPrefix}-message hidden" dojoAttachPoint="messageNode"></div>
</div>
<div class="${actionPromptNodeClass}" dojoAttachPoint="actionPromptMessageNode">
<span dojoAttachPoint="actionPromptMessage">${actionPromptText}</span>
<span dojoAttachPoint="actionCompletedMessage" class="hidden">${actionCompletedText</span>
</div>
Found the answer to my question. It turns out that you can only have one root node in a Dijit. I missed this in the docs, but it is at the bottom of this tutorial:
Common Pitfalls
Be sure to only have one root node in your template
Don’t start or end your template with a comment because that means you technically have two nodes
Avoid a trailing </div> at the end of your template
There may be only one root element in the template. Wrap your template into <div></div> and it should work.