I want to build a input form in which a user inserts a code and depending on what is introduced, show a message like UPS (or EAN/ISBN/GTIN ) code found or This code is not valid.
Have been looked for a library that can detect something like this but had no luck?
First of all, can it be done, and if yes, any tips for such library?
$('input[type="text"]').each(function() {
$(this).rules('add', {
messages: {
required: "this is EAN code"
}
})
});
$('input[type="file"]').each(function() {
$(this).rules('add', {
messages: {
required: "this is ISBN code"
}
})
});
Yes this can be done.
There are different libarys that can validate if a String is a valid EAN/ISBN/GTIN.
And if the input is not a valid EAN/ISBN/GTIN than it is (by your definition) an undefined input and not valid.
You could use a combination of different libarys or check out how they work and adapt it to your specific problem.
Here are some example JavaScript libarys:
https://github.com/dominiklessel/node-barcoder
An EAN/GTIN validator
https://github.com/yieme/isbnjs
An ISBN JavaScript Library
Related
It's a pretty strange problem I have been facing. I am using Share.share which takes message, subject(ios) and title (for gmail) as an argument. In the android it works fine. i.e. The subject line is "I am the title" whereas the message body is "I am groot". But in iOS, the subject line is always same as the message, like the screenshot shown below: Any help would be highly appreciable. Thanks in advance.
onShare = async () => {
try {
await Share.share(
{
message: "I am groot",
title: "I am the title",
},
{
subject: "I am the subject line",
}
);
} catch (error) {
...
}
};
Instead of importing Share from react-native, when I imported it from react-native-share, it fixed my problem.
As per the documentation, Share title property is used only as a title for the message. To set the email subject you need to set the subject property in the options object (note: this only works on IOS)
We're already using Vuelidate - a Vue.js model validation library to validate "configuration" for a "widget" in an "Edit Widget Configuration" form.
Now we also need to determine whether a "configuration" object (e.g. from JSON) it is valid, without the "configuration" object being inside a Vue object like a form, and would like to re-use the validation logic we've already written for the form.
Can I use vuelidate to validate such a non-vue "configuration" Javascript object? If so, how?
The question stems from a forum.vuejs.org post, where "wube" says:
I think you missed the purpose of Vuelidate. This is just a model-based validation library. Its goal is to give you an information whether the data is valid or not. I think that you probably got confused because all the examples in their docs are based on forms, but Vualidate can be used to validate any kind of data, not only forms data (in opposite to libraries like Parsley 43 that are designed for forms validation).
Exaclty. I'm trying to validate "any kind of data". How can I do that?
So how do I create the $v from:
let configuration = {
name: '',
age: 0
};
let validations = {
name: {
required,
minLength: minLength(4)
},
age: {
between: between(20, 30)
}
};
let $v = ???
Perhaps it's just a misunderstanding on my side, but I thought the callback for createGenericItem in the PeoplePicker (https://developer.microsoft.com/en-us/fabric#/components/peoplepicker) was used to handle input, that cannot be matched to any of the available items, and then give the possibility to create an adhoc item for this. But, whatever I tried, the callback is never called.
I made a simple pen here for the issue: https://codepen.io/anon/pen/daGPWe?editors=0010
In the example, there are two items, Peter and Maria. If you type something different (and hit enter, tab, space, whatever) I'd expect the createGenericItem callback to be called, but it isn't.
What am I doing wrong? Or is there a misunderstanding of the purpose of this callback? I'm unable to find an example anywhere.
Regarding
but I thought the callback for createGenericItem in the PeoplePicker
(https://developer.microsoft.com/en-us/fabric#/components/peoplepicker)
was used to handle input
that's correct. In order to trigger IBasePickerProps.createGenericItem function, IBasePickerProps.onValidateInput function needs to be provided with ValidationState.valid as a return value, for example:
<NormalPeoplePicker
createGenericItem={this.createGenericItem}
onValidateInput={this.handleValidateInput}
selectedItems={this.state.selectedItems}
onResolveSuggestions={this.handleResolveSuggestions}
onChange={this.handleChange}
/>
private handleValidateInput(input: string) {
return ValidationState.valid;
}
private createGenericItem(input: string, validationState: ValidationState) {
return { text: "Unknown person", state: validationState };
}
This demo demonstrates it, once tab or enter key is clicked and value cannot be resolved to any of the available items, Unknown person item is getting displayed
This looks to be answered many different times but I can't seem to get it working with my implementation. I am trying to format and limit the data in a sap.m.Input element. I currently have the following:
var ef_Amount = new sap.m.Input({
label: 'Amount',
textAlign: sap.ui.core.TextAlign.Right,
value: {
path: '/amount',
type: 'sap.ui.model.type.Currency'
}
});
The first problem is that it kind of breaks the data binding. When I inspect the raw data (with Fiddler) submitted to the server it is an array like this:
"amount": [1234.25,null]
The server is expecting a single number and as such has issues with the array.
When I use the following, the binding works as desired but no formatting is performed.
var ef_Amount = new sap.m.Input({
label: 'Amount',
textAlign: sap.ui.core.TextAlign.Right,
value: '{/amount}'
});
The second problem is that the data entered is not limited to numbers.
I have tried using sap.m.MaskedInput instead but I don't like the usage of the placeholders because I never know the size of the number to be entered.
And lastly, it would be nice if when focus is placed on the input field, that all formatting is removed and re-formatted again when focus lost.
Should I be looking into doing this with jQuery or even raw Javascript instead?
Thank you for looking.
the array output is a normal one according to documentation. So you need to teach your server to acccept this format or preprocess data before submission;
this type is not intended to limit your data input;
good feature, but ui5 does not support this, because the Type object has no idea about control and it's events like "focus" it only deals with data input-output. So you have to implement this functionality on your own via extending the control or something else.
I would suggest using amount and currency separately. It's likely that user should be allowed to enter only valid currency, so you can use a combobox with the suggestions of the available currencies.
So, after much work and assistance from #Andrii, I managed to get it working. The primary issue was that onfocusout broke the updating of the model and the change event from firing. Simply replacing onfocusout with onsapfocusleave took care of the issues.
The final code in the init method of my custom control:
var me = this;
var numberFormat = sap.ui.core.NumberFormat.getCurrencyInstance({maxFractionDigits: 2});
me.addEventDelegate({
onAfterRendering: function() {
// for formatting the figures initially when loaded from the model
me.bindValue({
path: me.getBindingPath('value'),
formatter: function(value) {
return numberFormat.format(value);
}
});
},
onfocusin: function() {
// to remove formatting when the user sets focus to the input field
me.bindValue(me.getBindingPath('value'));
},
onsapfocusleave: function() {
me.bindValue({
path: me.getBindingPath('value'),
formatter: function(value) {
return numberFormat.format(value);
}
});
}
});
I would like to generate a Url in a list in keystoneJS. I prefer that the url not be stored in mongo.
Attempted:
Virtual field: works, but will not generate raw HTML for the href.
Types.Url: I get the href format, but I need a value from another field in my model, so it generates the url with undefined.. Example:
{ type: Types.Url, label: "Link", default: "[http://www.stackoverflow.com/ask?id=][1]" + this._id }
Any help on how to pull this off would be much appreciated.
For your second point, this._id is not available when adding fields to the model, hence why you're getting undefined.
Instead, try using a pre-save hook on your model:
yourModel.pre('save', function(next) {
this.link = "[http://www.stackoverflow.com/ask?id=][1]" + this._id;
next();
}
I'm not quite sure if you're trying to just generate a link in this way every time, or if the user should also be able to add their own link. If the later, you'll need to check if the link has been filled in in the pre-save hook.
I hope that helps and sorry it took so long to get an answer on this!