dimanche 25 juin 2017

How to check specifc checkboxes in dynamic html table in asp mvc

We are having requirement to check all checkboxed or specific checkboxes in dynamic table. Also we need to find ids for checked checkboxes and chcked those on page refresh in mvc.

Following is code we are using 



 // For paging for refreshing the page[enter image description here][1]
     $('#@Model.TableId').on( 'page.dt', function () {
                    alert("Click On Page");


                        $('tbody tr td input[type="checkbox"]').prop('checked', true);

                    //var info = table.page.info();
                    //$('#pageInfo').html( 'Showing page: '+info.page+' of '+info.pages );
                } );

                //Code for multi select checkboces
                @*$("#@CheckboxId").click(function() {*@
                $('body').delegate('#@CheckboxId', "click", function () {

                    if ($(this).is(":checked")) {
                        alert("Click on Multiselect check");

                        $('.p_@CheckboxId').prop("checked", true);
                        $('.p_@CheckboxId').parents('tr').addClass("active");

                    } else {
                        $('.p_@CheckboxId').prop("checked", false);
                        $('.p_@CheckboxId').parents('tr').removeClass("active");
                    }
                });
                table.on('change', 'tbody tr .checkboxes', function () {
                    $(this).parents('tr').toggleClass("active");
                });


                $('#@Model.TableId').on('click', ':checkbox', function(){
                    alert("Click on individual check");
                    var RowIndex=$(this).closest('tr').index();
                    var data = window["@Model.TableId"].fnGetData(RowIndex);
                    if ($(this).is(":checked")) {
                        $(this).prop("checked", true);
                        $(this).parents('tr').addClass("active");
                        $('#@Model.TableId tbody tr:eq('+RowIndex+')').addClass("active");
                    } else {
                        $(this).prop("checked", false);
                        $(this).parents('tr').removeClass("active");
                        $('#@Model.TableId tbody tr:eq('+RowIndex+')').removeClass("active");
                    }

                }); 

Html Code

if( Table_Id=="Contact" || Table_Id=="Targets"  || Table_Id=="Companies")
                            {
                                if(Table_Id=="Contact")
                                {
                                    //return '<button class="dropdown"><a class="btn btn-default actionButton" data-toggle="dropdown" href="#"> Action</a></button>';
                                    return ' <input type="checkbox"  class="p_@CheckboxId" id="chk" /> &nbsp; <div class="btn-group" role="group" id="test"><button type="button" class="btn btn-xs btn-default dropdown-toggle btnListViewMenu rowlink" data-toggle="dropdown" aria-expanded="false" id="Ulbuttom"><i class="fa fa-cog fa-fw"></i><span class="caret"></span></button><ul id="infoi" class="dropdown-menu  "   role="menu"><li><a class="" name="Remove" id="btnupdate_@Model.TableId" title="Update"><i  class="fa fa-edit"></i><span style="color:black;">@Resources.Common.Edit</span></a></li><li><a id="btnSendEmail_@Model.TableId" title="Send Email"><i class="fa fa-envelope"></i><span style="color:black;">@Resources.Common.SendEmail</span></a></li><li><a id="btnGenreateDocument_@Model.TableId" title="Genreate Document"><i class="fa fa-file"></i><span style="color:black;">@Resources.Common.GenerateDocument</span></a></li><li><a id="btndelete_@Model.TableId" title="Delete"><i class="fa fa-trash-o"></i><span style="color:black;">@Resources.Common.Delete</span></a></li></ul></div></div></div><div id="preview_@Model.TableId" class="btn-group" role="group"><button type="button"   class="btn btn-xs btn-default" aria-expanded="false"><a id="btnListPriview_@Model.TableId"<span style="color:black" class="fa fa-eye"></span></a></button></div></div>';
                                }
                                else
                                {
                                    return ' <input type="checkbox"  class="p_@CheckboxId" /> &nbsp; <div class="btn-group" role="group" id="test"><button type="button" class="btn btn-xs btn-default dropdown-toggle btnListViewMenu" data-toggle="dropdown" aria-expanded="false"><i class="fa fa-cog fa-fw"></i><span class="caret"></span></button><ul  class="dropdown-menu  "   role="menu"><li><a class="" name="Remove" id="btnupdate_@Model.TableId" title="Update"><i  class="fa fa-edit"></i><span style="color:black;">@Resources.Common.Edit</span></a></li><li><a id="btnSendEmail_@Model.TableId" title="Send Email"><i class="fa fa-envelope"></i><span style="color:black;">@Resources.Common.SendEmail</span></a></li><li><a id="btnGenreateDocument_@Model.TableId" title="Genreate Document"><i class="fa fa-file"></i><span style="color:black;">@Resources.Common.GenerateDocument</span></a></li><li><a id="btndelete_@Model.TableId" title="Delete"><i class="fa fa-trash-o"></i><span style="color:black;">@Resources.Common.Delete</span></a></li></ul></div></div></div><div id="preview_@Model.TableId" class="btn-group" role="group"><button type="button"   class="btn btn-xs btn-default" aria-expanded="false"><a id="btnListPriview_@Model.TableId"<span style="color:black" class="fa fa-eye"></span></a></button></div></div>';
                                }
                            }

Please can somebody help us , how to store ids of checkbox in array and set those checkbox having id.




Aucun commentaire:

Enregistrer un commentaire