Grid with Buttons on iOS

[ghenneParticipant]

I’m creating a grid with buttons in some of the cells.

  Grid1_settings.columns = [ 
    { text: "Name", dataField: "Name", width: "auto" }, 
    { text: "", dataField: "B1", width: 45, cellsrenderer: HTMLStop}, 
  ]
function HTMLStop(id) {
  HTMLStop= "<input type='button' onClick='gridClick(event)' class='gridButton' id='Stop_" + id + "' value='Stop'/>"
}

This works fine on the desktop, but not on a iOS device: nothing happens when the button is tapped.

Any ideas?

You can try it here:

http://www.nsbasic.com/i/GridWithButtons

[Peter StoevKeymaster]

Hi George,

jQWidgets should be initialized in the jQuery’s document.ready callback. The problem in your page is that they are not initialized correctly. You try to use the widgets, but the JavaScript files are not still loaded.

Best Regards,
Peter Stoev

jQWidgets Team
http://www.jqwidgets.com

[ghenneParticipant]

Hi Peter,

I’m not sure that’s it. I added some tracing to the code: jqxGrid() is definitely being called after jQuery’s document.ready. I’ve improved the sample at

http://www.nsbasic.com/i/GridWithButtons

If you run it with the Chrome Debugger window open, you can see the sequence of events:

$(document).ready called 
document.onready called 
Set up and call jqxGrid 

The buttons work fine on the desktop, but not on iOS.

George

[Peter StoevKeymaster]

Hi George,

For displaying Buttons in Cells, use the Button column. See the Popup Editing sample on our website.

Best Regards,
Peter Stoev

jQWidgets Team
http://www.jqwidgets.com

[ghenneParticipant]

That was it!

Here’s the line of code to create a button in a column:

  Grid1_settings.columns = [
    { text: "Name", dataField: "Name", width: "auto" }, 
    { text: "", dataField: "B1", width: 45, columntype: "button", 
      cellsrenderer: function () {return "Stop"}, 
      buttonclick: function (row) {gridButton("Stop", row)}
    }
  ]

Thanks also to RH for the tip!

[seetheoMember]

Is there a way to have more control over the buttonclick event. I would like to have access to the touchstart and touchend events of the button. Also is there a way to directly change the theme of just one button in the column?

Raphael “Theo” Heard

[Author]

Posts