How do I render a Boolean to a JavaScript variable in a cshtml file?
Presently this shows a syntax error:
<script type="text/javascript" >
var myViewModel = {
isFollowing: #Model.IsFollowing // This is a C# bool
};
</script>
You may also want to try:
isFollowing: '#(Model.IsFollowing)' === '#true'
and an ever better way is to use:
isFollowing: #Json.Encode(Model.IsFollowing)
Because a search brought me here: in ASP.NET Core, IJsonHelper doesn't have an Encode() method. Instead, use Serialize(). E.g.:
isFollowing: #Json.Serialize(Model.IsFollowing)
The JSON boolean must be lowercase.
Therefore, try this (and make sure nto to have the // comment on the line):
var myViewModel = {
isFollowing: #Model.IsFollowing.ToString().ToLower()
};
Or (note: you need to use the namespace System.Xml):
var myViewModel = {
isFollowing: #XmlConvert.ToString(Model.IsFollowing)
};
var myViewModel = {
isFollowing: '#(Model.IsFollowing)' == "True";
};
Why True and not true you ask... Good question:
Why does Boolean.ToString output "True" and not "true"
A solution which is easier to read would be to do this:
isFollowing: #(Model.IsFollowing ? "true" : "false")
Here's another option to consider, using the !! conversion to boolean.
isFollowing: !!(#Model.IsFollowing ? 1 : 0)
This will generate the following on the client side, with 1 being converted to true and 0 to false.
isFollowing: !!(1) -- or !!(0)
Defining a conversion operation and adding an override of .ToString() can save a lot of work.
Define this struct in your project:
/// <summary>
/// A <see cref="bool"/> made for use in creating Razor pages.
/// When converted to a string, it returns "true" or "false".
/// </summary>
public struct JSBool
{
private readonly bool _Data;
/// <summary>
/// While this creates a new JSBool, you can also implicitly convert between the two.
/// </summary>
public JSBool(bool b)
{
_Data = b;
}
public static implicit operator bool(JSBool j) => j._Data;
public static implicit operator JSBool(bool b) => new JSBool(b);
// Returns "true" or "false" as you would expect
public override string ToString() => _Data.ToString().ToLowerInvariant();
}
Usage
You can directly cast a C# bool, as in the case of the question:
{
// Results in `isFollowing : true`
isFollowing : #((JSBool)Model.IsFollowing)
}
But you can also use a JSBool directly in the Razor code with the expectation that it will give true and false without having to do any extra work:
#{
JSBool isA = true;
JSBool isB = false;
// Standard boolean operations work too:
JSBool isC = a || b;
}
<script>
if (#isC)
console.log('true');
</script>
This works because of the implicit conversion operators we defined above.
Just make sure to only ever use this when you intend to use it in Razor code. In other words, don't use it with normal C# as this can make your code messy.
Related
Variables File:
export class VariableSettings {
public static string_value: string = 'vikas/${id}/data';
}
Other File.
import {VariableSettings} from './variables';
getData(id:string ){
console.log(`${VariableSettings.string_value}`, `${id}`);
// it prints vikas/${id}/data abcd11123
}`
Now I want the result like that "vikas/abcd11123/data". So how can I inject the id in that string.
Any suggestion regarding the same will be appreciated.
Thanks
To use interpolated strings you need to use the `` string separator as you do in your second snippet. If you already used a non interpolated string to hold the value of your setting, there is no way you can then interpolate it using the interpolation feature (you could use a regex to perform replacement but that is a bit messy).
The simplest solution is to make the field a function and have id as a parameter
export class VariableSettings {
public static USER_BOOKINGS = (id: number) => `vikas/${id}/data`;
}
console.log(`${VariableSettings.USER_BOOKINGS(10)}`);
console.log(VariableSettings.USER_BOOKINGS(10)); // Or no interpolation at call site, not needed anymore if you just need the single value
The USER_BOOKINGS will now be a function that takes as arguments the parameters needed to construct the string. This way the parameters needed for the strings are clear and type-safe.
you can try:
public static string_value: string = 'vikas/id/data';
let re = /id/gi;
let newstr = `${VariableSettings.USER_BOOKINGS}`.replace(re, `${id}`);
console.log(newstr);
export class VariableSettings {
id:number;
public static string_value: string;
constructor(){
this.id = 123456
VariableSettings.string_value = `vikas/${this.id}/data`;
}
ngOnInit() {
console.log(VariableSettings.string_value);
}
}
In UI, I create a object and set one of the property as boolean :
function UserObject(componentId, componentName, checkedOut) {
this.componentId = componentId;
this.componentName = componentName;
this.checkedOut = checkedOut; //this is boolean variable
}
But from backend, while I set boolean values in my object, json converts it into string.
private UserObject createUserObject(EntityDTO entity) {
UserObject userObject = new UserObject();
userObject.setComponentId(entity.getEntityId());
userObject.setComponentName(entity.getEntityName());
userObject.setCheckedOut(entity.getCheckedOut());
return userObject;
}
Now, here is the problem, I match some conditions twice (1) while creating (2) later while getting data from backend. Whenever I match the conditions for "checkedOut" object, it fails for the case when object comes from backend:
if(cell.value.checkedOut === true){
//some code
}else{
//some more code
}
What should I do? Thanks in advance :)
if(cell.value.checkedOut === "true"){
//some code
}else{
//some more code
}
As it is a string in json now use double quotes for comparision
if you want to convert string "true or false" to boolean type, use eval():
if(eval(cell.value.checkedOut) === true) {
//some code
} else {
//some more code
}
I have the following script in my ASP.NET MVC Core View:
window["dataSet1"] = [];
#foreach (var item in Model.SelectedOptions)
{
foreach (var item2 in Model.MyChartData)
{
// ".mph" exists in 'MyChartData' model
// This works... but it's not dynamic
#:window["dataSet1"].push(['#item', #item2.mph);
// How can I get a dynamic variable determine
// what field to retrieve from the model?
// Example values for 'SelectedOptions' are:
// > "mph", "kph", "m/s", "knots"
// I'd like this to work...
#:window["dataSet1"].push(['#item', #item2.#item);
}
}
Instead of creating if else statements for each possible 'SelectedOptions' value (mph, kph, m/s, knots etc.), is it possible to simply use a variable to reference a specific object within my model?
The data I get back from my attempt is:
window["dataSet1"].push(['mph', MyProject.Models.MyChartData.mph]);
Rather than a value from my model, for example:
window["dataSet1"].push(['mph', 15.16451]);
You can solve it in c# adding a property using reflection to get the value or a simple case
Example:
#:window["dataSet1"].push(['#item', #item2.correctvalue( item );
In the item2 class:
public decimal correctvalue( propName ) {
return this.GetType().GetProperty(propName).GetValue(this, null);
}
Or more simple:
public decimal correctvalue( propName ) {
if (propName = "mph") {
return this.mph;
}
else ...
}
Keep in mind that you should validate the propName or the reflection will error. More info on using reflection to get the property value
The solution I created, whilst whacking it into a static class so it can be easily accessed in future.
public static object GetPropertyValue(this object myProperty, string propertyName)
{
return myProperty.GetType().GetProperties()
.Single(pi => pi.Name == propertyName)
.GetValue(myProperty, null);
}
I would like to bind a property (flag_baz in this case) from a JSONModel to a checkbox.
Thing is that the json model looks like this.
{
foo: "Foo",
bar:"Bar",
flag_baz : "X"
}
in this case X means "true" and an empty string means "false"
What i would like to do is evaluate a function for binding from model to the checkbox (that would translate "X"/"" to true/false) and evaluate some other function when binding from the checkbox to the model (that would translate from true/false back to "X"/"").
i would like to have something like this:
var checkBox = new Checkbox();
checkBox.bindProperty("checked", "flag_baz", funcFromStringToBool, funcFromBoolToString);
i know the funcFromStringToBool is called a formatter.
how would i add the funcFromBoolToString function?
Hope this makes sense.
Thx in advance.
Well in case some cares i've found the answer on my own.
All bindings can use a type like so
checkBox.bindProperty("checked", {
path : "flag_baz",
type : new BooleanStringType()
});
the BooleanStringType class would look like this:
sap.ui.model.SimpleType.extend("BooleanStringType", {
//called when going from model to ui
formatValue : function(flag_baz){
return flag_baz === "X";
},
//called when going from ui back to the model
parseValue : function(flag_baz){
return flag_baz ? "X" : "";
},
validateValue : function(flag_baz){
//some validation if needed
}
});
How do I render a Boolean to a JavaScript variable in a cshtml file?
Presently this shows a syntax error:
<script type="text/javascript" >
var myViewModel = {
isFollowing: #Model.IsFollowing // This is a C# bool
};
</script>
You may also want to try:
isFollowing: '#(Model.IsFollowing)' === '#true'
and an ever better way is to use:
isFollowing: #Json.Encode(Model.IsFollowing)
Because a search brought me here: in ASP.NET Core, IJsonHelper doesn't have an Encode() method. Instead, use Serialize(). E.g.:
isFollowing: #Json.Serialize(Model.IsFollowing)
The JSON boolean must be lowercase.
Therefore, try this (and make sure nto to have the // comment on the line):
var myViewModel = {
isFollowing: #Model.IsFollowing.ToString().ToLower()
};
Or (note: you need to use the namespace System.Xml):
var myViewModel = {
isFollowing: #XmlConvert.ToString(Model.IsFollowing)
};
var myViewModel = {
isFollowing: '#(Model.IsFollowing)' == "True";
};
Why True and not true you ask... Good question:
Why does Boolean.ToString output "True" and not "true"
A solution which is easier to read would be to do this:
isFollowing: #(Model.IsFollowing ? "true" : "false")
Here's another option to consider, using the !! conversion to boolean.
isFollowing: !!(#Model.IsFollowing ? 1 : 0)
This will generate the following on the client side, with 1 being converted to true and 0 to false.
isFollowing: !!(1) -- or !!(0)
Defining a conversion operation and adding an override of .ToString() can save a lot of work.
Define this struct in your project:
/// <summary>
/// A <see cref="bool"/> made for use in creating Razor pages.
/// When converted to a string, it returns "true" or "false".
/// </summary>
public struct JSBool
{
private readonly bool _Data;
/// <summary>
/// While this creates a new JSBool, you can also implicitly convert between the two.
/// </summary>
public JSBool(bool b)
{
_Data = b;
}
public static implicit operator bool(JSBool j) => j._Data;
public static implicit operator JSBool(bool b) => new JSBool(b);
// Returns "true" or "false" as you would expect
public override string ToString() => _Data.ToString().ToLowerInvariant();
}
Usage
You can directly cast a C# bool, as in the case of the question:
{
// Results in `isFollowing : true`
isFollowing : #((JSBool)Model.IsFollowing)
}
But you can also use a JSBool directly in the Razor code with the expectation that it will give true and false without having to do any extra work:
#{
JSBool isA = true;
JSBool isB = false;
// Standard boolean operations work too:
JSBool isC = a || b;
}
<script>
if (#isC)
console.log('true');
</script>
This works because of the implicit conversion operators we defined above.
Just make sure to only ever use this when you intend to use it in Razor code. In other words, don't use it with normal C# as this can make your code messy.