How to rid of empty div that contains a GridView

Question

In ASP.NET Gridviews generate a table which generates a parent div container. This can break CSS layouts since there is no way to attach styles to the generated div. Is ther

Answer 1

UPDATE

Ians response does remove much of the hackery from this but it also requires more effort on my part. I think we can have the best of both worlds if we do this just a little differently...

We no longer want to add a 'table-responsive' div to our source at all. We DO want to add a 'table-responsive-table' to our GridView classes.

ASP

Our JavaScript just needs to add the 'table-responsive' class to the parent div of those 'table-responsive-table' class tables that we've added.

JS

$( document ).ready(function() {
  $(".table-responsive-table").parent().addClass('table-responsive');
});

This will generate:

HTML

    
This new output should be relatively free of hackery related problems due to the fact that we have exactly the same output in the end as we would've otherwise had (except for the extra class on the table), we do not need to modify this code for every table (meaning we can write it once and it'll automatically be applied to all GridViews with the 'table-responsive-table' class), and we are not moving\copying the table data at all (this is important for speed, paging, and sorting). I know everyone says they have the best answer but I really do think this is the absolute best way of handling this.
NOTE: I have not tested this new code but it will probably work just fine.

                                                        

              
                
                0
              
                   
                
               讨论(0)
              
                                                  
              
              

                          
             
       
          
              
                                       

     查看其它8个回答


            

                    



               
            

    发布评论:
    

         
                        
    
    
提交评论 
  
  

                    
                    

                    

                        

                        
                         加载中...
                        
                    
                

          

            
            

              
              

            
    


                                 
              
            
                          
    

        
         

                验证码
                

                  
                
                

                   看不清?
                
              
                                  

                    
   
                 
             
              
提交回复
            
          
        

          
 
     
 

        
热议问题