I am attempting to populate a checkbox in a dialog based upon the checkbox in a selected table row. The page has multiple tables. The tables have the same columns and a variable number of rows. Each row has one checkbox. When clicking on the row's edit icon, I open a dialog window. I am attempting to set the property of the dialog property checkbox to the property of the row property and am not having success: I have read every jquery checkbox posting and tried the solutions. These are my last 2 tries:
$('.ui-icon-pencil').click(function(e) {
var initialRow = $(this).parent().parent();
var $thisFieldset = $("#bookmark-data-fieldset");
var urlid = $("td:first", initialRow).text();
/*default dialog checkbox to not checked*/
$('#dialoggoalstatus').removeAttr('checked');
var urlname = $("td:nth-child(2)", initialRow).text();
var newurlname = urlname.trim();
var goal_date = $("td:nth-child(3)", initialRow).text();
$('#bookmark-goaldate').val(goal_date);
/* populate the dialog checkbox with the property of the
row checkbox*/
$("#dialoggoalstatus").prop($("td:nth-child(4)",
initialRow).find(':checkbox').prop('checked'));
/* I also tried this*/
$("#dialoggoalstatus").prop($(initialRow).
find('td input:eq(4)').is(':checked'));
This did not work. Can you help me identify what I am missing?
In addition, I attempting to then populate the table with the selection of made in the dialog form.
I am using this:
var goalid = $("td:first", initialRow).text();
$("td:nth-child(2)",initialRow).text($("#namefield").val());
$("td:nth-child(3)", initialRow).text($("#datefield").val());
$("td:nth-child(4)", initialRow).
prop($( "#dialoggoalstatus").prop('checked'));
This also is not working.
Any help would be greatly appreciated.
Related
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')));
I am currently using the datatable with datatable plugin.I also added the checkbox and dynamic dropdown with it.Now when i click the checkbox i can't able to get the selected value from datatable
it brings the html code?How can i get the value?
Please called below function on onchange event of checkbox.
onChangeCheckBox(_id)
In function pass same id of dropdown i.e. '_id'.
function onChangeCheckBox(e) {
var id = e.id;
var val = e.options[e.selectedIndex].value;
var text = e.options[e.selectedIndex].text;
}
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.
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.
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.