How to change the asp.net gridview column width using jquery ajax -
i creating webpage using asp.net, c#, bootstrap , jquery. now, have taken grdiview , given bootstrap "table" class css-class gridview. now, data loaded gridview using jquery ajax. detail code given below:
.aspx page
<div id="user_list"> <asp:gridview id="grduserslist" runat="server" autogeneratecolumns="false" cssclass="table table-hover" headerstyle-cssclass="info"></asp:gridview> </div>
jquery ajax
function showactiveusers(stat) { alert(stat); $.ajax({ type: "get", url: "http://localhost:49541/admin_userdet.svc/allusers?stat="+stat, datatype: "json", contenttype: "application/json; utf-8", success: populateuserslist, error: function (xhr, errortype, exception) { alert("error: " + errortype); alert(exception); } }); } function populateuserslist(response) { //console.log(response); $('#childcontent_grduserslist').empty(); if (response.length > 0) { $('#childcontent_grduserslist').append('<tr><th class="info" style="width: 100px;">name</th>\ <th class="info">login id</th>\ <th class="info">email id</th>\ <th class="info">phone no.</th>\ <th class="info">designation</th>\ <th class="info">reporting to</th>\ <th class="info">business</th>\ <th class="info">user type</th></tr>'); $.each(response, function (index, itemdata) { $('#childcontent_grduserslist').append('<tr><td class="text-left">' + itemdata.username + '</td>\ <td class="text-left">' + itemdata.loginid + '</td>\ <td class="text-left">' + itemdata.emailid + '</td>\ <td class="text-left">' + itemdata.phone + '</td>\ <td class="text-left">' + itemdata.designation + '</td>\ <td class="text-left">' + itemdata.reportingto + '</td>\ <td class="text-left">' + itemdata.businessassigned + '</td>\ <td class="text-left">' + itemdata.usertype + '</td></tr>'); }); } }
as can see have used "style=width:100px;" 1st column. but, still width not getting changed.
please suggest me how achieve this.
thanks.
after ajax call,ie after grid rendered apply width,ie
$.ajax({ //your ajax operations }); //then apply width $('#childcontent_grduserslist').find('th').css('width', '100')
Comments
Post a Comment