When I edit an item, I want to get the previous checked referenced choices. The options are shown well, but are always all unchecked. It save any changes I do, though.
It works the same with CheckboxGroupInput as well with AutocompleteArrayInput.
ReferenceArrayInput is sending this array of data to CheckboxGroupInput:
0: {id: 1, company-name: "Empresa 1", created_at: "2019-08-09T18:08:18.066Z", updated_at: "2019-08-28T13:17:02.474Z", …}
1: {id: 3, company-name: "Empresa 3", created_at: "2019-08-23T12:41:15.254Z", updated_at: "2019-08-23T12:41:15.528Z", …}
2: {id: 5, company-name: "Empresa 5", created_at: "2019-08-23T12:41:31.762Z", updated_at: "2019-08-23T12:41:32.013Z", …}
And this is the code:
<SimpleForm>
<TextInput source="game-name" label="Name" />
<ReferenceArrayInput
source="companies"
reference="companies">
<CheckboxGroupInput translateChoice={false} optionText="company-name"/>
</ReferenceArrayInput>
</SimpleForm>
Now I got this message: "At least one of the associated references no longer appears to be available." below the form. Console doesn't show any errors.
I believe I had a similar issue to you that I was able to resolve. Try this.
<ReferenceArrayInput
source="company_ids"
defaultValue={[]}
reference="companies">
<CheckboxGroupInput translateChoice={false} optionText="company-name"/>
</ReferenceArrayInput>
React-admin requires ReferenceArrayInput to obtain the reference data from an array of ids in the data response for the requested resource. You would need to change your source to "company_ids" and ensure the resource is returning that data in the response.
Now to your main question as to showing previously saved data; I originally struggled to get my the data from my database to populate the input. I was able to get it to work by passing an empty array to defaultValue.
Hope this helps. Good luck!
Related
I am using vue-cookies npm package in my vue project. I have no problem install the package, initialize it in the project and setting the cookie. However, when I tried to retrieve the value stored in the cookie by key, instead of showing me the value I stored, it showed me [object Object], and I am not sure what went wrong:
Here is my code:
this.cart.push({
productID: this.product._id,
product: {
productName: this.product.productName,
thumbnail: this.product.productMedia[0].imagePath,
option: 'Digital Download'
},
unitPrice: this.product.price.listingPrice,
quantity: 1
})
console.log(this.cart)
this.$cookies.set('cart', this.cart, 60 * 60 * 24)
console.log(this.$cookies.isKey('cart'))
console.log(this.$cookies.get('cart'))
I made sure this.cart is not empty, $this.$cookies.isKey('cart) returned true, however, $cookies.get() method returned [object Object]instead of the cart value I stored. Any help is appreciated!
While setting the JSON object in the cookie. You can set the key value as JSON string instead of JSON object.
this.$cookies.set('cart', JSON.stringify(this.cart), 60 * 60 * 24)
While getting then you can access by parsing the JSON string into an object.
JSON.parse(this.$cookies.get('cart'))
If you want to see the value in the console try doing
console.log(JSON.stringify(this.$cookies.get('cart')))
The object in question may be nested which is why it won't print.
Please suggest a way for me to add link/anchor tag to the value of objects property in vue.js.
I.e. I want the word journey in the title property to have a link. Coudn't able to find a solution since I am new to vue.
My template:
<blog-post v-bind="post"></blog-post>
Vue Script:
post: {
id: 1,
title: 'My Journey with Vue'
}
You can inject HTML code into an HTML component with:
post: {
id: 1,
title: 'My Journey with Vue'
}
<span v-html="post.title"></span>
But, this method is dangerous because, if the post title value comes from an unreliable source, like an user input, it can lead to becoming the cause of possible XSS attacks.
Use v-html carefully.
I have initialize a collection. In that i have a single doc which holds UserPreferences. I an trying to updated few fields of this doc. But fails with errorCallback.
var dataToUpdate = {
userPreferencesID:1,
firstname:'Test Name',
lastName: 'Test Name 2'};
WL.JSONStore.get(tableName).replace(dataToUpdate).then(successCallback).fail(errorCallback);
If some forum i could see the syntax
WL.JSONStore.get(tableName).replace(query, option).then(successCallback).fail(errorCallback);
Which one is correct. I tried both, but failed to update the record.
IBM Worklight Version 6.1.0.2
Thank in advance.
The replace API takes a JSONStore document as the first parameter. For example:
{_id: 1, json: {userPreferencesID: 1, firstname: 'Test Name', lastName: 'Test Name 2'}}
Notice the _id and json keys. You're not passing a document as the first parameter.
Here's the API documentation for the replace API in Worklight v6.1.
You get JSONStore documents when you use, for example, the findAll API:
WL.JSONStore.get('collection').findAll()
.then(function (jsonstoreDocuments) {
// [{_id: 1, json: {name: 'carlitos', age: 99}}]
});
The example above presumes the JSONStore collection is not empty, if it's empty you'll get an empty array back (i.e. []).
I'm seeing some odd behavior with some custom serializer code that I wrote.
I have a field in an Asset model called 'marketName'. My Rails backend expects this field to be called 'market_name'. I've extended the ActiveModelSerializer and have overridden the 'extractSingle' and 'serialize' methods.
The odd thing is this - for all the other fields in my Asset model that are not made up of multiple words - the serialization code that I've written works great. No issues. However - for any field containing multiple words - the serialization doesn't work completely, in that while it saves the Asset when created - it doesn't correctly populate the Asset model's 'marketName' field (and any other field that is made up of multiple words).
For example if I examine the 'marketName' field in the data inspector it appears as '{}'. If I change the name of any multi word field in my Asset model to be singular (aka change 'marketName' to 'name') and update the serialization code accordingly - everthing works great.
Any idea what's going on ?
Thanks
Dave
In the test of extractSingle() that the core team (see line 126, also show below incase link goes bad for future readers) did, they pass in the variables as super_villains, then later the normalize() included in ActiveModelSerializer changes it for them to superVillains.
So I think in your extractSingle assume the values are not yet camelCase, but still are still in underscore_format (e.g., "market_name"), and you should be golden!
test("extractSingle", function() {
env.container.register('adapter:superVillain', DS.ActiveModelAdapter);
var json_hash = {
home_planet: {id: "1", name: "Umber", super_villain_ids: [1]},
super_villains: [{
id: "1",
first_name: "Tom",
last_name: "Dale",
home_planet_id: "1"
}]
};
var json = env.amsSerializer.extractSingle(env.store, HomePlanet, json_hash);
deepEqual(json, {
"id": "1",
"name": "Umber",
"superVillains": [1]
});
env.store.find("superVillain", 1).then(async(function(minion){
equal(minion.get('firstName'), "Tom");
}));
});
I am having trouble displaying results as suggestions on entering text in input box.
<input type="text" id="search_country" class="form-control" placeholder="Add country">
Below is my typeahead code:
$('#search_country').typeahead({
name: 'countries',
valueKey: 'name',
remote: {
url: '/user/countries/%QUERY',
filter: function (parsedResponse) {
return parsedResponse;
}
}
});
I am getting json response in the below format:
[{"image": "india.jpeg", "name": "India"},
{"image": "germany.jpeg", "name": "Germany"}]
However the results are not showing up as suggestions below input box.
Rather in console I am finding an error similar to error given below:
Uncaught TypeError: Cannot use 'in' operator to search for '14771' in
[{"image": "india.jpeg", "name": "India"},
{"image": "germany.jpeg", "name": "Germany"}]
Where am I going wrong?
I want the result to contain a list of countries with each list item having image at left and name at right.
In your example the filter is doing nothing, I would remove it.