We Keep Coding

How to get specific selection of checkbox from a popup datatable in Webix?

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);
});

modal window changes some rows in table instead of one

I have a table with some rows. Table rows can be modified by ajax requests. Modifying happens in a modal widnow for the current row (just for one).
So, I found a bug. I click edit for 1st line. I see the modal window with values of 1st line. So, it's ok. Then I click close without saving. Well. I click edit for 2nd line. I see the modal window with values of 2nd line. So, it's ok too. Now, if I click Save changes, I see two modified rows (1st and 2nd), but it seems just 2nd row must be modified. If I do the same for N count of rows I see N changed rows.
I don't understand why it's happen. Can anybody explain me?
https://jsfiddle.net/bogdan_017/26gaqpcf/#&togetherjs=C1ltBspbSs

Every time you click on an edit, you ADD another click event to the save button ... in this code modal.find(".save-btn").click(function () {
you need to remove the click event on the save button once you click on it
// snip
modal.modal('hide');
$(this).off('click'); // add this here
// snip
You'll also need to handle the modal close (the close button) and remove the click event on the save button in that case

Delete remove functionality for last row in ng-grid?

I have functionality that allows my ng-grid to remove rows in which when you click the remove button, the row is deleted from the ng-grid. Below is an example of how I have it set up now:
http://plnkr.co/edit/NL7sMGT6acdUHAAZPNba?p=preview
I want to get it so that the remove button disappears on the very last row. In the example above, for example, all but the Enos entry would have no delete button. Also, if I created a new row under Enos, I would have it so that Enos would then have a remove button and the new row under Enos would have no delete functionality. I have the functionality to add/remove rows, but I simply want to get the remove button to disappear on the last row. How would I do so?
Any help would be appreciated. Thanks!

You can use the ng-hide directive to hide the button when the row index is the last one in the collection:
<input type="button"
value="remove"
ng-click="removeRow()"
ng-hide="row.rowIndex == $parent.myData.length-1" />
This uses the $parent property to access the original list on the parent scope to get the count.

Changing the tabular data to another table using jquery

I tried to implement to display data in a table with the button click. Now I am trying to move the data from the table to the below the continue table. In this code, when I enter the input value from the json object and click the submit button, data will display in a table with a continue button and a empty table below.When I click continue the data in the above table should move to table which is located below the continue button. Here is my code [Sample http://jsfiddle.net/e254w/6/] Can anyone please suggest the idea of implement the scenario?
Krish

One way to approach this would be to remove the row from the first table and append it to the second.
This line finds the second row in the first table, removes it if it exists and appends it to the second table.
$('#datatable').find('tr').eq(1).remove().appendTo($('#seconddatatable'));
updated fiddle
Updated fiddle - this works for me first entering 122233334444, then entering 122223355552

ExtJS RowButton that cancel row selection

I'm trying to add row buttons to a grid panel. These buttons should capture the click event, do their stuff, and prevent the row to be selected.
The problem is that the row behaviour that changes the row selection is running before the button's event (like if the row was capturing it instead of wait to event bubbling).
Is there any way to add a row button that perform its action before the row selection to be able to cancel the event and therefore cancel any other behaviour?

What is your intent?
Is it to completely disable row selection for this grid?
Or prevent row selections from "losing focus"/reseting when a row button is clicked?
If you want to disable row selection from the entire grid (1), set the config item disableSelection to true.
If you want to prevent row selections from being reset everytime the user clicks on your row buttons (2), you can extend Ext.grid.RowSelectionModel and override the initEvents method to register handleMouseDown to handle the cellmousedown instead of the rowmousedown (this will give u access to the columnIndex that originated the event) GridPanel event. Then add some logic to the handleMouseDown method to not update the row selection if the columnIndex is equal to the column index of yours row buttons. In other words, only execute the original handleMouseDown logic if the columnIndex is not equal to the column index of your row buttons.
Hope this helps.

I hadn't got the idea of watch the column, it's very simple to register a listener to cancel the selection of rows. (I would rather the row to wait the event bubbling, but...)