Get/Set igGrid combo cell value - infragistics

I have an iggrid that is using a JSON data source for the main grid data and the combo box in one of my fields.
I have created the grid and the combo and the data is there. When I change the combo value and commit the grid the main grid column value does not change. I can see this by assigning a default value to the column and then changing it via a combo box.
I am working off of this example.
http://www.infragistics.com/products/jquery/sample/combo-box/grid-editor
Combo Data
occCodeData = [
{ "ID": "0", "OccCode": "Food" },
{ "ID": "1", "OccCode": "Beverages" },
{ "ID": "2", "OccCode": "Electronics" },
{ "ID": "3", "OccCode": "Cookies" }
];
My grid data is stored in a JSON variable in javascript pulled from a web api. I have verified the data is valid using a console write.
Does anyone have this working with standard JSON, JS, and HTML? This main issue is when I change the combo value it does not update my JSON data behind the scenes. The GUI grid changes fine.

When you have editing in the grid, by default the autoCommit option is set to false (meaning the UI updates but the values are not committed to the data source). You can change this to true in order to automatically commit to the data:
//Initialize
$(".selector").igGrid({
autoCommit : true
});
//Get
var commit = $(".selector").igGrid("option", "autoCommit");
Or you can call the commit method manually:
$(".selector").igGrid("commit");

I figured it out. My Sample occCodeData data did not match my current value.
So my default value pulled from the database was 129 but my possible values were 0,1,2,3. This was causing the combo not to change the value because it did not have a match in it's own listing.

Related

Acumatica-LotSerialNbrAttribute screen on mobile app

I'm using Acumatica customization Acumatica-LotSerialNbrAttribute
This customization adds a new screen for look for InventoryID and LotSerialNbr and visualize its attributes.
I'm trying to add this window to the acumatica mobile app.
Here my code:
add screen IN202501 {
add container "InventoryLotSerialContainers" {
add field "InventoryID"
add field "LotSerialNbr"
add group "Attributes" {
displayName = "Attributes"
collapsable = True
add attributes "AttributesAttributes"
}
add recordAction "Save" {
behavior = Save
}
add recordAction "Cancel" {
behavior = Cancel
}
attachments {
}
}
}
And the screen is visible on the mobile app with the 2 selectors
Then I select Inventory and when I select Lot Serial Nbr, the first selector is in blank, causing that I can't review the attributtes neither save the information.
Here the InventoryID selector in blank.
Hope you can help me to successfully publish this screen on acumatica mobile app.
Thanks.
Attributes are a grid style representation in Acumatica. That means you need a container that will show multiple records. I'm getting rusty on mobile pretty quickly, but I believe your definition is set to display a single value value only.
Try adding a separate container for attributes:
add container "AttributesAttributes" {
add field "Attribute"
add field "Value"
}
This should open into a view of multiple records, showing all of your attributes. By specifying the Attribute and Value fields, you should see both data elements in the container.

Sitecore Speak UI : How to manipulate column value of List Control before displaying in list .

I am working in speak UI . I have list of items to display in list . But before that i have to check one column value and need to manipulate this value with a Icon to display . How can I implement this change in SpeakUI . Please help
Simple option:
If the data you receive is directly relateable to the icon you want to display:
Set your DataSource on your ListControl to a ListControl Parameters item with your ColumnField items underneath (as outlined in Sitecore doco or other blogs). In the HTMLTemplate field for your column, you can use the value as the source of an image or CSS class with background image style.
<img src="{{YourField}}" />
or
<span class="{{YourField}}"></span>
where your span class styles your icon.
More complex but customisable:
I'm not sure which datasource you are using, but I am a fan of the JsonDataSource by Anders Laub as it's very simple to use and customise (you only need to add 2 small files).
To your SPEAK renderings you add your JsonDataSource, and ListControl with Items property: {Binding JsonDataSource.Json} (and DataSource as required)
Then in the javascript for your page (defined in your PageCode rendering) you can add items to this datasource and customise as required:
jQuery.ajax({
type: "GET",
dataType: "json",
url: "/yourApiCall" + params,
cache: false,
success: function (data) {
var total = 0;
for (var i = 0; i < data.YourItems.length; i++) {
app.JsonDataSource.add({
Col1: data.YourItems[i][0],
Col2: data.YourItems[i][1],
Col3: data.YourItems[i][2]
});
}
},
Where Col1, Col2, and Col3 are the names of your columns, and YourItems is the array of items you are receiving from your ajax call.

Sitecore SPEAK UI set selected row of ListControl

I have a SPEAK UI dialog with a ListControl bound to a custom JSON datasource. This works and the ListControl is correctly populated. My JSON data looks something like this:
[
{
"itemId":"{BA26159A-194D-4A3C-9D1A-DA9472F11BE0}",
"selected":true
},
{
"itemId":"{E651D0CD-0E7E-4903-8E26-0D1D5A168E69}",
"selected":false
},
{
"itemId":"{E651D0CD-0E7E-4903-8E26-0D1D5A168E70}",
"selected":false
}
]
Is there a way to ensure the relevant row of the ListControl is selected ("selected":true) when the dialog loads?
You can set the ListControl's selected item ID like this: this.MediaResultsListControl.viewModel.set({selectedItemId:"ITEMID"})
(Sitecore.Speak.app instead of this during dubuging in the console)
If you call this.MediaResultsListControl.viewModel.selectedItemId() you can see the selected item has been set by the above method.
Wondering on page load, if you can set the ListControls selected item id, from the page code manually using this method?
Looking at the JS for the list control. It calls this on click of a row. Wonder if you can replace this to trigger selected row?
selectRow: function (row, rowModel) {
this.$el.find(".active").removeClass("active");
row.addClass("active");
this.model.set("selectedItem", rowModel);
this.model.set("selectedItemId", rowModel.get("itemId"));
},

Mirror API custom menu and custom properties

In my app I have added custom menu items to user timeline items. I am creating the custom menus in iteration. Is there any way to append the custom properties to the custom menu item? , so that I can know which menu item is clicked.
ere is my code for custom menu,
// And custom actions
List<MenuValue> menuValues = new ArrayList<MenuValue>();
menuValues.add(new MenuValue().setIconUrl(WebUtil.buildUrl(req, "/static/images/drill.png")).setDisplayName("Found"));
menuItemList.add(new MenuItem().setValues(menuValues).setId("found").setAction("CUSTOM"));
timelineItem.setMenuItems(menuItemList);
timelineItem.setNotification(new NotificationConfig().setLevel("DEFAULT"));
Thanks in advance.
You're already attaching a property to the menu item with the setId() method. The value in the id is ignored by Glass except to send it back to you when this menu item is selected. You can put anything you want here (within reason - there is a limit of a few hundred characters).
So, given your example above, if the menu item is selected, you'd get a notification looking something like this:
{
"collection": "timeline",
"itemId": "8a84302a-1da7-46f2-ac72-2c008fce2b4b",
"operation": "UPDATE",
"userToken": "12345678901234567890",
"verifyToken": "shibboleet",
"userActions": [
{
"type": "CUSTOM",
"payload": "found"
}
]
}
You would examine the userActions.payload field and take action based on this.

List paging in Sencha

I have created a list in Sencha touch2. I need to add paging to it. Lets say i need 25 items to be displayed in a page and on tap of "next" button, the next 25 items has to be displayed.
I believe sencha touch 2 provides paging but am not gettin a handle on it.
My code is
cls:'inboxqueuecls',
xtype:'list',
id:'queuelist',
store:'QueueStore',
plugins: [{
xclass: 'Ext.plugin.ListPaging',
autoPaging: false,
clearOnPageLoad: true
}],
style:{
'border-right':'0.01px black',
'background-color':'rgba(0,140,153,0.2)'
},
itemTpl:'{queueName}'
and my store is
pageSize: 20,
autoload: false,
proxy:{
type:'memory',
reader:{
type:'xml',
record:'string',
rootProperty:'QueuesNames',
}
}
but the "page size" doesn seem to be working.
Anything am missing? Please help.
As TDEBailleul has said pageSize is an attribute of store not of the proxy.
Second, Memory proxy does not support paging. MemoryProxy has its own processing in the Store.js. Specify json or other proxy to get paged ajax call at the output. Another solution is MemoryProxy or ever from other ancestor subclassing.