new to Razor/cshtml. I am facing error, that my if else is now working properly, means that the if is working fine but the else seems not working. my code shown below;
Can someone guide me what am I doing wrong?
#if (ViewBag.role == "Admin")
{
<div id="wrapper">
<div>
some code here
}
else if (ViewBag.role == "AppAdmin")
{
<div>
some code here
</div>
</div>
</div>
It seems that the "else" keyword is not recognized/highlighted, i.e., the above "if" block is not well formatted. Try to exclude all above collapsed blocks (with their possible razor operations) to determine the incorrect one.
Related
How does one conditionally render an HTML element in Razor 2?
For instance, suppose I had the tag
<div class="someclass">
<p>#somevalue</p>
</div>
And I wanted to suppress the <-div-> tag from rendering if the value of #somevalue was equal to 1. Is there a simple way to do this in Razor similar to how I might "hide" the <-div-> tag with Knockout.js in a browser, where I might :
<div class="someclass" data-bind="showWhenTrue: someValue != 1">
<p data-bind="text: someValue"></p>
</div>
At the moment, the best Razor alternative I have is to do this:
#if (someValue != 1) {
<div class="someclass">
<p>#somevalue</p>
</div>
}
There are many ways to do this. First, it should be noted that your knockout code doesn't actually remove the html from output, it just sets its display to hidden.
The razor code you have actually removes the code from the rendered HTML, so that's a very different thing.
To answer your question, we need to know what it is you're trying to achieve. If you just want to hide the display, you can simply do something like this:
<div class="someclass" style="display: #{ somevalue == 1 ? #:"none" : #:"block" };">
<p>#somevalue</p>
</div>
You could also do it with a class:
<div class="someclass #{ somevalue == 1 ? #:"HideMe" : #:"ShowMe" }">
<p>#somevalue</p>
</div>
If you want to remove the code from the output, then you can just do what you've done.. i'm mot sure what you find so objectionable about it... but if you want other alternatives, you could create an Html helper, you could use a razor helper, you could use a Display or EditorTemplate....
The list is actually quite long and i'm just scratching the surface...
An elegant (and re-usable) solution is to write an extension method for Html to do conditional rendering of text ( a bit like IF() in Excel) - e.g.
public static MvcHtmlString ConditionalRender(this HtmlHelper helper, bool condition, string trueString, string falseString = "")
{
return MvcHtmlString.Create((condition) ? trueString : falseString);
}
You can then use it in your code as such:
<div class="someclass" style="display: #Html.ConditionalRender(somevalue == 1, "none","block")">
<p>#somevalue</p>
</div>
I have the following form with some simple validation rules:
<form name="signup_form" novalidate ng-submit="ctrl.signupForm()">
<div class="row">
<input placeholder="Username"
name="username"
ng-model="ctrl.username"
required
ng-minLength=3
ng-maxLength=8>
</div>
<div ng-show="signup_form['username'].dirty &&
signup_form['username'].invalid">
<!-- ... -->
</div>
<button type="submit">Submit</button>
</form>
I would like to display specific error messages for required, ng-minLength and ng-maxLength, but I'm not having success being able to drill down into signup_form['username'].errors to get the specific error.
I can access the errors map just fine in the controller, it is in the markup that I cannot get a handle on the specific error. I would like to be able to do roughly something like this:
<div ng-show="signup_form['username'].errors['minlength'].invalid>
<!-- ... -->
</div>
I.e., something like the following in angularJS:
<div ng-show="signup_form.username.$error.required">This field is required</div>
A working example for
Inspired by this filter I tried this approach again
Angular 0.9.9
#NgFilter(name: 'errors')
class ErrorFilter {
call(val) {
if(val != null) {
return val.map.keys;
}
return null;
}
}
and in the markup
{{signup_form['username'].errors | errors}}
EDIT for Angular 0.9.10
#NgFilter(name: 'errors')
class ErrorFilter {
call(val) {
if(val != null) {
return val.keys;
}
return null;
}
}
and in the markup
{{signup_form['username'].errorStates | errors}}
I learned from the discussions I have observed in the AngularDart Github repo that better solutions are on their way.
related open issue
When this https://github.com/angular/angular.dart/pull/771 is landed
hopefully better solutions are possible.
I have the following code:
{#data.merchantModel}
<div class="address">
{#content $key="content:combinedAddr" merchantAddress1="{merchantAddress1}" merchantAddress2="{merchantAddress2}"/}
</div>
{:else}
<div class="address">{merchantAddress1}</div>
more code...
{/data.merchantModle}
I'm working with Webcore/NodeApp but everything after the {:else} doesn't get rendered. If I comment it out everything is fine. Not sure why webcore doesn't like the {:else} but was wondering if there's another way to write the above code?
Still trying to wrap my head around dust.
Looks like you need to close your content tag and model is misspelled on the closing tag:
{#data.merchantModel}
<div class="address">
{#content $key="content:combinedAddr" merchantAddress1="{merchantAddress1}" merchantAddress2="{merchantAddress2}"/}
</div>
{:else}
<div class="address">{merchantAddress1}</div>
more code...
{/content}
{/data.merchantModel}
I am working with mvc4 and displaying data from my model in to cshtml views.
When setting data in to the markup, I adding it in to div tags.
Is there a way in mvc that if the model property is not set, dont display the div?
Sample of my markup
<div class="myclass"> #Model.Text </div>
You can test for a value being set like so:
#if (!string.IsNullOrEmpty(Model.Text))
{
<div class="myclass"> #Model.Text </div>
}
Update: If you want to incorporate the logic for whether or not to render an element based on its value, you could create a Custom HTML Helper method.
How about wrapping it in a null check
#{
if (#Model.Text != null)
{
<div class="myclass"> #Model.Text </div>
}
}
I want to show a piece of Razor markup as a text example on a page. I need to show following code (for example)
<div class="editor-wrap">
<div class="editor-label">
<text>
#Html.LabelFor( model => model.StartDate, new { data_tooltip_message = "Some text" } )
</text>
</div>
</div>
so I have regular Html plus Razor markup, I know that to show Html you have to wrap it with
<XMP>
tag, but Razor is parsing its markup anyway and is throwing exception where I want it only to display plain text. Thanks in advance
<XMP> is not recommended actually. Something like <code> or <pre> is preferred. Alternatively you can HTML encode the text so that it's rendered the way you expect on the page..
Update: Sorry, I see what your trying to do now. The tag only tells the browser to stop parsing HTML, but razor still tries to parse it's code because of the # character. To get around this escape the character by putting a second # in there.
<xmp>
<div class="editor-wrap">
<div class="editor-label">
<text>
##Html.LabelFor( model => model.StartDate, new { data_tooltip_message = "Some text" } )
</text>
</div>
</div>
</xmp>