i have a form that is being loaded with the use of schema-form, in that form i have a field MaxCardshis value is the value from db, and it can be null in the server-side i transformed null to -1
MaxCards = domainColumn.MaxCards.HasValue ? domainColumn.MaxCards.Value : -1
When the value -1 is loaded i dont want to show it in the form UI, instead i want to show an empty string.
How can I achieve it?
this is how i load the form: (Key: MaxCards is the field that i am talking about)
vm.form = [{
key: 'Name',
readonly: false
}, {
key: 'MaxCards',
readonly: false,
fieldHtmlClass: "editColumnModel-maxCards"
}, {
key: 'Description',
readonly: false,
type: 'textarea'
}];
You can try, replacing your -1 values, though I would suggest you to return blank space from your service/controller instead of -1 (null) if the type safety is not a concern.
{{ domainColumn.MaxCards.Value.replace('-1', ' ') }}
Or
$scope.domainColumn.MaxCards.Value.replace('-1', ' ');
I have not tested this nor I am sure what values your code returns, so please feel free to tweak this code a little.
Related
I got to implement a simple search (or it was that to my mind), the field I'm searching for is called "paymentStatus" on an Invoice and it's basically a boolean value in a mongo db (v3.4). The search comes from angular-formly input field (angularJS 1.6), and I can see it logged quite easily , as "paymentStatus - true", and "paymentStatus-false" when I send the info to search for -
{ paymentStatus: true }
Formly field looks like this -
{
key: 'paymentStatus',
type: 'horizontal-ui-select',
className: 'tooltipLabel',
templateOptions: {
optionsAttr: 'bs-options',
ngOptions: 'option[to.valueProp] as option in to.options | filter: $select.search',
label: $filter('translate')('Payment Status'),
placeholder: $filter('translate')('Payment Status'),
valueProp: 'paymentStatus',
labelProp: 'name',
searchable: true,
tooltipClass: 'wide-tooltip',
options: [
{"paymentStatus": true, "name": 'Paid'},
{"paymentStatus": false, "name": 'Unpaid'},
]
}
},
In the controller for backend to fill up the table with data to be displayed (which works correctly),
I have additional code for search filter which is like this -
if (where.paymentStatus && where.paymentStatus !== null && where.paymentStatus !== undefined) {
mongoQuery[0].$match["$and"].push({"paymentStatus": {$in: where.paymentStatus}});
}
I tried playing with $eq instead of $in and basic true false toggles instead of "where.paymentStatus" which give me half result half the time. "where" is from request.allParams().data.where. I'm a beginner with DB work/searches, especially with mongo and angular JS formly. It's legacy code that's sparsely documented. Thanks for all the help.
Never mind, where.paymentStatus annuled my querying for false status. Replaced $in with $eq also. Works properly now.
see the code below.
i am new in angular. just do not understand this line
{{ (fields | filter : {fieldName:"houseNum"} : true)[0].fieldLabel}}
what is the meaning of true in bracket if we specify false like ({{ (fields | filter : {fieldName:"houseNum"} : false)[0].fieldLabel}}) then what will happen ?
Full code
<div ng-app="app" ng-controller="ctrl">
{{ (fields | filter : {fieldName:"houseNum"} : true)[0].fieldLabel}}
</div>
angular.module('app', []).controller('ctrl', function($scope) {
$scope.fields = [{
fieldName: 'houseNum',
fieldLabel: 'House Number',
disabled: false
}, {
fieldName: 'street',
fieldLabel: 'Street',
disabled: false
}, {
fieldName: 'city',
fieldLabel: 'City',
disabled: true
}, {
fieldName: 'state',
fieldLabel: 'State',
disabled: true
}, ]
})
sample taken from https://jsfiddle.net/tridip/q2r3cogj/
According to the AngularJS documentation:
Comparator which is used in determining if values retrieved using expression
(when it is not a function) should be considered a match based on the the
expected value (from the filter expression) and actual value (from the object
in the array).
Can be one of:
function(actual, expected): The function will be given the object value and
the predicate value to compare and should return true if both values should be
considered equal.
true: A shorthand for function(actual, expected) { return
angular.equals(actual, expected)}. This is essentially strict comparison of
expected and actual.
false: A short hand for a function which will look for a substring match in a
case insensitive way. Primitive values are converted to strings. Objects are
not compared against primitives, unless they have a custom toString method
(e.g. Date objects).
Defaults to false.
So setting it to true requires an exact match for the item to be shown. A false setting will allow for partial matches, case insensitive matches, etc.
I am using ng-admin to write a admin management. I met below issue, can somebody help me?
In my creationView, I would like to show different fields(text/video/pictures) according to the selection of "type" field. How I can make it?
var articles = nga.entity('articles');
articles.creationView().fields([
nga.field('type','choice')
.validation({ required: true })
.choices([
// 1: txt, 2: pic, 3: vid
{ value: 1, label: 'Text'},
{ value: 2, label: 'Picture'},
{ value: 3, label: 'Video'},
]),
nga.field('txt','file')
.attributes({ placeholder: 'Write something... !' }),
nga.field('pic','file')
.label('Picture(.jpg|.png)')
.uploadInformation({ 'url': '/api/adminapi/uploadPicture', 'apifilename': 'pictures', 'accept': 'image/jpg,image/png'}),
nga.field('vid','file')
.label('Video(.mp4)')
.uploadInformation({ 'url': '/api/adminapi/uploadVideo', 'apifilename': 'video', 'accept': 'video/mp4'}),
])
The Field Configuration doc page explains how to do this using the "template" field config:
template(String|Function, templateIncludesLabel=false) All field types
support the template() method, which makes it easy to customize the
look and feel of a particular field, without sacrificing the native
features.
...
To force the template to replace the
entire line (including the label), pass true as second argument to the
template() call. This can be very useful to conditionally hide a field
according to a property of the entry:
post.editionView()
.fields([
nga.field('category', 'choice')
.choices([
{ label: 'Tech', value: 'tech' },
{ label: 'Lifestyle', value: 'lifestyle' }
]),
nga.field('subcategory', 'choice')
.choices(function(entry) {
return subCategories.filter(function (c) {
return c.category === entry.values.category;
});
})
// display subcategory only if there is a category
.template('<ma-field ng-if="entry.values.category" field="::field" value="entry.values[field.name()]" entry="entry"
entity="::entity" form="formController.form"
datastore="::formController.dataStore"></ma-field>', true),
]);
I just have a work round method. That is using .attributes(onclick, "return updateButton();") for nga.field("type"). In updateButton() method, it will help to check current 'type' field value and using DOM methods to change the button enable and disabled.
However, I still realy appreciate that if this requirement can be support in future. It will be helpful for user to make UI controls easily.
Currently, I have a formly field set up as such:
{
key: 'id',
type: 'input',
validators: {
validId: function($viewValue, $modelValue, scope){
var value = $modelValue || $viewValue;
if(value){
return isAlphanumeric(value);
}else{
return false;
}
}
},
templateOptions: {
label: 'ID',
options: [],
required: true
}
},
isAlphanumeric() is a function I wrote that determines if a string is alphanumeric--this works as intended. However, the user is still allowed to Submit the form (which obviously does not work, as it will produce en error).
How might I go about highlighting the field red (as if it were a required field that was not filled in) if the contents are not valid, preventing the user from submitting until they enter a valid value?
You can use ngClass and assign css classes based off of an expresion. for example (taken straight from their page)
<p ng-class="{strike: deleted, bold: important, 'has-error': error}">Map Syntax Example</p>
implemented with your code
<p ng-class="{strike: validId(1,2,yourscope), bold: important, 'has-error': error}">Map Syntax Example</p>
My filter looks like this:
{
type: 'boolean',
dataIndex: 'FutureProfile',
value:false,
defaultValue : false
},
This does not add any sort of default filtering for my data. This brings back every row in the table.
If I do this:
{
type: 'boolean',
dataIndex: 'FutureProfile',
value:true,
defaultValue : false
},
Everything works fine and when the grid is loaded, the FutureProfile rows only display for items that have the boolean value of true.
So it seems if the value is set to false, extjs completely ignores this and does not send this as part of the ajax call, if it's set to true, the filter is sent via ajax. How would I make the grid actually default to rows with a false value for FutureProfile?
Figured it out after much trial and error.
If you want the default value of a boolean filter to work, you must set active to true:
{
type: 'boolean',
dataIndex: 'FutureProfile',
value:false,
active: true
}