مرجع تخصصی برنامه نویسان

انجمن تخصصی برنامه نویسان فارسی زبان

کاربر سایت

mojtaba_khooshrou

عضویت از 1394/02/06

چک باکس در کندو گرید

  • یکشنبه 7 تیر 1394
  • 11:06
تشکر میکنم

با سلام به استاد  عزیز و دوستان گرامی

بنده یک کندو دارم که زمان لود لیست دانش اموزان را می آورد و بعد از این که تیک ها خورده شد و به سمت سرور پاس داده شد و ذخیره می شود مشکل من زمانی است که دوباره لود می شود یعنی من می خواهم که زمانی که دوباره لود  می شود انهایی که تیک خورده اند به صورت تیک خورده باشند از روش Bound  رفتم چک باکس برای همیشه غیر فعال است این سمپل دستکاری کردم الان کار می کند فقط زمانی که دیتا گرید پر شد من با  Jqueryبتوانم روی دیتا که در گرید لود شده است بچرخم و انهایی که در مدل پاس داده شده True  هستند را با استفاده از Jquery چک با کس انها را فعال کنم ممنون می شوم 

@using System.Web.UI.WebControls
@model IEnumerable<Pardon.Models.ViewModel.RollCallClassTeachers>

<button id="showSelection" class="btn btn-success ">ذخیره</button>
<br />
<div id="grid"></div>
<script>
    $(document).ready(function () {
        //DataSource definition
        var crudServiceBaseUrl = "/Teacher/CoursesSystem",
        dataSource = new kendo.data.DataSource({
            transport: {
                read: {
                    url: crudServiceBaseUrl + "/ReadRollCallClassTeacher/@ViewBag.CoursesSystemTime_ID",
                    dataType: "json"
                },
                parameterMap: function (options, operation) {
                    if (operation !== "read" && options.Model) {
                        return {
                            models: kendo.stringify(options.Model)
                        };
                    }
                }
            },
            batch: true,
            pageSize: 20,
            schema: {
                model: {
                    id: "MainIDCombine",
                    fields: {
                        CoursesSystem_ID: {
                            editable: false,
                            nullable: true,
                        }
                        ,
                        ISSelected: {
                            editable: false,
                            nullable: true,
                        }
                        ,
                        MainIDCombine: {
                            editable: false,
                            nullable: true,
                            title: "ID"
                        },
                        per_Name: {
                            editable: false,
                            nullable: true,
                            title: "نام"
                        },
                     
                        per_Family: {
                            editable: false,
                            nullable: true,
                            title: "نام خانوادگی"
                        }
                        }
                    }
                }
        });

        //Grid definition
        var grid = $("#grid").kendoGrid({
            dataSource: dataSource,
            pageable: true,
            height: 430,
            //define dataBound event handler
            dataBound: onDataBound,

            columns: [
            //define template column with checkbox and attach click event handler
            { template: "<input type='checkbox' class='checkbox' />" },            
            {
                field: "per_Name",
                width: "100px",
                title: "نام"
            }
           , {
               field: "per_Family",
               width: "100px",
               title: "نام خانوادگی"
           }
           ,
           {
               field: "ISSelected",
               width: "10px",
               title: "نامگی"
           }
            ],
            editable: "inline"
        }).data("kendoGrid");

        //bind click event to the checkbox
        grid.table.on("click", ".checkbox", selectRow);

        $("#showSelection").bind("click", function () {
            var  checked = [];
            for (var i in checkedIds) {
                if (checkedIds[i]) {
                    checked.push(i);
                }
            }

            $.ajax({
                url: "/Teacher/CoursesSystem/SaveRollCallClassTeacher",
                type: "POST",
                data: { id: checked },

            }).done(function (result) {                
                humane.log("اطلاعات با موفقیت ثبت گردید");                
            });
        });
    });

    var checkedIds = {};

    //on click of the checkbox:
    function selectRow() {
        var checked = this.checked,
        row = $(this).closest("tr"),
        grid = $("#grid").data("kendoGrid"),
        dataItem = grid.dataItem(row);

        checkedIds[dataItem.id] = checked;
        if (checked) {
            //-select the row
            row.addClass("k-state-selected");
        } else {
            //-remove selection
            row.removeClass("k-state-selected");
        }
    }

    //on dataBound event restore previous selected rows:
    function onDataBound(e) {
        var view = this.dataSource.view();
        for (var i = 0; i < view.length; i++) {
            if (checkedIds[view[i].id]) {
                this.tbody.find("tr[data-uid='" + view[i].uid + "']")
                .addClass("k-state-selected")
                .find(".checkbox")
                .attr("checked", "checked");
            }
        }
    }
    //$(document).ready(
    //     function BoundChecked()
    //     {
    //         var view = this.dataSource.view();
    //         for (var i = 0; i < view.length; i++) {
    //             if (view[i].ISSelected==true) {
    //                 this.tbody.find("tr[data-uid='" + view[i].uid + "']")
    //                 .addClass("k-state-selected")
    //                 .find(".checkbox")
    //                 .attr("checked", "checked");
    //             }
    //         }

    //     }
    //    )
</script>



 

پاسخ های این پرسش

تعداد پاسخ ها : 2 پاسخ
کاربر سایت

پاکان رحمانی

عضویت از 1393/05/16

  • دوشنبه 8 تیر 1394
  • 09:38

سلام

از روش زیر استفاده کنید

    @(Html.Kendo().Grid<OrdersViewModel>()
          .Name("Orders")
          .Columns(c =>
          {
              c.Bound(p => p.Error)
                  .Title("Error")
                  .ClientTemplate("<input type='checkbox' #= Error ? checked='checked': '' # class='chkbx' />")
                  .HtmlAttributes(new {style = "text-align: center"})
                  .Width(50);


<script>
    $(function() {
        $('#Orders').on('click', '.chkbx', function() {
            var checked = $(this).is(':checked');
            var grid = $('#Orders').data().kendoGrid;
            var dataItem = grid.dataItem($(this).closest('tr'));
            dataItem.set('Error', checked);
        });
    });
</script>

 

کاربر سایت

mojtaba_khooshrou

عضویت از 1394/02/06

  • دوشنبه 8 تیر 1394
  • 11:26

با سلام به دوست عزیز 

این مدل که شما به نمایش گذاشته اید  زمانی می توانیم تیک بزنیم که در حالت ویرایش باشد و منظور من در حالت غیر از ویرایش است 

ولی ممنون از این که به سوالات من پاسخ دادید 

مشکل با دو تا گرید حل کردم برای اولین بار از بالایی و برای دومین بار که دیتا دارد از مدل دوم استفاده کردم 

کاربرانی که از این پست تشکر کرده اند

هیچ کاربری تا کنون از این پست تشکر نکرده است

اگر نیاز به یک مشاور در زمینه طراحی سایت ، برنامه نویسی و بازاریابی الکترونیکی دارید

با ما تماس بگیرید تا در این مسیر همراهتان باشیم :)