I have a datatable with radio buttons for every row, my problem is that when i check the radio button in first page for example and go to another page and check another radio button i sow that the first one (in page one) still checked.
Expected : When i select a row, then i change the page in the table, and if i re-select a row, the value of the previous page must be deselected.
I'm using this https://datatables.net/examples/data_sources/js_array
thinks
Related
I have a page having a classic report in an Oracle APEX application. The first column of each row is a checkbox. Also, I have added a checkbox in the first column of headers row. The purpose of this checkbox is to provide Select-All, Unselect-All functionality so that when I select the header checkbox, the checkboxes in all rows get selected, and when I unselect it, the checkboxes get unselected. Here is JQuery code that I use on the "change" event of the header row's checkbox:
if ( $( '#selectunselectall' ).is(':checked') )
{
$('input[type=checkbox][name=f01]').attr('checked',true)
}
else
{
$('input[type=checkbox][name=f01]').attr('checked',false)
}
The problem is that this functionality is working only for the first page, and only when it is first loaded. If I go to next page, this functionality no longer works, and also if I come back to first page, that functionality doesn't work even on first page.
Another problem is that when I select some individual checkboxes on first page, and then go to next page, and then come back first page, all the checboxes again come as unselected. It means the application doesn't remember user's selecttions when the user navigate out of page.
Can someone please help resolve these issues?
Try the following steps:
InteractiveReport - Columns - "Select" - Heading - "<"input type="checkbox" id="selectunselectall" onclick="$f_CheckFirstColumn(this)"">"
InteractiveReport - Attributes - Heqading - Fixed To - "None"
Have a list of licenses plates that start with a disabled button and no line selected.
Here is what should to do:
When select a row, button "Go foward" enable;
When select a row already selected, deselect it and disabled button again.
When list have a row selected and user click in another row, deselect old row and select the new one.
The snippet code i did:
https://codesandbox.io/s/busy-galileo-mw3p3?fontsize=14&hidenavigation=1&theme=dark
Facing this problems:
Need 2 clicks to set css style 'custom-col-row-active' to row selected. Button is enable already first click.
When a line is already selected, when you click on the other lines, they are selected as well. With 1 click on a selected line, all are deselected.
I know need use data table to deselect line already select, but i don't know how to get the full data table, since i only get the data when i click in a specif row.
Any tips here?
#Rafael, I don't know much about tabler-react, but this is just my suggestion for you. Your handleSetActivedRow seems to have problem. I don't understand why you have written onClick={(e) => handleSetActivedRow(e)}. You are calling a function inline when onClick itself and again you are taking it to an other function handleSetActivedRow. This is bad coding; instead you can do like this onClick={handleSetActiveRow}. secondly, you need to check again your handleSetActiveRow function. I don't understand why you want to return? when it is not necessary. What you need to check on is that you want to set the className to -active when you click on an element.
I have a popup data table in each row of a maintable with some checkboxes in it.
I am selecting/checking items randomly by clicking the checkbox buttons for each row and printing the values checked with the help of Print button.
I am observing that only the last selection of checkbox buttons are overwriting all the earlier selections.
How can I get the appropriate selection of checkbox buttons corresponding to each row?
Snippet: https://snippet.webix.com/11irkt7o
Thanks.
You code uses a single instance of popup table for each rows, so as result whey you are calling $$pt.eachRow you are itterating other the last active value, all previous values are lost.
The better solution will be to use click handler of close button, to get all checked rows and store that data in the master row
{view:"button", label:"Close", click:function(){
ids = collectCheckedRows($$('p_table'));
$$('mytable').updateItem(selectedRow, { checked : ids })
this.getTopParentView().hide()
}}
Now, to print all values you can use
$$('mytable').eachRow(function(id){
console.log(id, this.getItem(id).checked);
});
I have a grid setup with multiselect: true because I need to be able to delete more than one row at the same time. On the onSelectRow event I am loading some data based on the ID and displaying it to the end user. So far so good.
This is the example where everything works fine, the data for ID=219109 is being displayed:
Now look at the following example:
In the example above the first row still highlighted and then I clicked a second one. Because of multiselect is enabled I was able to select both at the same time. The onSelectRow event still working properly which means is loading the data for the ID=282006 but visually it could be confusing for the end user.
What I want to do is to reset the previous selected rows and just highlight the last one I have clicked.
For example using the same images:
Load a fresh grid with no rows selected
Click on ID=219109: highlight and select this row
Click on ID=282006: clear the grid and highlight this row
However this should only happen when I click in any other place than the checkbox.
In the image above if I click on any column rather than the first one (the one having the checkbox) I should be able to clear the grid selection and choose the last one but if I click on the checkbox it does not matter because is the only way to delete more than one at the time.
I have tried the following:
onSelectRow: function () {
var rowid = $(this).jqGrid('getGridParam', 'selrow');
$(this).jqGrid("resetSelection");
$(this).jqGrid("setSelection", rowid);
}
But it's not working since the behavior is not consistent. You can check the demo here.
Any ideas in how to achieve this?
It seems to me that you need just add the option
multiboxonly: true
and remove your current onSelectRow code. See https://jsfiddle.net/OlegKi/949pLpfv/3/. If the user clicks multiple times on checkbox the rows will be selected. The click on another part of the row will deselect all previously selected rows and select only the clicked row.
I have a jsfiddle here: http://jsfiddle.net/ybZvv/22/
The situation I have is that if you click on "Select All Answers" button, it will turn on all the letter buttons (al trun green). Now if you click on the "Add Question" button it appends the buttons from the top into a table row. You will see a bunch of text inputs appear below the table, this shows the values of all of the buttons which are turned on in the appended row.
This is fine. But the problem is below:
The problem though is that if you click on the "Remove All Answers" button IN THE APPENDED ROW, then all of the buttons are turned off which is fine but it does not remove/hide the text inputs for all of those values which buttons are turned off.
If you then click on the "Select All Answers" button IN THE APPENDED ROW, then it turns all ofthe buttons in the row but no text input appears showing all of the values which buttons are turned on.
So my question is that if the user clicks on the "Select All Answers" button in an appended table row, how can we get it to display all of the text inputs of the buttons which are turned on in that row?
Also if the user clicks on the "Remove All Answers" button in the appended row, I want it to remove all of the text inputs of those buttons turned off within that row. How can this be achieved?
The solution is to "trigger" a click on the buttons instead of simply taking off one class and adding another.
So instead of
$('.answerBtns:visible', context).removeClass('answerBtnsOff').addClass('answerBtnsOn');
you should use:
$('.answerBtnsOff:visible', context).trigger('click');
to simulate a click on the button to do proper handling.
Here's the edited fiddle