focus in record interactive grid oracle apex - javascript

I have a grid where I do data manipulation using a sql pl, when I update the registry I use the command
var model = apex.region("event")
.widget()
.interactiveGrid("getViews")
.grid
.model;
model.fetchRecords(model.data);
so that the focus remains on the record, however when inserting the record I did not find a way for the focus to fall on the released record, can you help me?

I don't think you can focus the particular cell that you have changed because more than one records can be modified simultaneously and saved.
By default the last modified row will be focused by IG.
If the select all check box is checked and more than or row is modified all the rows will be selected.
If you want to focus the last modified row even if the select all checkbox is checked then please follow the below steps:
Dynamic Action: Save Interactive Grid, Selection Type: Column(s), Region: Your IG Region, Columns: Select the columns for for which the focus of the row must happen when IG is saved
True Action: Javascript code
$( ".selector" ).grid( "GRID_STATIC_ID" );
If you want to the last selected row to be selected even after page submit then please follow the below steps:
Dynamic action: On Selection Change IG
, True action: Javascript Code
var gridID = "GRID_STATIC_ID";
var ig$ = apex.region(gridID).widget();
var grid = ig$.interactiveGrid("getViews","grid");
var selectedRecord = grid.getSelectedRecords();
console.log(selectedRecord);
localStorage.setItem('lastSelectedRecord', JSON.stringify(selectedRecord));
Dynamic action: Page Load
, True action: Javascript Code
var gridID = "GRID_STATIC_ID";
var ig$ = apex.region(gridID).widget();
var grid = ig$.interactiveGrid("getViews","grid");
grid.setSelectedRecords(JSON.parse(localStorage.getItem('lastSelectedRecord')));

Related

datatables dropdown combobox

Im using Datatables from https://datatables.net.
One of the columns on the datatable has a dropdown combobox as cell data.
When I push a button, I need to get the selected value of the combobox inside the selected row.
$.each($("#prize_selector tr.selected"), function () {
var row = prizes_table.row(this).data();
row[3].$('select').options[row[3].$('select').selectedIndex].id;
[...]
});
but no success. How can I access the DOM select inside the cell, without traversing all the input selects on the table? (there are a lot).
edit the console throws row[3].$ is not a function
I assume you're using Select extension to select rows.
Below is a correct way to access select element for each selected row:
table.rows({ selected: true }).every(function(){
var $select = table.$('select', this.node());
var $option = table.$('select option:selected', this.node());
console.log($select.val(), $option);
});
See this example for code and demonstration.

Come out of Edit mode using javascript- kendo grid

I am using Kendo Grid with inline editing .
I need, on click of checkbox which is present in the grid i have to make row as editable and come out of edit mode.
To make kendo grid as editable i am using this code
var grid = $("#GridID").data("kendoGrid");
var gridDataArray = grid.dataSource._data;
var ctrl = event.target;
var row = $(this).parents('tr');
var index = row.index();
grid.editRow(row);
so the selected row is in edit Mode. Now, i need to get out of edit mode using javascript/JQuery.
Use saveRow or cancelRow, depending on whether you want to save the user changes or not.
On a side note, use the official data method
grid.dataSource.data()
instead of internal fields:
grid.dataSource._data

Dynamically setting multiSelect for combobox in extJS

I am kinda facing an interesting problem with my combobox's multiSelect property.
I have a grid with three columns ID, Name, Associated Part.
I have enabled Rowediting plugin and editors for ID is textfield(EditID), Name is textfield(EditName) and Associated Part is combobox(EditPartCombo with multiSelect true).
I have two buttons Add and Update.
When I select any row in the grid and press Update, rowediting starts at that exact position. In the Update button code, i am setting the multiselect property of EditPartCombo to false but somehow it is not reflecting.
Code on Update button:
{
text: 'Update Press',
handler: function(btn){
var grid = btn.up('grid');
var selection = grid.getSelectionModel().getSelection();
if(selection.length > 0){
combo = Ext.getCmp('EditPartCombo');
combo.multiSelect = false;
delete combo.picker;
combo.createPicker();
combo.reset();
var rowEditing = grid.getPlugin('RowEditPlugin');
var rowno = grid.store.indexOf(selection[0]);
rowEditing.cancelEdit();
rowEditing.startEdit(rowno, 1);
}
else{ Ext.Msg.alert('Error' , 'Please Select a row to Update'); }
}
In firebug when I inspect combo - it shows that multiSelect as false but still i am able to select multiple values.
Not sure what am I doing wrong?
Please help.
Thanks in advance.
If you cange a config value after a component is created, it is not guaranteed that this value is applied. For some config option, it is and for other it doesn't work.
I would recommend you to Ext.create the combobox, and inject this multiSelect configuration at that time. Like this for one button you create it with multiSelect enabled, and disabled for the other.

Setting Combobox Value for RowEditing Editor in Extjs

I am kinda facing an interesting problem where my combobox is behaving weird.
I have a grid with three columns ID , Name , Associated Part.
I have enabled Rowediting plugin and editors for ID is textfield(EditID), Name is textfield(EditName) and Associated Part is combobox(EditPartCombo).
I have a button called Update.
When I select any row in the grid and press Update, rowediting starts at that exact position.
EditID and EditName shows default values that has been selected but EditCombo populates as Blank.
Code on Update button:
{
text: 'Update Part',
handler: function(btn){
var grid = btn.up('grid');
var selection = grid.getSelectionModel().getSelection();
if(selection.length > 0){
alert(selection[0].get('ID_PART'));
Ext.getCmp('EditPartCombo').setValue(selection[0].get('ID_PART'));
var rowEditing = grid.getPlugin('RowEditPlugin');
var rowno = grid.store.indexOf(selection[0]);
rowEditing.cancelEdit();
rowEditing.startEdit(rowno, 1);
}
else{ Ext.Msg.alert('Error' , 'Please Select any Row'); }
}
Following alert gives me proper value of selected column:
alert(selection[0].get('ID_PART'));
but somehow it does net set the value to combobox.
Same thing works fine if I open a new pop-up window and apply the value to combobox created on window.
Please help.
Thanks in advance.

Knockoutjs complex binding combo select table

I have a table for adding a new budget details like the image below:
When I select an Income Account then another row is added to the viewmodel collection:
I want to set all field values to "0.00" when the new row is added and also I have a problem because if I delete a row then the "change" event of the combo doesnt exist so there is no way to add a new row when changing the last combo.
Any clue? Here is the fiddle working sample: http://jsfiddle.net/rLUyS/9/
Here is the code that I use to bind the change action to the last added combo:
$('select[name=cboincomeaccount_' + newRowIndex + ']').bind("change", {
combo: $(this)
}, handler);
function handler(event) {
newRowIndex++;
var combo = jQuery(this);
var row = combo.parent().parent();
appViewModel.addRow();
// Unbind
combo.unbind('change');
// Bind new combo
jQuery('select[name=cboincomeaccount_' + newRowIndex + ']').bind("change", {
combo: jQuery(this)
}, handler)
jQuery(row).find('input[name^="txtincmonth"]').removeAttr('disabled');
};
Thanks in advance!!
This might not be so much of a Knockout issue as it is a user interface issue.
I want to set all field values to "0.00" when the new row is added
Well that's easy enough. Simply initialize the the observable row to all zeros.
When I select an Income Account then another row is added to the viewmodel collection...
and also I have a problem because if I delete a row then the "change" event of the combo doesnt exist so there is no way to add a new row when changing the last combo.
This is probably a negotiable requirement.
Why not create an 'Add' button instead of insisting on this "nifty" behavior that adds a row when the user makes a section in the dropdown list?
Besides, even if we could accomplish what you're asking for (and I can envision a way that we could do this), what will you do when it's time to save the user's input to the server? Were you planning on ignore that last empty row?

Categories

Resources