Start Building Professional
Web Apps Today

prevent sorting from additional headers

How do you prevent sorting from happening when you click on a drop down box or a textbox on all attached header? but still have sorting when you click on the top header?

API doesn't provide any call to prevent sorting in header. Clicking on any object in header will force sorting
To prevent such API you can block click event on DOM level

    object.onclick=function(e){  (e||event).cancelBubble=true; }

In case of additional header line it can be done as
   
    grid.hdr.rows[2].onclick=function(e){  (e||event).cancelBubble=true; }

Do I add this to where I initiate the grid or do I add this to the select or input box

If you know the object ( select | input box ) you can use
    object.onclick=function(e){  (e||event).cancelBubble=true; }
If you have not direct reference to object, you can use next code after adding grid headers lines ( and after grid.init() )
    grid.hdr.rows[2].onclick=function(e){  (e||event).cancelBubble=true; }