When validate Q-Select with vee-validate 4, the use-input attributes is not working and don know why the value appearing twice - vuejs3

Here is my code
<Field
name="options"
rules="required"
v-slot="{ errorMessage, value, field }"
>
<q-select
filled
dense
use-chips
use-input
multiple
:model-value="value"
:options="state.options"
label="Filled"
v-bind="field"
:error-message="errorMessage"
:error="!!errorMessage"
/>
</Field>
How do I use the use-input attributes and remove the double value that display in the select field? Please help thank you.
Q-Select-validation

Issue solved Thanks to logaretm.
Because v-bind="field" is doing a bunch of even listening which conflicts with that component. The field object doesn't know the kind of the component/element so it tries to cover as much cases as possible by listing to input, change, update:model-value events. In that component case it is possible it emits both input and update:model-value because of the text input inside it.
You can fix it by being selective of what events should change the value with handleChange.
https://stackblitz.com/edit/vee-validate-v4-quasar-framework-gbma2c?file=src%2FApp.vue

Related

SAP UI5 binding by reference to another value

I have a large model with many levels and attributes and I want to have one Input in my XML view which will always edit 1 attribute from the model, but every time it will be a different attribute.
I want to edit for example attributes on following paths:
myModel>/user/0/surname
myModel>/user/1/name
myModel>/user/2/nickname
myModel>/user/3/email
Let's say that now I am interested in editing the nickname of user nr2 so I will save its path to a variable:
myModel.setProperty("currentlyEditedPath", "myModel>/user/2/nickname");
And I want to define my Input like this:
<Input value="{myModel>/currentlyEditedPath}" >
And what happens is that UI5 will allow me to edit the string "myModel>/user/2/nickname" it self. But its wrong. I only want to use the string as a reference to some other value deep in the model which should be modified and updated. I should probably write something like this, but I cannot find the correct way:
<Input value="{ ${myModel> ${myModel>/currentlyEditedPath} } } " >
Any ideas, please? .. as simple as possible. Best inline.
I think the Element binding is the good way. Feel free to comment on this:
var oInput = sap.ui.core.Fragment.byId("myFragmentID","myInputID");
oInput.bindElement("myModel>/user/2");
oInput.bindProperty("value", "myModel>nickname");
Or I can also place the value to the XML:
<Input value="{myModel>nickname}" >

Adding fields dynamically to Share form

I want to add a text field for each file that is added to the attached package items in alfresco to write notes regarding each file, is it possible to do?
I have implemented something that could be reused for your use case.
You can define a property with multiple values that will contain the list of notes associated with each attachment.
There is a simple trick to post a property with multiple values: add "[]" to the name of the property. For example:
<input id="template_x002e_edit-metadata_x002e_edit-metadata_x0023_default_prop_someco_notes_0"
name="prop_someco_notes[]"
tabindex="0"
type="text"
value="Meeting minutes"
title="Notes"
noderef="workflow://...."
>
<input id="template_x002e_edit-metadata_x002e_edit-metadata_x0023_default_prop_someco_notes_1"
name="prop_someco_notes[]"
tabindex="1"
type="text"
value="Meeting minutes"
title="Notes"
noderef="workflow://...."
>
As you can see, the name of the input ends with []. Both input textfields have the same name.
The Alfresco Form Engine will consider these two inputs as the value for the property with multiple values: "someco:notes".
The bigger problem is that you need to generate this html with some smart javascript and free marker template.
You can write a custom free marker template to render the initial html: if a user opens a task on which documents have been already attached, you will need to generate the list of inputs using a custom control (you can of course start from textfield.ftl).
It won't be easy to generate the initial list because unfortunately Alfresco returns the list of values as a single comma separated value.
You can customise the webscript that injects the model in the free marker template "org.alfresco.web.scripts.forms.FormUIGet" to pass an array instead of a csv.
A quicker and dirtier solution is to split the csv value. In share-config-custom.xml, you can specify what textfield.ftl show use as a separator instead of the comma.
When a user adds/remove elements from the package, you can intercept the update and add/remove the correspondent note. Notice that I have added the filed "noderef" to each input so it is possible to know the relation between the notes and the nodes in the package.
UPDATE:
For the associations (used for example to define the package in a workflow task), Share uses a javascript library called "object finder" (or "object picker"). This library fires an event called "formValueChanged" that you can intercept:
YAHOO.Bubbling.fire("formValueChanged",
{
eventGroup: this,
addedItems: addedItems,
removedItems: removedItems,
selectedItems: selectedItems,
selectedItemsMetaData: Alfresco.util.deepCopy(this.selectedItems)
});

Polymer 1.0: Data binding variable to <iron-meta> element (value attribute)

In Polymer 1.0, I am trying to data bind a string variable {{str}} to an <iron-meta> element (tag in parent element) as follows.
This fails:
<iron-meta id="meta" key="info" value="{{str}}"></iron-meta>
The above code breaks. But the following code works (without the binding).
This works:
<iron-meta id="meta" key="info" value="foo/bar"></iron-meta>
The difference is the variable version {{str}} fails and the constant version "foo/bar" works.
Does anyone have a clue what is what is breaking the binding and how to fix it?
Edits in response to comment questions:
How does it fail? This fails silently. The values I have printed out simply do not update when I press the Login and Register buttons.
Here is a link to the code in a Github repository. See lines
You need to use an attribute binding and not a property binding
<input type="text" value$="{{str}}" />

want to make fields readonly if the record is saved , openerp

I want to make some fields (checkboxes) readonly if the record is saved. the next assigned person can change in some fields. But some fields must be restricted that no body can change them. One way is to do so is to put user or group rights. But I want it in another way. Any way there?
This condition is work perfectly
<field name="freezing_on_all_channels" attrs="{'readonly':[('id','!=', False)]}"/>
or attrs="{'readonly':[('id','!=',0)]}" (note: the 0 not in quotes '0'),
you just made one mistake; if you put
<"field name="id" invisible="1"/> in the view as well, then it will work as expected.
Thanks
It's possible when state is change.
You can do it by writing "attrs={}" attribute in your .xml.
For example:
< field name="your_field" attrs="{'readonly':[('state','=','saved')]}"/>
Hope this will solve your problem.
Thank You...
try with below
'your_field': fields.char('Name', type='char',store=True,readonly=True),

jQuery Validate formatting rules for range limits

I have a large table of text inputs for which a set of custom attributes are being created on the server side. These attributes included "min" and "max" which were used with the jQuery Validate plugin.
Due to a change in the requirements (of course), we now have to update the attributes to a range type, however the Validate plugin isn't interpreting the formatting of the range rule correctly (or perhaps it's more accurate to say I'm not formatting the rule correctly) and now I have problems.
The generated output for the input boxes looks like this:
<input type="text" producttype="CCC" code="ESTFEE" range="460, 500" class="currency required" id="txtEstFeeCCC" value="460.00" name="txtEstFeeCCC">
I've also tried the following:
<input type="text" producttype="CCC" code="ESTFEE" range="[460, 500]" class="currency required" id="txtEstFeeCCC" value="460.00" name="txtEstFeeCCC">
In either case, the message returned is either:
Please enter a value between 4 and 6.
or
Please enter a value between NaN and 4
respectively. Neither of which has anything to do with the 460 - 500 range in question.
The jQuery code calling the validate function is just the vanilla call:
$("#btnSave").click(function() {
validator.form();
...
});
How should an input attribute for jQuery Validate range be formatted so that the correct number range limit is displayed?
You should be able to do:
<input type="text" id="field1" name="field1" class="{required: true, range: [460, 500]}">
You could, of course, always just store the values as a range but output as min and max properties still

Resources