res.employee.data.role.forEach(role => { this.roleadd = { label: role.display_name, value: role.name } this.roles.push(this.roleadd); });
<p-multiSelect [style]="{'width':'100%','z-index': '1'}" [options]="roles" [(ngModel)]="model.role" [formControl]="form.controls['role']"></p-multiSelect>
SelectItem has disabled property. You need to set disabled = true to disable on dropdown
this.roleadd = { label: role.display_name, value: role.name, disabled: true }
Related
right now I'm trying to create a ListView which loads the dataModel using a custom QML. Here's the snippet of my code:
ListView {
id: firstPageListView
visible: false
dataModel: firstPageDataModel
layout: GridListLayout {
columnCount: 1
cellAspectRatio: 2.0
headerMode: ListHeaderMode.Standard
verticalCellSpacing: 10
}
listItemComponents: [
ListItemComponent {
//custom qml that will be used
ThumbNote {
title: ListItemData.title
text: ListItemData.text
imageSource: ListItemData.image
listmode: true //list mode
date: ListItemData.date
}
}
]
}
I want to create a button that will change the listmode property of each component into false. By doing so, the object will invoke a function that set in the onListModeChanged() of the ThumbNote QML.
Sorry for my poor english, any help would be appreciated. :)
Perhaps you might consider adding a property to the ListView and binding the ThumbNotes' properties to it.
E.g.:
ListView {
id: firstPageListView
visible: true
dataModel: firstPageDataModel
property bool listMode: true
...
listItemComponents: [
ListItemComponent {
//custom qml that will be used
ThumbNote {
title: ListItemData.title
text: ListItemData.text
imageSource: ListItemData.image
listmode: firstPageListView.listMode
date: ListItemData.date
}
}
]
}
Button {
onClicked: {
firstPageListView.listMode = false;
}
}
this is the code i use to call the form view:
get_view_form_dimension: function() {
var self = this;
var action_manager = new openerp.web.ActionManager(this);
var dialog = new openerp.web.Dialog(this, {
width: 800,
buttons : [
{text: _t("Cancel"), click: function() { $(this).dialog('destroy'); }},
{text: _t("Save"), click: function() {
var form_view = action_manager.inner_viewmanager.views.form.controller;
form_view.do_save(function() {
$.jstree._reference("#new_tree").destroy();
self.get_tree_structure();
});
$(this).dialog('destroy');
}}
]
}).open();
action_manager.appendTo(dialog.$element);
action_manager.do_action({
res_model : 'df.bi.dimension',
res_id: self.process_id,
views : [[false, 'form']],
type : 'ir.actions.act_window',
flags : {
search_view: false,
sidebar : false,
views_switcher : false,
action_buttons : false,
pager: false
}
});
},
how can i set values into the form that this method will rise ?? or in case that exist other solution please tell me ? sorry for my english!
Add a context field to your do_action call with default values, like this:
context: {'default_account_id': 5, 'default_name': 'hello'},
I'm new to ExtJS and only have minimal javascript skills in general. I'm going through some assignment to learn ExtJS4 but this one is eluding me. I'm trying to get a listeners to check a checkbox (well all of them but just one at the moment) when a toggle button is toggled. No matter how I write the code, I get a similar error from Firebug:
missing : after property id
togglebtn.toggle: function(tog, true){
Any thoughts on what I'm doing wrong and how to correct it?
Thanks...
var togglebtn = Ext.create('Ext.button.Button', {
enableToggle: true
, text: 'Checked'
});
var mychkbxgrp = Ext.create('Ext.form.CheckboxGroup', {
columns: 3
, alias: 'mycheckboxgroup'
, items:[{
boxLabel: 'Item1'
, name: 'rb'
, inputValue: '1'
, listeners:{
togglebtn.toggle: function(tog, true){
setValue: true
}
}
},{
boxLabel: 'Item2', name: 'rb', inputValue: '2'
},{
boxLabel: 'Item3', name: 'rb', inputValue: '3'
}]
});
Ext.create('Ext.toolbar.Toolbar', {
renderTo: document.body
, width: 600
, height: 40
, items:[{
xtype: 'form'
, height: 30
, width: 180
, bodyPadding: 4
, items:[
mychkbxgrp
]
}
, togglebtn
]
});
AFAIK handlers for events must be functions, and must be defined for this object. You are trying to set toggle handler inside checkbox definition, while it should be on button.
Below is example implementation of that listener
var togglebtn = Ext.create('Ext.button.Button', {
enableToggle: true,
text: 'Checked',
listeners: {
toggle: function(sender, checked){
var container = sender.findParentByType(); // find parent container
var items = container.query('checkboxfield'); // find checkboxes
Ext.each(items, function(i){ // iterate through checkboxes
i.setValue(checked); // check/uncheck
});
}
}
});
And you must remove togglebtn.toggle: function(tog, true){
setValue: true
} from checkbox definition.
Working sample: http://jsfiddle.net/DyctX/
I have an application in MVC with a view class:
Ext.define('a.view.Mainmenu' ,{
extend: 'Ext.menu.Menu',
alias: 'widget.mainmenu',
text: 'Menu',
items: [
{
xtype: 'menucheckitem',
id: 'mci1',
text: 'a'
},
{
xtype: 'menucheckitem',
id: 'mci2',
text: 'b'
}]
});
How I can control the click events of the menucheckitems in the controller? I want to check if the menucheckitems are checked.
I tried something in the init function of the controller, but there is an error (item.down("mci1") is null):
...
init: function() {
this.control({
'mainmenu': {
click: function(item) {
if (item.down('mci1').checked == true) {
...
}
if (item.down('mci2').checked == true) {
...
}
}
}
});
}
How I could do it right?
#Ringo,
Neither the menuitem or menucheckitem have a method of down() available to them according to the Sencha docs (http://docs.sencha.com/ext-js/4-0/#!/api/Ext.menu.CheckItem-event-checkchange).
So, that is why those aren't working.
There is an event for the xtype of menucheckitem called 'checkchange'. This event makes the following arguments available for your function:
this (Ext.menu.CheckItem) <= the actual menucheckitem that was checked/unchecked (so mci1 or mci2 depending on which the user clicked on)
checked (Boolean) <= true if the change set the menucheckitem as checked and false if unchecked.
So, this would only require you to do something like:
...
init: function() {
this.control({
'mainmenu menucheckitem': {
checkchange: function(item, checked) {
if (checked) {
if(item.id == 'mci1'){
...
}
}else{
...
}
}
}
});
}
The item parameter is already your menu item. You don't have to query down.
so it would be:
if(item.checked && item.getId() == 'mci1'){
...
}
I have used check box model in the grid panel. When i checked the check box i am the checked column value. Now what i need is when i unchecked i need to get that same unchecked value.
var selModel = Ext.create('Ext.selection.CheckboxModel', {
checkOnly: true,
listeners: {
selectionchange: function(model, records) {
if (records[0]) {
id = records[0].get('id');
alert(id);
}
}
}
});
Thanks in advance.
Regards,
Riyaz
This is the answer:
var selModel = Ext.create('Ext.selection.CheckboxModel', {
checkOnly: true,
listeners: {
deselect: function(model, record, index) {
id = record.get('id');
alert(id);
},
select: function(model, record, index) {
id = record.get('id');
alert(id);
}
}
})