javascript - dynamically match textbox width with gridview -


i trying dynamicly resize number of textboxes match gridviews tableheads width. gridview allways have same number of columns may vary in width. can see on image, width values doesn't match @ all.

the values comes from:

  • black = width code
  • red = width of textbox inspecting element (firefox)
  • blue = width of tablehead inspecting element (firefox)

black = width code, red = width of textbox, blue = width of tablehead

here's script & style:

<script type="text/javascript">     $(document).ready(function () {         $("#<%= mygridview.clientid %> th").each(function (index) {             $('input[type="text"]:eq(' + index + ')').css('width', $(this).width());             $('input[type="text"]:eq(' + index + ')').css('padding', '0');             $('input[type="text"]:eq(' + index + ')').val($(this).width());         });     }); </script> <style type="text/css">     input[type="text"] {         margin: 0;     } </style> 

as requested, asp code

<input type="text" id="id0"/><!-- comments needed rid of whitespace between text boxes          --><input type="text" id="id1"/><!--          --><input type="text" id="id2"/><!--          --><input type="text" id="id3" /><!--          --><input type="text" id="id4" /><!--          --><input type="text" id="id5" /><!--          --><input type="text" id="id6" />             <br />             <asp:gridview id="mygridview" runat="server"                  headerstyle-cssclass="gridheader" pagerstyle-cssclass="gridpager" footerstyle-cssclass="gridfooter"                  alternatingrowstyle-cssclass ="gridaltitem" cssclass="grid" showfooter="true"                  autogeneratecolumns="false" allowsorting="true" datasourceid="mydatasource"                  onrowupdating="mygridview_rowupdating">                 <columns>                     <asp:boundfield datafield="1" headertext="1" sortexpression="1" readonly="true" />                     <asp:boundfield datafield="2" headertext="2" sortexpression="2" />                     <asp:boundfield datafield="3" headertext="3" sortexpression="3" />                     <asp:boundfield datafield="4" headertext="4" sortexpression="4" />                     <asp:boundfield datafield="5" headertext="5" sortexpression="5" />                     <asp:boundfield datafield="6" headertext="6" sortexpression="6" />                     <asp:boundfield datafield="7" headertext="7" sortexpression="7" />                     <asp:commandfield showeditbutton="true" />                     <asp:commandfield showdeletebutton="true" />                 </columns>                 <footerstyle cssclass="gridfooter"></footerstyle>                 <pagerstyle cssclass="gridpager"></pagerstyle>                 <headerstyle cssclass="gridheader"></headerstyle>                 <alternatingrowstyle cssclass="gridaltitem"></alternatingrowstyle>             </asp:gridview> 

i believe alone sufficient

 input[type="text"] {     margin: 0;     width: 100%; } 

Comments

Popular posts from this blog

basic authentication with http post params android -

vb.net - Virtual Keyboard commands -

How to get multiresult with multicondition in Sql Server -