I'm using ng-admin.
I have two dropdown lists in a page, one for Provinces and the other for cities.
I would like to populate choice of cities according to the value of the selected Province field. I can't load the whole list because it is humungous.
What's the best way to do it?
Here is my code:
dipendenti.creationView()
.title('Aggiungi dipendente')
.fields([
nga.field('Nome')
.validation({required: true })
.cssClasses('col-sm-4'),
nga.field('Cognome')
.validation({required: true })
.cssClasses('col-sm-4'),
nga.field('anagrafica.idprovincia','reference')
.label('Provincia')
.targetEntity(admin.getEntity('province'))
.targetField(nga.field('id'))
.targetField(nga.field('nome'))
.validation({required: true })
.cssClasses('col-sm-4'),
nga.field('anagrafica.idcitta','reference')
.label('Città')
.targetEntity(admin.getEntity('comuni'))
.targetField(nga.field('id'))
.targetField(nga.field('nome'))
.validation({required: true })
.permanentFilters({
provincia: 5}) //<- here shoud be retrieved automatically
// .remoteComplete(true, {
// refreshDelay: 300,
//// populate choices from the response of GET /posts?q=XXX
// searchQuery: function(search) { return { provincia: search }; } //<- here with autocomplete
// })
.cssClasses('col-sm-4')
I wonder if there is a way to inject a scope on the reference or the best practice for ng-admin...otherwise I think I shoud write an Angular directive...which is not exactly MY piece of cake...!
I've looked at the code generated and it is a bit complicated ( I think I should replicate it as the directive's template ) so I'd prefer to find an elegant way to do the job.
Thank you very much...
Related
I searched all day but I didn't find the solution to my problem.
I'm new to React Native so I'm stucked ...
Here's my problem :
I fetch an api to the get data, I'm doing it with axios and it's ok I can render my component !
Then I don't want to display ALL ITEMS of my Array but I want to display some items according to different values with 2 buttons :
<Button onPress={Get ALL ITEMS with this value}/>
<Button onPress={Get ALL ITEMS with ANOTHER VALUE} />
My issue is that I'm modifying the state of my array 'products' with new information but that's not what I want. I always want that I'm displaying information according to a particular VALUE in the Array and still get my Full Array...
Here's some piece of code of what I'm doing :
onPressFirstButton() {
let newArray = [...this.state.products];
this.setState({
products: newArray.filter(function(product){
return product.value == 32;
})
});
}
onPressSecondButton() {
let otherArray = [...this.state.products];
this.setState({
products: otherArray.filter(function(product){
return product.other_value == 389;
})
});
}
I'm sure it's not the best way because it's not working.. I hope you will understand what I'm trying to say..
Thank you
Since you seem to be using the products property to populate your template, consider using a separate variable for that instead, that way you don’t have to mess with your state when doing your filtering. Maybe this will help:
displayProducts = []
onPressFirstButton () {
this.displayProducts = this.state.products.filter(product => /* logic */)
}
im stucked in a dumb problem, but i don't know how to go ahead, so i hope that someone of you can give me a help.
My problem is that i have a list of element, and i can acces for everyone of them, in which i can load the specific data of the element. In this view i can load the data from the REST backend call, and work all prettly, the problem that i have encountered is when i have to load a list with the select tag, and im working with ng-model and ng option. I want to load in that list the data selected that the element have in this moment, but when i try to put in ng-model the data that i give from the backend, that doesnt work, instead if i initialize the same element out of the service call backend that work and i can see the element selected. The service is working because i can see every value of the element, and even if i try to take the specific value i can see it if for example i put that in a paragraph. Thanks in advance.
this is where i load the list:
self.AzionePropostaLista=[
{ qsAzioneProposta:'SENSIBILIZZAZIONE', value: 'SENSIBILIZZAZIONE'},
{ qsAzioneProposta:'INIBIZIONE MANUAL ENTRY', value: 'INIBIZIONE MANUAL ENTRY'},
{ qsAzioneProposta:'INIBIZIONE BANDA', value : 'INIBIZIONE BANDA'},
{ qsAzioneProposta:'INIBIZIONE COMPLETA', value : 'INIBIZIONE COMPLETA'},
{ qsAzioneProposta:'REVOCA', value : 'REVOCA'},
{ qsAzioneProposta:'RINUNCIA', value :'RINUNCIA'},
{ qsAzioneProposta:'SBLOCCO', value :'SBLOCCO'},
{ qsAzioneProposta:'COMUNICAZIONE INTERNA', value :'COMUNICAZIONE INTERNA'},
{ qsAzioneProposta:'AUTOFIN.SOSPETTATO', value : 'AUTOFIN.SOSPETTATO'},
{ qsAzioneProposta:'VALUTATO SENZA RISCHIO', value :'VALUTATO SENZA RISCHIO'}
];
This is the data that im retriving from the backend service:
self.condition: "SENSIBILIZZAZIONE"
MerchantService.getThisAction({qs_key:$routeParams.qs_key,qs_data_proposta:formatData},function(response){
if(response.statusCode==0){
self.action = response.data;
self.condition = response.data.qsAzioneProposta; THIS DOESN'T WORK BUT I CAN SEE THAT VALUE
$log.debug("self.condition is"+self.condition);
}
else {
sweetAlert('Error','something missing or you are trying to acces an inexistent merchant', 'error');
$location.path("/home");
}
});
// self.condition = 'SENSIBILIZZAZIONE' THIS WORK
<div class="input-field col s4">
<select ng-model="$ctrl.condition" ng-options="azione.value as azione.qsAzioneProposta for azione in $ctrl.AzionePropostaLista"></select>
<label>Suggested action</label>
</div>
This is the data that i'm retriving from the backend
Your ng-model aggregates azione.value from ng-options therefore:
Change:
self.condition = response.data.qsAzioneProposta;
to:
self.condition = response.data.value;
DEMO
I have a use case wherein I need to filter a list on the basis of selections from various drop down (one at a time). I am aiming at making a common function to be called on ng-change from dropdown as follows:
$scope.filterTasks = function(selection, filterOn) {
if (filterOn === "trade") {
$scope.tasks.forEach(function(t) {
if ((t.team.code === selection.team.code) && (t.deal.code === selection.deal.code)) {
t.filtered = "trade";
}
$scope.filterBy = "trade";
});
}
else if (filterOn === "cluster") {
//similar approach in this case
}
}
and in html I am doing something like:
<li ng-repeat="t in tasks | filter : {filtered: '{{filterBy}}'} : true track by t.tid" class="li_row" ng-if="!t.hide">
By default I am keeping filtered property as 'show' and $scope.filterBy = 'show', so that all the objects in array get displayed.
This do not seem to be working.
Is there some invalid approach up here. What can be a suitable way to achieve this. (i.e display all elements by default, and on selection from dropdown, display only those element where some deep properties of selection matches those properties in array objects).
I have found few post demonstrating above, but could not grasp much out of them
i'm trying to filter a collection which has models with some nested object. Unfortunately, my result are always empty.
So my models returned in the collection are build like this:
My goal is simple:
I have a view with a list of tag and a content view with all the questions. When a user click on tag, for example, "c#", i want to filter my collection to just return questions with tag "c#"
Before i was doing a fetch on my server and it was working fine, but it was not optimize.
I already have a collection with all the questions so why make a new call, a filter is a better solution i think.
But i didn't succeded with my filter and i don't know if it's possible to do. For now i put my filter in my router because it's more easy to test.
i can't make a filter like this because i have an array of object
getQuestionsByTags: function(query) {
var test = this.questionsCollection.filter(function(model) {
return model.attributes.tags.name == query;
})
console.log('result');
console.log(test);
},
So i was thinking to make a loop but my result is always an empty array.
getQuestionsByTags: function(query) {
var test = this.questionsCollection.filter(function(model) {
_.each(model.attributes.tags, function(tag) {
return tag.name == query;
})
})
console.log('result');
console.log(test);
},
It's maybe simple, but i don't know what to do.
Thanks in advance :)
i've just found a solution that work.
getQuestionsByTags: function(query) {
var flag;
var test2 = this.questionsCollection.filter(function(model) {
flag = false;
_.each(model.attributes.tags, function(tag) {
if(tag.name == query) {
flag = true;
}
})
if(flag) {
return model.attributes;
}
})
console.log('result');
console.log(test2);
},
i put a flag. If he turn true inside the loop, the model has this tag so i return it.
I think it's not very conventional, so if someone have another solution, feel free to post it :)
I have some data that I'm getting from the server that depending on the situation may bring different fields, so what I have is this:
//This is the way i'm attaching the newly created template to the view
//Still no success
function processDataMethod(response){
//some processing here...
var details = Ext.widget('details');
details.config.itemTpl = new Ext.XTemplate(tplFields);
}
Ext.Ajax.request({
url: '...',
...,
success: function (response, request) {
var combinedData = processDataMethod(response);
operation.setResultSet(Ext.create('Ext.data.ResultSet', {
records: combinedData,
total: combinedData.length
}));
operation.setSuccessful();
operation.setCompleted();
if (typeof callback == "function") {
callback.call(scope || that, operation);
currentList.up().push(Ext.widget('details'));
}
}
});
Any help is appreciated, thanks!!
You have to make a distinction between a number of things:
currentList.up() returns a DOM element (Ext.dom.Element). This has no method push().
With Ext.widget('details', config); you can pass a config like {itemTpl: yourTemplate, data: yourData} to create an instance with a custom template and custom data.
To update your component after creation you can always do someWidget.update(data);.
A component can be rendered to an HTML element with the renderTo option.
A component can be appended to existing components in different ways and you can update the whole layout or parts of it in different ways. This is unnecessary if you are rendering to an HTML element.
Does that help you find your problem?