After clicking on Delete button in Kendo UI Grid row is disappear, but without clicking save row will not delete.
But with disappeared row users forgets to press save.
Now I want to make it be visible but with opacity.
Added code to .KendoGrid({...:
remove: function(e) {
e.preventDefault();
e.row.show();
e.row.animate({opacity:0.3},800);
}
But prevendDefault in this code acts on save button to, and it doesn't work.
How can I leave row visible after pressing Delete button OR delete row direct on button clicking without save?
I assume your grid's datasource is configured in batch mode; hence, the reason there is a save button? Well, if you want the item to be deleted immediately without the user having to remember to click save, set batch: false on the grid's datasource.
Related
I have a scrollable Kendo Tree List. The rows of it can be selected. After selecting, the user can scroll away. But if he clicks on ,delete', a confirm dialog asks ,Do you want to delete the selected item'.
What I want is that after clicking delete, the selected row stays at the same position if the user can still see it. Otherwise, the row should be positioned in the middle of the list (scrolling node to middle).
Is there something like element.isCurrentlyShown ?
(Provisionally, I use
this.element.find(".k-grid-content").scrollTop($(selectedRow).position().top)
to ensure that the selectedRow is shown.)
How do I make a panel refresh or load on button click in extjs?
I want to revert all changes in panel color to the default when I click the button go, next, or previous.
There are multiple options :
1. Get the reference to panel and delete it, then Ext.create('panle-class').Place this in place of destroyed panel.
2. Get the reference to panel change its styles to intended ones.
I have an "article" page where the selected article is displayed by default and another articles are ajax-appended to the bottom after clicking on "next" button.
Every article has its own FB share button.
I can reinitialise all the buttons by FB.XFBML.parse(); command, but the existing buttons disappear for a short moment during reinitialisation.
Is there a way to reinitialise only last appended button or somehow to prevent visual disappearing of the buttons?
(Btw. this issue does not apply to twitter button, which can be reinitialised by twttr.widgets.load(); command)
FB.XFBML.parse() function takes a parameter with selected DOM element. Then it will only reinitialise share buttons that are present in the DOM element:
var buttons = newblog.find('.share-buttons')[0];
FB.XFBML.parse(buttons);
I'm writing a web application using jQuery.dataTables. I'm sure I did this some time before, but I'm having trouble figuring out the proper way to make my page respond to the user clicking on a row.
The basic idea is that I want to be able to respond to a click on a row by showing the user more information about that row. I would like to invoke some function when the row is clicked. I may also need to place one or more buttons in each row that can be clicked on to do row-specific functionality, such as navigate to a form to edit or delete a row.
$('#tblData').dataTable({
data: data,
columns: columns, // only column names specified
bFilter: false,
bPaginate: false,
bInfo: false
});
I would have thought that the "Events" reference might answer this (http://www.datatables.net/reference/event/), but I haven't had any such luck.
To place an event on the table's row I would use the .on method:
$("#tblData").on('click','tbody > tr',function(e){ });
Then, if you place buttons inside the rows, you can do the same thing using the button selectors. Just make sure you use e.stopPropagation() in the button click to keep the row click from firing.
I am using jqGrid for a scheduling process. In the grid, I am displaying the working hours and other details of employees under a department. On clicking a row in the grid, another grid has to pop-up which gives details of the corresponding row in the master grid. For example you can refer to http://trirand.com/blog/jqgrid/jqgrid.html (adanced>masterdetails). This shows an example of two grids where on clicking a row in the master grid you get the invoice details in the below grid. I too need the same functionality and added to it, I have to add/edit the rows in the second grid. Both the grid datatype are local. On clicking submit button in the add/edit dialog I want to override the default action which submits the data to the server, and write my own function. The function is to store the added details/edited details into an object and bind it as a data block to a div.
I tried onclickSubmit, but it was still invoking the default method.
Added to this, i would like to reload the grid with the new row.
for your first problem, what you can do...onSelectRow property of jqgrid you can send the data of that row as local data and load a new grid just below to previous grid
for example, this you can write with first grid
onSelectRow: function(){
var sel_id = jQuery("#grid").jqGrid('getGridParam', 'selrow');
//this will give you id of the selected row
now to get values of the column for this row, there are several methods
i'll go with this one, lets say i have date as a column in this row
so,
var date=getCellValue(sel_id,'date');
and now you can load a new grid in this same function and send this data to that grid
and now your second problem, for the custom functionality of add/edit dialogue you can make use of this event and over ride it
beforeSubmit
check this
http://www.trirand.com/jqgridwiki/doku.php?id=wiki:form_editing#editgridrow