[Solved] Grid Strange????? With Internet Explorer

[khaldoun]

My grid using internet Explorer 9 is strange  
here is my code :

@{
    Layout = "~/Views/Shared/_RestrictedLayout.cshtml";
    ViewBag.Title = "UpdateOrder";
}
@using System.Globalization;
@using apcurium.AOP.Web.Ressources;
@using apcurium.AOP.Web.Models.MemberUsers;
@using apcurium.AOP.Web.CQRS.Shared;
@model apcurium.AOP.Web.Models.MemberUsers.UpdateOrderModel
<h2>
    @Model.Title
</h2>
<script src="@Url.Content("~/Scripts/jquery.validate.min.js")" type="text/javascript"></script>
<script src="@Url.Content("~/Scripts/jquery.validate.unobtrusive.min.js")" type="text/javascript"></script>
<script type="text/javascript">


    function OnRowDataBound(e) {
        redClass = "inactiveOrderLine";
        if (e.dataItem != null) {
            var status = e.dataItem['Status'];
            if (status == 0) {
                changeClass(e.row.cells[1], redClass);
                changeClass(e.row.cells[2], redClass);
                changeClass(e.row.cells[3], redClass);
                changeClass(e.row.cells[4], redClass);
            }
        }
    }
    function changeClass(element, newClass) {


        element.setAttribute("class", newClass); //For Most Browsers
        element.setAttribute("className", newClass); //For IE; harmless to other browsers.
    }
    function onEdit(e) {
        redClass = "inactiveOrderLine";
        if (e.dataItem != null) {
            var wineId = e.dataItem['ProductId'];
            var id = e.dataItem['Id'];
            $.ajax({
                url: '@Url.Action("GetPrice", "OrderLine")?wineId=' + wineId,
                success: function (response) {
                    document.getElementById("Price").innerHTML = response;
                    //                    if (e.dataItem['Status'] == 0) {
                    //                        changeClass(document.getElementById("Price"), redClass);
                    //                    }

                }
            });
            $.ajax({
                url: '@Url.Action("GetTotalLinePrice", "OrderLine")?id=' + id,
                success: function (response) {
                    document.getElementById("Total").innerHTML = response;
                    //                    if (e.dataItem['Status'] == 0) {
                    //                        changeClass(document.getElementById("Total"), redClass);
                    //                    }

                }
            });

            $(e.form).find('#ProductName').data('tDropDownList').select(function (dataItem) {
                return dataItem.Text == e.dataItem['ProductName'];
            });
        }
    }
    function onLocationTypeChanged() {
        GetDistributionCenters();
    }
    function GetDistributionCenters() {
        var customerCode = document.getElementById("Order_CustomerCode").value;

        alert(customerCode);
        var url = '@Url.Action("GetJsonDistributionCenters/", "MemberUser", new { customerCode = "CUSTOMERCODE_" })';
        url = url.replace("CUSTOMERCODE_", customerCode);
        url = url.replace(/&/g, '&');
        $.ajax({
            url: url,
            success: function (response) {
                PopulateOptions(response);
            }
        });
    }

    function onLoad(e) {
        GetTheTotal();
        var selectedgrid = $('#LinesGrid').data('tGrid');
        selectedgrid.rebind();
    }
    function OnDataBound(e) {
        GetTheTotal();
    }

    function GetTheTotal() {
        $.ajax({
            url: '@Url.Action("GetTheTotal", "OrderLine")',
            success: function (response) {
                document.getElementById("TheTotal").innerHTML = response;
            }
        });

    }


</script>
<div>
    <span style="color: Red">@ViewData["Error"]</span>
</div>
<div class="profile_form">
    @using (Html.BeginForm("UpdateOrder", "MemberUser", FormMethod.Post, null))
    {
        @Html.HiddenFor(o => o.Order.Id)
        @Html.HiddenFor(o => o.Order.CreatedById)
        @Html.HiddenFor(o => o.Order.CreatedByUserName)
        <table width="100%">
            <tr>
                <td colspan="2">
                    @Html.LabelFor(model => model.Order.Status)
                </td>
                <td colspan="2">
                    @Html.DropDownListFor(model => model.Order.Status, Model.Order.ProcessingStatuss, new { @class = "SignUpCombo", style = "width:250px" })
                </td>
            </tr>
            <tr>
                <td>
                    <div class="editor-label">
                        @Html.LabelFor(model => model.Order.CustomerCode)
                    </div>
                </td>
                <td>@Html.ActionLink("(" + Strings.Customer_AddItem + ")", "Update", "Customer")
                </td>
                <td colspan="2">
                    <div class="editor-field">
                        @Html.DropDownListFor(model => model.Order.CustomerCode, Model.Order.Customers, Strings.MemberUser_SelectCustomer, new { @class = "SignUpCombo", style = "width:250px" })
                        @Html.ValidationMessageFor(model => model.Order.CustomerCode)
                    </div>
                </td>
            </tr>
            <tr>
                <td colspan="2">
                    <div class="editor-label">
                        @Html.LabelFor(model => model.Order.DistributionCode)
                    </div>
                </td>
                <td colspan="2">
                    <div class="editor-field">
                        @Html.DropDownListFor(model => model.Order.DistributionCode, Model.Order.DistributionCenters, Strings.MemberUser_SelecteDistributionCenter, new { @class = "SignUpCombo", style = "width:250px" })
                        @Html.ValidationMessageFor(model => model.Order.DistributionCode)
                    </div>
                </td>
            </tr>
            <tr>
                <td colspan="2">
                    @Html.LabelFor(model => model.Order.PickUpMethod)
                </td>
                <td colspan="2">
                    @Html.DropDownListFor(model => model.Order.PickUpMethod, Model.Order.PickUpMethods, new { @class = "SignUpCombo", style = "width:250px" })
                </td>
            </tr>
            <tr>
                <td colspan="4">@Html.LabelFor(model => model.ListLines)
                </td>
            </tr>
            <tr>
                <td colspan="4" style="font-weight: normal; font-size: 80%;">
                    <table width="100%">
                        <tr>
                            <td>
                                @(Html.Telerik().Grid(Model.ListLines).Name("LinesGrid").DataKeys(keys =>
                            {
                                keys.Add(p => p.Id);
                            }).ToolBar(commands => commands.Insert().ButtonType(GridButtonType.Image).ImageHtmlAttributes(new { style = "margin-left:0" })).DataBinding(dataBinding =>
                            {
                                dataBinding.Ajax()
                                    .Select("_SelectAjaxEditing", "OrderLine")
                                    .Insert("_InsertAjaxEditing", "OrderLine")
                                    .Update("_SaveAjaxEditing", "OrderLine")
                                    .Delete("_DeleteAjaxEditing", "OrderLine");
                            }).Columns(columns =>
                            {
                                columns.Command(commands =>
                                {
                                    commands.Edit().ButtonType(GridButtonType.Image);
                                    commands.Delete().ButtonType(GridButtonType.Image);
                                }).Width(60);
                                columns.Bound(p => p.ProductName).Width(250).Title(Strings.OrderLine_ProductName);
                                columns.Bound(p => p.Quantity).Width(40).Title(Strings.OrderLine_Quantity);
                                columns.Bound(p => p.Price).Format("{0:C}").Width(130).Title(Strings.OrderLine_Price).Width(80);
                                columns.Bound(p => p.Total).Format("{0:C}").FooterTemplate(
                                            @<text>
                                <div id="TheTotal" style="text-align: right;">
                                    Total:@string.Format(CultureInfo.CreateSpecificCulture("en-ca"), "{0:c}", Model.TotalPrice.ToString("0.##"))</div>
                                </text>
                                        ).Title(Strings.OrderLine_Total).Width(100);
                            }).ClientEvents(events => events.OnEdit("onEdit").OnDataBound("OnDataBound").OnLoad("onLoad").OnRowDataBound("OnRowDataBound"))
                                        .Editable(editing => editing.Mode(GridEditMode.InLine))
                                        .Pageable()
                                        .Scrollable()
                                        .Sortable()
                                )
                            </td>
                        </tr>
                    </table>
                </td>
            </tr>
            <tr align="right">
                <td colspan="4" align="right">
                    <div class="imageSideTextColumnFull" style="float: right;">
                        <div class="button_container" style="float: right;">
                            <button value="Save" name="submit" type="submit">
                                @Model.ButtonTitle</button>
                        </div>
                    </div>
                </td>
            </tr>
        </table>

    }
</div>