Button not initialized on new row

[stevejacobsen]

I have some hidden buttons that I create on each row. When I edit the row I find the button make some changes and show it. That works. But I use the same code after inserting a row and it says the button is not initialized. Is this a timing thing or am I not getting the row inserted correctly?

Here is a fiddle. The function is at the top. I click the add row button to get the error in the console.

http://jsfiddle.net/2u0ytfc7/1/

function service_add(grid) {
  var rowIndx = 0;
  id = 200;

  $("#services_grid").pqGrid("addRow", {
    newRow: {
      id: id,
      service_date: "2016-12-13"
    },
    rowIndx: rowIndx,
    rowIndxPage: 0
  });
 
    //show the update and cancel .
  var $tr = grid.getRow({
      rowIndx: rowIndx
    }),

    $btn = $tr.find(".save_btn");

  $btn.button("option", {
      label: "Save",
      "icons": {
        primary: "ui-icon-check"
      }
    })
    .unbind("click")
    .click(function(evt) {
      return service_save(rowIndx, grid);
    })
    .show();

  //$("#services_grid").pqGrid("refresh");

  grid.addClass({
    rowIndx: rowIndx,
    cls: 'pq-row-edit'
  });

  grid.editFirstCellInRow({
    rowIndx: rowIndx
  });

}

[paramvir]

The button should be initialized before calling option or any other method.

Code: [Select]

$btn.button({
      label: "Save",
      "icons": {
        primary: "ui-icon-check"
      }
    })
    .unbind("click")
    .click(function(evt) {
      return service_save(rowIndx, grid);
    })


[stevejacobsen]

Thanks! I also had to set the refresh to false on addRow. But that all works now.

Steve