jeudi 14 septembre 2017

how to get checked checkbox values on listview with jquery.datatables.js feature

There is an asp listview object on my page. I have implemented jquery dataTables js to this listview. It works. I have added static values to bind this listview. I have added these dummy items on codebehind. I have added one button, textbox for email and result for label. I am trying to this: checking some items on listview( example: first page i check 2 items, second page i check 2 items, third page i check 2 items..) and then enter any dummy 'email address' in to email input and then click button. this button should send selected id values with coma and email address to the test.ashx file like this: test.ashx?email=dummy@email.com&SelectedIdValues=3,7,13,17,24,29

and then this test.ashx returns me a json like this with 3 properties; ok_code, message, userId

if i get 'ok_code' 999 from test.ashx file i need to write message and userId result in to result label. I have been trying to solve this almost a month. I need help. I have tried some solutions but it repeats same checkbox id values. If you ask my solution i can post it also. Let me share all files which include static dummy values (ready to run) Thanks.

test.aspx and test.ashx in same directory. testUserReturn.cs and myUsers.cs are in App_Code directory.

1-header part of test.aspx

<head runat="server">
<meta http-equiv="content-type" content="text/html; charset=UTF-8" />
<title>test page</title>
<meta name="viewport" content="initial-scale=1.0, user-scalable=no" />
<link type="text/css" rel="stylesheet" href="css/bootstrap.css" />
<script type="text/javascript" src="http://ift.tt/1XwG72U"></script>
<script type="text/javascript" src="js/bootstrap.min.js"></script>
<script src="js/datatables/jquery.dataTables.js" type="text/javascript"></script>
 <script type="text/javascript">
     var scl = null;
     var reinit = true;
     function tablesorterloader() {
         $(document).ready(function () {
             function getUrlVars() {
                 var vars = [], hash;
                 var hashes = window.location.href.slice(window.location.href.indexOf('?') + 1).split('&');
                 for (var i = 0; i < hashes.length; i++) {
                     hash = hashes[i].split('=');
                     vars.push(hash[0]);
                     vars[hash[0]] = hash[1];
                 }
                 return vars;
             }

             var sclv = 0;
             var sclp = 0;

             if (getUrlVars()["t"]) {
                 sclv = getUrlVars()["t"];
             }

             if (getUrlVars()["d"]) {
                 sclp = getUrlVars()["d"];
             }

             var tbl = $('#listViewRecordsTable').DataTable({
                 "language": {
                     "lengthMenu": "FOR ALL PAGES _MENU_ RECORDS",
                     "zeroRecords": "THERE IS NO RECORD",
                     "info": "_PAGE_ / _PAGES_ PAGES ARE SHOWN",
                     "infoEmpty": "",
                     "infoFiltered": "(toplam _MAX_ RECORDS ARE SHOWN)",
                     "sSearch": "SEARCH"
                 },
                 "fnDrawCallback": function (oSettings) {
                     if (islemTamamlandiMi_4Checkbox_unchecked == true) {
                         unCheckAll(this);
                     }
                     yetkiIslemleri();
                 }
             });

             var info = tbl.page.info();

             if (sclv != "") {

                 var selectedNode = tbl.row("#" + sclv).node();
                 var nodePosition = tbl.rows({ order: 'current' }).nodes().indexOf(selectedNode);
                 var pageNumber = Math.floor(nodePosition / 10);

                 tbl.page(pageNumber).draw(false);
             }


             $('#listViewRecordsTable').on('draw.dt', function () {

                 tableRowEvents();
             });
             tableRowEvents();
             function tableRowEvents() {

                 $('.dataTables_paginate').addClass("btn-group datatable-pagination");
                 $('.dataTables_paginate > a').wrapInner('<span />');
                 $('.dataTables_paginate > a:first-child').append('<i class="icon-chevron-left shaded"></i>');
                 $('.dataTables_paginate > a:last-child').append('<i class="icon-chevron-right shaded"></i>');

                 $("#listViewRecordsTable tr:gt(0) .detay").each(function (inx) {


                     $(this).click(function () {


                     });


                 });

                 if (sclv != "") {
                     $("#listViewRecordsTable tr#" + sclv + " td").css({ "background": "#e55757", "color": "#ffffff" });
                 }


             }

             setTimeout("$('.alert').hide();", 2000);

             reinit = false;

         });
     }

     tablesorterloader();

     function pageLoad(sender, args) {
         if (reinit == true) {
             tablesorterloader();
         }
         reinit = true;
     }
</script>

2-body part of test.aspx

<body>
<form id="form1" runat="server">
<div id="divListView" class="container-fluid">
    <asp:ListView ID="myListView" runat="server" OnItemCommand="listView_OnItemCommand"
        OnItemDataBound="listView_ItemDataBound">
        <LayoutTemplate>
            <table id="listViewRecordsTable" cellpadding="0" cellspacing="0" border="0" class="table">
                <thead>
                    <tr>
                        <th style="text-align: left; width: 2%;">
                            <asp:CheckBox ID="CheckBox1" runat="server" AutoPostBack="false" onchange="CheckAll(this);" />
                        </th>
                        <th style="text-align: left;">
                            user id
                        </th>
                        <th style="text-align: left;">
                            user name
                        </th>
                    </tr>
                </thead>
                <tbody>
                    <asp:PlaceHolder ID="itemPlaceholder" runat="server" />
                </tbody>
            </table>
        </LayoutTemplate>
        <ItemTemplate>
            <tr>
                <td>
                    <asp:CheckBox ID="checkBoxSec" Name="myCheckBoxes" runat="server" CssClass="checkBoxExample"
                        Value='<%#Eval("userName")%>' />
                </td>
                <td>
                    <%# Eval("userID").ToString() == "no data" ? "" : Eval("userID")%>
                    <asp:HiddenField ID="hfID" Value='<%#Eval("userID") %>' runat="server" />
                </td>
                <td>
                    <%# Eval("userName").ToString() == "no data" ? "" : Eval("userName")%>
                </td>
            </tr>
        </ItemTemplate>
        <EmptyDataTemplate>
            there is no data
        </EmptyDataTemplate>
    </asp:ListView>
</div>
<hr />
<div class="col-xs-2">
    <asp:TextBox ID="txtEmail" Text="type your e-mail address" class="form-control hidden-xs hidden-sm hidden-md"
        runat="server"></asp:TextBox>
</div>
<div class="col-xs-2">
    <button id="btnRegister" type="button" class="btn btn-warning hidden-xs hidden-sm hidden-md">
        register new user</button>
</div>
<div class="col-xs-2">
    <asp:Label ID="labelResult" runat="server" Text="result label"></asp:Label>
</div>
</form>

3-test.aspx.cs

    protected void Page_Load(object sender, EventArgs e)
{
    myUsers omyUsers = new myUsers();
    List<myUsers> myUserList = new List<myUsers>();

    #region let me create DATA for my listview

    //create humans
    myUsers newHuman1 = new myUsers();
    myUsers newHuman2 = new myUsers();
    myUsers newHuman3 = new myUsers();
    myUsers newHuman4 = new myUsers();
    myUsers newHuman5 = new myUsers();
    myUsers newHuman6 = new myUsers();
    myUsers newHuman7 = new myUsers();
    myUsers newHuman8 = new myUsers();
    myUsers newHuman9 = new myUsers();
    myUsers newHuman10 = new myUsers();
    myUsers newHuman11 = new myUsers();
    myUsers newHuman12 = new myUsers();
    myUsers newHuman13 = new myUsers();
    myUsers newHuman14 = new myUsers();
    myUsers newHuman15 = new myUsers();
    myUsers newHuman16 = new myUsers();
    myUsers newHuman17 = new myUsers();
    myUsers newHuman18 = new myUsers();
    myUsers newHuman19 = new myUsers();
    myUsers newHuman20 = new myUsers();
    myUsers newHuman21 = new myUsers();
    myUsers newHuman22 = new myUsers();
    myUsers newHuman23 = new myUsers();
    myUsers newHuman24 = new myUsers();
    myUsers newHuman25 = new myUsers();
    myUsers newHuman26 = new myUsers();
    myUsers newHuman27 = new myUsers();
    myUsers newHuman28 = new myUsers();
    myUsers newHuman29 = new myUsers();
    myUsers newHuman30 = new myUsers();
    myUsers newHuman31 = new myUsers();
    myUsers newHuman32 = new myUsers();

    //adding user id values
    newHuman1.userID = 1;
    newHuman2.userID = 2;
    newHuman3.userID = 3;
    newHuman4.userID = 4;
    newHuman5.userID = 5;
    newHuman6.userID = 6;
    newHuman7.userID = 7;
    newHuman8.userID = 8;
    newHuman9.userID = 9;
    newHuman10.userID = 10;
    newHuman11.userID = 11;
    newHuman12.userID = 12;
    newHuman13.userID = 13;
    newHuman14.userID = 14;
    newHuman15.userID = 15;
    newHuman16.userID = 16;
    newHuman17.userID = 17;
    newHuman18.userID = 18;
    newHuman19.userID = 19;
    newHuman20.userID = 20;
    newHuman21.userID = 21;
    newHuman22.userID = 22;
    newHuman23.userID = 23;
    newHuman24.userID = 24;
    newHuman25.userID = 25;
    newHuman26.userID = 26;
    newHuman27.userID = 27;
    newHuman28.userID = 28;
    newHuman29.userID = 29;
    newHuman30.userID = 30;
    newHuman31.userID = 31;
    newHuman32.userID = 32;

    //adding user name values
    newHuman1.userName = "Jeny1";
    newHuman2.userName = "Jeny2";
    newHuman3.userName = "Jeny3";
    newHuman4.userName = "Jeny4";
    newHuman5.userName = "Jeny5";
    newHuman6.userName = "Jeny6";
    newHuman7.userName = "Jeny7";
    newHuman8.userName = "Jeny8";
    newHuman9.userName = "Jeny9";
    newHuman10.userName = "Jeny10";
    newHuman11.userName = "Jeny11";
    newHuman12.userName = "Jeny12";
    newHuman13.userName = "Jeny13";
    newHuman14.userName = "Jeny14";
    newHuman15.userName = "Jeny15";
    newHuman16.userName = "Jeny16";
    newHuman17.userName = "Jeny17";
    newHuman18.userName = "Jeny18";
    newHuman19.userName = "Jeny19";
    newHuman20.userName = "Jeny20";
    newHuman21.userName = "Jeny21";
    newHuman22.userName = "Jeny22";
    newHuman23.userName = "Jeny23";
    newHuman24.userName = "Jeny24";
    newHuman25.userName = "Jeny25";
    newHuman26.userName = "Jeny26";
    newHuman27.userName = "Jeny27";
    newHuman28.userName = "Jeny28";
    newHuman29.userName = "Jeny29";
    newHuman30.userName = "Jeny30";
    newHuman31.userName = "Jeny31";
    newHuman32.userName = "Jeny32";

    //adding users to my user list
    myUserList.Add(newHuman1);
    myUserList.Add(newHuman2);
    myUserList.Add(newHuman3);
    myUserList.Add(newHuman4);
    myUserList.Add(newHuman5);
    myUserList.Add(newHuman6);
    myUserList.Add(newHuman7);
    myUserList.Add(newHuman8);
    myUserList.Add(newHuman9);
    myUserList.Add(newHuman10);
    myUserList.Add(newHuman11);
    myUserList.Add(newHuman12);
    myUserList.Add(newHuman13);
    myUserList.Add(newHuman14);
    myUserList.Add(newHuman15);
    myUserList.Add(newHuman16);
    myUserList.Add(newHuman17);
    myUserList.Add(newHuman18);
    myUserList.Add(newHuman19);
    myUserList.Add(newHuman20);
    myUserList.Add(newHuman21);
    myUserList.Add(newHuman22);
    myUserList.Add(newHuman23);
    myUserList.Add(newHuman24);
    myUserList.Add(newHuman25);
    myUserList.Add(newHuman26);
    myUserList.Add(newHuman27);
    myUserList.Add(newHuman28);
    myUserList.Add(newHuman29);
    myUserList.Add(newHuman30);
    myUserList.Add(newHuman31);
    myUserList.Add(newHuman32);

    #endregion

    if (IsPostBack == false)
    {
        myListView.DataSource = myUserList;
        myListView.DataBind();
    }
}

4-test.ashx

 public void ProcessRequest(HttpContext context)
{
    System.Text.StringBuilder sb = new System.Text.StringBuilder();

    testUserReturn otestUserReturn = new testUserReturn();

    string email = context.Request.QueryString["email"];
    string idList = context.Request.QueryString["yetki"];
    string[] idArray = idList.Split(',');

    if (email != "" && idList != "")
    {
        otestUserReturn.ok_code = "999";
        otestUserReturn.message = "success";
        otestUserReturn.userId = "23";
    }
    else
    {
        otestUserReturn.ok_code = "998";
        otestUserReturn.message = "failed";
        otestUserReturn.userId = "0";
    }

    var json = new System.Web.Script.Serialization.JavaScriptSerializer().Serialize(otestUserReturn);

    context.Response.ContentType = "application/json";
    context.Response.ContentEncoding = System.Text.Encoding.UTF8;
    context.Response.Write(json);
    context.Response.End();
}

public bool IsReusable
{
    get
    {
        return false;
    }
}

5-testUserReturn.cs

    public string message { get; set; }
public string ok_code { get; set; }
public string userId { get; set; }

6-myUser.cs

    public int userID { get; set; }
public string userName { get; set; }

Aucun commentaire:

Enregistrer un commentaire