This is a migrated thread and some comments may be shown as answers.

[Solved] Header cell paddings and Data cell paddings alignmnet issue in Telerik Mvc grid.

0 Answers 15 Views
Grid
This is a migrated thread and some comments may be shown as answers.
This question is locked. New answers and comments are not allowed.
Raja
Top achievements
Rank 1
Raja asked on 24 Dec 2012, 10:59 AM
Hi,
         I have some issues when using the telerik grid.

         Actualy the problems is that the width of the column headings or data cell paddings
         is being increased or decreased by few pixel when clicking on the Add new record button.
        
         Before 'Add new record' button click the grid Alignment is fine.

         I have attached two screen shot.
   
         My Code :

        @(Html.Telerik().Grid(lstPaymentMaster)
        .Name("Grid")
        .HtmlAttributes(new { style = "width: 990px" })
        .DataKeys(keys => keys.Add(c => c.PaymentMasterID))
        .ToolBar(commands => commands.Insert().ButtonType(GridButtonType.ImageAndText).ImageHtmlAttributes(new { style = "margin- left:0" }))
        .DataBinding(dataBinding => dataBinding.Server().Insert("AddPaymentDetails", "Fee",
        new { mode = GridEditMode.InLine }).Update("EditPaymentMasterDetails", "Fee").Delete("DeletePaymentMasterDetails",
        "Fee")).Columns(columns =>
        {
            columns.Template(
                @<text>
        @{
            <input type="checkbox" name="checkedRecords" value="@item.PaymentMasterID"  />
        }
        </text>).Width(50);
            columns.Template(
            @<text>
        @{
            @Html.DropDownList("PayType", itemPayType);
        }
        </text>).Title("Pay Type").Width(30);
            columns.Bound(item => item.PaymentInstlNo).Title("Instal#").Width(100);
            columns.Bound(item => item.PaymentAmt).Title("Amount").Width(100);
            columns.Template(
            @<text>
        @{
            @Html.DropDownList("PaymentMode", item.PaymentMode);
        }
        </text>).Title("Payment Mode").Width(40);

            columns.Bound(item => item.PaymentDt).Title("Date").Width(100);
            columns.Bound(item => item.PaymentLateFee).Title("Late Fee").Width(30);
            columns.Template(
            @<text>
        @{
            <a id="lnkPaymentMode" style="color:Blue" onclick="CallChequeTelerikView('@item.PaymentMasterID')">@item.PaymentMode
                Dtl</a>
           
        }
        </text>).Title("Detail").Width(50);
            columns.Template(
        @<text>
        @{
            @Html.DropDownList("PayStatus", itemPayStatus);
        }
        </text>).Title("Status").Width(60);
            columns.Template(
           @<text>
        @{
            @Html.ActionLink("Print", "Fee");
        }
        </text>).Width(50);
            columns.Command(commands => { commands.Edit().ButtonType(GridButtonType.Text); commands.Delete().ButtonType(GridButtonType.Text); }).Title("Commands").Width(180);
        }).Editable(editing => editing.Mode(GridEditMode.InLine))

                            .Pageable(p => p.PageSize(Convert.ToInt32(Campus.Models.Settings.PageSize)))
                    .Sortable()


        )

     Please suggest me the solution regarding above issue. i am very new to mvc.
 
      I have attached the screen shot for regarding issue.

Thanks & Regards,
Narayanan.

Tags
Grid
Asked by
Raja
Top achievements
Rank 1
Share this question
or