Need help on setting width of the datatable column

Need help on setting width of the datatable column

MadhuSudhanMadhuSudhan Posts: 4Questions: 2Answers: 0

I am unable to set the width of the column of a datatable, Can you please provide me the modified code of the below:

HTML :

C# server code :
public void ConvertAdhocDataToJSON(eUserRequestType RequestType)
{
const string infoImageTbl = "

{0}{1}

";
const string infoImage = "

 

";
hdnAdhoc.Value = null;
DataTable Dt;
try
{
Dt = GetAdhocData(RequestType);
lblBGSchedulesNo.Visible = false;

        // Create JSON
        var dtDataRows = (from eachRow in Dt.AsEnumerable()
                          select new
                          {
                              RbtnCol = eachRow.Field<string>("RbtnCol").Trim(),
                              ProfileName = eachRow.Field<string>("ProfileName").Trim(),
                              JobStatus = eachRow.Field<string>("JobStatus").Trim(),
                              LastRunOn = eachRow.Field<string>("LastRunOn").Trim()

                          }).ToList();

        #region BindingHedaer
        var ColNames = new List<object>();
        foreach (DataColumn eachColName in Dt.Columns)
        {
            var columnDisplayName = string.Empty;
            var columnInternalName = eachColName.ColumnName;
            switch (columnInternalName.ToString())
            {
                case "RbtnCol":
                    columnDisplayName = ".";
                    break;
                case "ProfileName":
                    columnDisplayName = string.Format(infoImageTbl, infoImage, "Job Name"); // "Job Name";
                    break;
                case "JobStatus":
                    columnDisplayName = string.Format(infoImageTbl, infoImage, "Status"); // "Status";
                    break;
                case "LastRunOn":
                    columnDisplayName =  "Last Run Date";// "Last Run Date";
                    break;
                default:
                    columnDisplayName = "";
                    break;
            }
            if (!string.IsNullOrEmpty(columnDisplayName))
            {
                ColNames.Add(new { title = columnDisplayName, mDataProp = columnInternalName });
            }
        }
        #endregion


        var ToolTips = new List<object>();
        ToolTips.Add"Col1"); //col 1
        ToolTips.Add("col2"); //col 2

        //Create Label localization
        var returnData = (new
        {
            TableData = dtDataRows,
            TableColNames = ColNames,
            ToolTipNames = ToolTips
        });
        //Create string form of JSON
        JavaScriptSerializer serializer = new JavaScriptSerializer();
        var json = serializer.Serialize(returnData);
        hdnAdhoc.Value = json;
        ScriptManager.RegisterStartupScript(this.Page, this.GetType(), "function", "<script type='text/javascript'>AdhocGrid();</script>", false);
        tabManageProfiles.SelectedTab = 2;
        this.DisplayPanel(2);
    }
    catch (Exception Ex)
    {
        Dt = null;
        this.oProfileSchedulesWebManager.LogError(this.oProfileSchedulesWebManager.oProfileScheduleData.clientId, this.oProfileSchedulesWebManager.oProfileScheduleData.userId, moduleName, "SchedulesAdminQueue", Ex);
    }

}

Jquery Code :

/Adhoc Grid/
function AdhocGrid()
{
var JSONData = jQuery.parseJSON($("#hdnAdhoc").val());
var columnsAdhoc = JSONData.TableColNames;
var dsAdhoc = JSONData.TableData;
var ToolTipNames = JSONData.ToolTipNames;

$("#divAdhoc").html("

");
$Adhoctable = $('#tblAdhocGrid');
//Setting grid properties
var tblAdhoc = $('#tblAdhocGrid').DataTable({
"data": dsAdhoc,
"columns": columnsAdhoc,
"aaSorting": [[3, "desc"]],
"bScrollInfinite": true,
"sScrollY": "400px",
"sScrollX": "100%",
"sScrollXInner": "100%",
"bScrollCollapse": true,
"bPaginate": true,
"fnDrawCallback": function()
{
$Adhoctable.dataTable()._fnScrollDraw();
$Adhoctable.closest(".dataTables_scrollBody").height(370);
},
"bAutoWidth": false // Disable the auto width calculation

});
//For Applying Tooltip
$('th').hover(function()
{
var sTitle;
sTitle = jQuery(this).text();
var colIndex = $(this).index();
if (colIndex == 1) { this.setAttribute('title', ToolTipNames[0]); }
else if (colIndex == 2) { this.setAttribute('title',ToolTipNames[1]);}
},
function()
{
$(this).css("background", "");
});

// new $.fn.dataTable.FixedHeader(tblAdhoc);
} //End of Adhoc function

As i am not able to set the width of the columns whenever i am doing the resize of the window header columns width not increasing to maximum.

Please help me as soon as possible, My deliver date is very near.
Regards
Madhu

This discussion has been closed.