DataTables Editable: adding new row troubles

Klaq

Hi! I'am using DataTables Editable 1.3 and found problem with adding new row: table didn't refresh, but row adds in database. Server-side request fully processed, but response didn't affect any changes. While using delete and update there is no problems. So, AddData servlet
[code]
@WebServlet(name = "/AddData",
urlPatterns = {"/AddData"})
public class AddData extends HttpServlet {

private static final long serialVersionUID = 1L;
@EJB
private CfoFacade cfoFacade;

public AddData() {
super();
}

protected void processRequest(HttpServletRequest request, HttpServletResponse response)
throws ServletException, IOException {
response.setContentType("text/html; charset=UTF-8");
String formId = request.getParameter("formId");
if (formId.equals("cfo")) {
String kod = request.getParameter("kod");
String name = request.getParameter("name");
Cfo c = cfoFacade.findByKod(kod);
if (c.getIdCFO() == null) {
c.setKod(kod);
c.setName(name);
int id = cfoFacade.create(c);
response.getWriter().print(id);
} else {
response.getWriter().print("Record " + kod + "is exist");
}

}
}
[/code]

script:
[code]

$('#cfo').dataTable( {
"sScrollY": "400px",
"bScrollCollapse": true,
"bJQueryUI": true,
"bProcessing": true,
"bServerSide": true,
"sAjaxSource": "/Diplom/cfo",
"aoColumns": [
{ "sName": "ID",
"bSearchable": false,
"bSortable": false,
"bVisible": false
},
{ "sName": "KOD",
"sWidth": "10%"},
{ "sName": "NAME",
"sWidth": "90%"}
]
}).makeEditable({
"aoColumns": [
{ width: "80%" },
{ width: "80%" }
],
sAddNewRowFormId: "formAddNewRow",
sAddNewRowButtonId: "btnAddNewRow",
sAddNewRowOkButtonId: "btnAddNewRowOk",
sAddNewRowCancelButtonId: "btnAddNewRowCancel",
sDeleteRowButtonId: "btnDeleteRow",
});
[/code]

html

[code]





Kod



Name





Add
Delete



ID
Kod
NameЦФО









[/code]

Have you got any ideas?

Klaq

One more, dubugging AddData servlet with Firebug: status code 200 OK, form data sucessfully added to database, responce - id of last inserted row or error message.

arjun_adhikari

although the datatables automatically redraws the table after adding a new row...
however if it doesn't do it in you case you might as well try to do via using fnOnAdded function.

first you must provide the reference of oTable in your script like...

var oTable = $('#abc').dataTable({
.....}).makeEditable({});

and then in your editable plugin code write the following

fnOnAdded: function(){
oTable.fnDraw();
}

i have applied the same and it has worked nicely....


Arjun

tfchu

Hi Klaq and arjun_adhikari,

I have a similar issue here. When setting "bServerSide": true, row is added to database but the table simply does not refresh.

I tried fnOnAdded: function(){ oTable.fnDraw(); }, XHR monitor shows the request is made, but still table does not refresh.

Any idea?

Tony