I'm using dev extreme data grid, I displayed blank if the date is not available.
I want to show "-" if date is empty.
I tried
// component.html
[customizeText]="customizeMyText"
// component.ts
customizeMyText(cellInfo: any) {
console.log(cellInfo);
if (cellInfo.value == '' || cellInfo.value == null || cellInfo.value == undefined) {
return 'NA';
} else {
return cellInfo.value;
}
}
But it gives an error, text.replace is not a function.
The return value on the customizeText function expects a string, change your function to use the valueText instead:
customizeMyText(cellInfo) {
if (
cellInfo.value === "" ||
cellInfo.value === null ||
cellInfo.value === undefined
) {
return "NA";
} else {
return cellInfo.valueText;
}
};
Source: https://js.devexpress.com/Documentation/ApiReference/UI_Widgets/dxDataGrid/Configuration/columns/#customizeText
Related
I have a computed property (filteredSyms) that depends on the asynchronous computed property (allSynonyms). I am using async-computed plugin for this:
https://www.npmjs.com/package/vue-async-computed.
However, when the data gets updated the computed property doesn't wait until the result of the async property update. Therefore, I receive not up to date information. Then after the async property actually return new value computed property doesn't run update again.
How can I make it work the way that computer property waits until there is a result from the async computed property?
The code is below:
asyncComputed: {
async allSynonyms() {
let allSyns = await this.$axios.$post('/db/sym/synonyms', this.model.syms);
return allSyns;
}
},
computed: {
filteredSyms() {
let that = this;
let allSyn = this.allSynonyms;
let exactMatch = this.symsByRating.filter(
function (v) {
let isExactMatch = v.title.toLocaleLowerCase().indexOf(that.searchString.toLocaleLowerCase()) >= 0;
return !that.idsToFilter.includes(v.id) && isExactMatch
&& (!that.currentBodyPart || v.bodyParts.indexOf(that.currentBodyPart) >= 0)
&& that.hasMoreSubsyms(v)
&& (!allSyn || !that.containsObject(v, allSyn))
&& (v.sex == that.model.sex || v.sex == 'NA');
});
let partialList = [];
exactMatch.forEach(ex => partialList.push({n: 100, sym: ex}));
for (let sym of this.symsByRating ) {
let searchWords = this.searchString.toLocaleLowerCase().split(' ');
let symWords = sym.title.toLocaleLowerCase().split(' ');
let n = 0;
let isPartialMatch = false;
symLoop:for (let symWord of symWords) {
symWord = symWord.substring(0, symWord.length - 1);
for (let searchWord of searchWords) {
// don't count last letters of the words
searchWord = searchWord.substring(0, searchWord.length - 1);
if (searchWord.length > 2 && symWord.indexOf(searchWord) >= 0) {
n++;
isPartialMatch = true;
}
}
}
if (exactMatch.indexOf(sym) < 0 && isPartialMatch
&& (!this.currentBodyPart || sym.bodyParts.indexOf(this.currentBodyPart) >= 0)
&& this.hasMoreSubsyms(sym)
&& (!allSyn || !this.containsObject(sym, allSyn))
&& (sym.sex == that.model.sex || sym.sex == 'NA')) {
partialList.push({n: n, sym: sym});
}
}
partialList.sort(function(obj1, obj2) {
return obj2.n - obj1.n;
});
if (this.searchString && this.searchString != '') {
partialList = this.filterSynonyms(partialList);
}
let fs = partialList.map(ws => ws.sym);
console.dir(fs);
return fs;
}
}
A lot of stuff is going on the filtered method, but I guess the main point here that it is using this.allSynonyms to do the check but it is not updated at the time filteredSyms is executed.
Thanks for your suggestions!
(I haven't really tested this out, but it should work.)
vue-async-computed does provide the status in this.$asyncComputed.allSynonyms.success.
try adding this.$asyncComputed.allSynonyms.success as a dependencies to filteredSyms and it should update when success state change.
I have a SimpleSchema instance with two fields:
isApproved: {
type: Boolean,
defaultValue: false
},
impactedSystems: {
type: String,
optional: true
}
I'd like to change the optional attribute of impactedSystems to false if isApproved is set to true.
I've tried following the instructions in the docs but I can't get it to work. It suggests I add a custom function to impactedSystems like so (modified with my field names):
custom: function () {
var shouldBeRequired = this.field('isApproved').value == 1;
if (shouldBeRequired) {
// inserts
if (!this.operator) {
if (!this.isSet || this.value === null || this.value === "") return "required";
}
// updates
else if (this.isSet) {
if (this.operator === "$set" && this.value === null || this.value === "") return "required";
if (this.operator === "$unset") return "required";
if (this.operator === "$rename") return "required";
}
}
}
The field stays optional whether isApproved is true or not.
I also tried the code from this answer but the value of optional doesn't change when the field it depends on (isApproved) is updated.
How can I have the value of optional become the opposite of another boolean type field?!
Try this code. it is admittedly a little convoluted...
This is a generic helper you can use across all your schemas:
// This helper method does the ceremony around SimpleSchema's requirements
export const isRequired = (thing,shouldBeRequired) => {
if (shouldBeRequired) {
// inserts
if (!thing.operator) {
if (!thing.isSet || thing.value === null || thing.value === "") return "required";
}
// updates
else if (thing.isSet) {
if (thing.operator === "$set" && thing.value === null || thing.value === "") return "required";
if (thing.operator === "$unset") return "required";
if (thing.operator === "$rename") return "required";
}
}
};
In the schema itself you can do it like this:
const isRequiredWhenApproved = (record) => {
const shouldBeRequired = (record.field('isApproved').value);
return isRequired(record, shouldBeRequired);
};
isApproved: {
type: Boolean,
defaultValue: false
},
impactedSystems: {
type: String,
optional: true,
custom() {
return isRequiredWhenApproved(this);
},
},
I hope that works for you
I finally figured it out. I was inserting isApproved from one form and then updating impactedSystems in another. All I had to do was include isApproved (with type=hidden) in the update form where I want its value to be read. The code I provided is correct.
Example
{#autoForm collection=Requests doc=this id="singleRequestLayout" type="update"}} //This can also be of type insert
{{> afQuickField name="isApproved" type="hidden"}}
{{> afQuickField name="impactedSystems"}}
<button type="submit" class="button">Submit</button>
{{/autoForm}}
It appears my security rules are failing because they're too long. The two rules that are commented out cause the whole rule set to fail, but when run together in isolation, they both run successfully. Is there a limit I'm hitting that I'm unaware about?
match /transactions/{transactionId} {
allow create, update: if
isSignedIn() &&
validateTransactionSchema() &&
// Succeeds when these rules are left out.
// These rules succeed on their own, but not when combined with others
// (incomingData().categoryId == null || categoryExists(incomingData().categoryId)) &&
// (incomingData().payeeId == null || payeeExists(incomingData().payeeId)) &&
accountExists(incomingData().accountId) &&
isBudgetOwner() &&
isPremium();
function validateTransactionSchema() {
return incomingData().keys().hasAll(['transactionDate', 'accountId', 'payeeId', 'categoryId', 'splits', 'memo', 'amount', 'cleared', 'locked']) &&
incomingData().size() == 9 &&
incomingData().transactionDate is timestamp &&
incomingData().accountId is string &&
(incomingData().payeeId == null || incomingData().payeeId is string) &&
(incomingData().categoryId == null || incomingData().categoryId is string) &&
incomingData().splits is list &&
(incomingData().memo == null || incomingData().memo is string) &&
incomingData().amount is number &&
incomingData().cleared is bool &&
incomingData().locked is bool;
}
}
function isSignedIn() {
return request.auth != null;
}
function isPremium() {
return get(/databases/$(database)/documents/users/$(request.auth.uid)).data.isPremium == true;
}
function isBudgetOwner() {
return get(/databases/$(database)/documents/budgets/$(budgetId)).data.userId == request.auth.uid;
}
function categoryExists(categoryId) {
return exists(/databases/$(database)/documents/budgets/$(budgetId)/categories/$(categoryId));
}
function accountExists(accountId) {
return exists(/databases/$(database)/documents/budgets/$(budgetId)/accounts/$(accountId));
}
function payeeExists(payeeId) {
return exists(/databases/$(database)/documents/budgets/$(budgetId)/payees/$(payeeId));
}
function incomingData() {
return request.resource.data;
}
The limit exposed by Bob Snyder has been raised to 10. This should help your situation.
As per: https://firebase.googleblog.com/2018/06/announcing-firestore-security-rules.html
I need to filter the listing or records according to selection in dropdownlists.
I have three dropdowns that needs to filter the records reactively in collaboration with each other. i.e value selection in one dropdownlist should filter the records effected by other dropdownlist values.
var filterAndLimitResults = function (cursor) {
if (!cursor) {
return [];
}
var raw = cursor.fetch();
var currentChosenCategory = chosenCategory.get();
var currentChosenCity = chosenCity.get();
var currentJtype = chosenJtype.get();
console.log(currentChosenCategory);
console.log(currentChosenCity);
// filter category
var filtered = [];
if (!currentChosenCategory || currentChosenCategory == "" && !currentChosenCity || currentChosenCity == "" && !currentJtype || currentJtype == "")
{
filtered = raw;
// console.log(filtered);
}
else {
filtered = _.filter(raw, function (item) {
if(currentChosenCategory){
return item.ccategory === currentChosenCategory ;
}
if(currentChosenCity){
return item.city === currentChosenCity ;
console.log(item.city === currentChosenCity);
}
});
}
var currentLimit =limit.get();
//enforce the limit
if (currentLimit ) {
filtered = _.first(filtered, currentLimit );
}
return filtered;
};
the above code is doing both filtering the dropdowns and limit the number of records so as to give infinite scrolling.
Edit For Text Based Search
Here is my eventmap for seach box
"keyup #search-title":function(e,t){
if(e.which === 27){
searchTitle.set("");
}
else {
var text = $(e.target.val);
searchTitle.set(text)
console.log(searchTitle.set(text));
}
}
This is what iam doing in the filteredAndLimitResults
if(!(!currentSearchTitle || currentSearchTitle == "")) {
filtered = _.filter(filtered, function (item) {
return item.title === currentSearchTitle ;
console.log(item.title === currentSearchTitle);
});
}
when i am typing something in the search box. all the records vanishes and when in press esc it comes back to as it was. in console.log i can see that on everytime i press a key it returns the collection.
You need to enforce the filters one after the other. Try like that:
var filterAndLimitResults = function (cursor) {
if (!cursor) {
return [];
}
var raw = cursor.fetch();
var currentChosenCategory = chosenCategory.get();
var currentChosenCity = chosenCity.get();
var currentJtype = chosenJtype.get();
console.log(currentChosenCategory);
console.log(currentChosenCity);
// filter category
var filtered = [];
if (!currentChosenCategory || currentChosenCategory == "" || currentChosenCategory === "All categories")
{
filtered = raw;
// console.log(filtered);
}
else {
filtered = _.filter(raw, function (item) {
if(currentChosenCategory){
return item.ccategory === currentChosenCategory ;
}
});
}
// filter city
if (!(!currentChosenCity || currentChosenCity == "" || currentChosenCity === "All cities"))
{
filtered = _.filter(filtered, function (item) {
if(currentChosenCity){
return item.city === currentChosenCity ;
console.log(item.city === currentChosenCity);
}
});
}
// filter JType
if (!(!currentJtype || currentJtype == "" || currentJtype === "All Jtypes"))
{
filtered = _.filter(filtered, function (item) {
if(currentJtype){
//update the item.ccategory with the right field
return item.ccategory === currentJtype ;
}
});
}
var currentLimit =limit.get();
//enforce the limit
if (currentLimit ) {
filtered = _.first(filtered, currentLimit );
}
return filtered;
};
I'm having a problem with the following situation.
I have an ascx which contains a submit button for a search criteria and I am trying to call a validation function in a js file I've used throughout the site (this is the first time I'm using it in an ascx).
Now I've just tried this:
<script type="text/javascript" src="js/jquery-1.3.2.js"></script>
<script type="text/javascript" src="js/jsAdmin_Generic_SystemValidation.js"></script>
<script type="text/javascript">
$(document).ready(function () {
$(".submitBtn").click(function (e) {
alert("test");
alert($.Validate());
alert("test 2");
});
});
</script>
The file is being referenced correctly as I am already seeing posts in Firebug that are done by it.
This is the function:
jQuery.extend({
Validate: function () {
var requiredElements = $('.required').length; // Get the number of elements with class required
$('.required').each(function () {
// If value of textbox is empty and have not
// yet been validated then validate all required
// elements. i.e.
if (($(this).val() == "") || ($(this).hasClass("validationError")) || ($(this).hasClass("validationAlert")) || ($(this).hasClass("validationOk") == false)) {
validate($(this));
}
});
if ($('.validationOk').length == requiredElements) {
return true;
} else {
return false;
}
},
// Another extended function, this function
// is used for pages with the edit-in-place
// feature implemented.
validateElement: function (obj) {
var elementId = obj.attr("id"); // id of the button clicked.
var flag = 0;
if (elementId.toLowerCase() == "paymentmethodid") {
// Case elementId = paymentMethodId then check all the
// elements with css class starting with openStorage
var requiredElements = $(document).find("input[class*='openStorage']").length; // Get the number of elements with css class starting with openStorage
// Loop through all the elements with css class containing
// openStorage abd validate each element.
$(document).find("input[class*='openStorage']").each(function () {
if (($(this).val() == "") || ($(this).hasClass("validationError")) || ($(this).hasClass("validationAlert"))) {
validate($(this));
}
if ($(this).hasClass("validationOk")) {
flag++;
} else if (($(this).hasClass("validationError")) || ($(this).hasClass("validationAlert"))) {
flag--;
}
});
// If all elements are valid return true else return false
if (flag == requiredElements) {
return true;
} else {
return false;
}
} else if (elementId.toLowerCase() == "registeredfortax") {
if (($('.TaxRegistrationNumber').val() == "") || ($('.TaxRegistrationNumber').hasClass("validationError")) || ($('.TaxRegistrationNumber').hasClass("validationAlert"))) {
validate($('.TaxRegistrationNumber'));
}
if ($('.TaxRegistrationNumber').hasClass("validationOk")) {
return true;
} else {
return false;
}
} else {
var elementClass = "." + elementId;
if (($(elementClass).val() == "") || ($(elementClass).hasClass("validationError")) || ($(elementClass).hasClass("validationAlert")) || ($(elementClass).hasClass("validationOk") == false)) {
validate($(elementClass));
}
if ($(elementClass).hasClass("validationOk") && ($(elementClass).hasClass("required"))) {
return true;
} else if ($(elementClass).hasClass("required") == false) {
return true;
}else {
return false;
}
}
}
});
Now at first I was getting "Validate() is not a function" in firebug. Since I did that alert testing, I am getting the first alert, then nothing with no errors.
Can anyone shed some light?
Thanks
Are you using the extend method properly? ...
http://api.jquery.com/jQuery.extend/