WebGrid Paging

Abdul Wasit
Abdul W...
4 Points
2 Posts

////Controller Code/////

public ActionResult AdminIndexsearch()
        {
            DateTime date = Convert.ToDateTime(Request.Form["txtdatefrom"]).Date;
            DateTime dateto = Convert.ToDateTime(Request.Form["txtdateto"]).Date;
            CombinedBookereceiverInfo objcombine = new CombinedBookereceiverInfo();
            var AdminData = new List<CombinedBookereceiverInfo>();

            AdminData = db.CombinedBookereceiverInfoes.Where(x => x.DateofBooking >= date && x.DateofBooking <= dateto).ToList();
return view(AdminData);
}

 

//// View Code /////

@model List<GoPickCourierDDL.Models.CombinedBookereceiverInfo>

@{
    ViewBag.Title = "Admin";
    var grid = new WebGrid(source: Model, canPage: true, rowsPerPage: 5);
    grid.Pager(WebGridPagerModes.All);
}

<style type="text/css">
    /*Here we will add css for style webgrid*/
    .webgrid-table {
        font-family: "Trebuchet MS", Arial, Helvetica, sans-serif;
        font-size: 14px;
        width: 100%;
        display: table;
        border-collapse: separate;
        border: solid 1px #2d7cb7;
        background-color: #efecec;
    }

        .webgrid-table td, th {
            border: 1px solid #2d7cb7;
            color: #2d7cb7;
            padding: 3px 7px 2px;
        }

    .webgrid-header {
        background-color: #efecec;
        color: #2d7cb7;
        padding-bottom: 4px;
        padding-top: 5px;
        text-align: left;
    }

    .webgrid-footer {
    }

    .webgrid-row-style {
        padding: 3px 7px 2px;
    }

    .webgrid-alternating-row {
        background-color: #fff;
        padding: 3px 7px 2px;
    }
</style>

<div id="content">
    @using (Html.BeginForm("DeleteSelected", "Admin", FormMethod.Post))
    {

       
        
        <input type="submit" value="Approve Selected" />
        @grid.GetHtml(
                tableStyle: "webgrid-table",
                headerStyle: "webgrid-header",
                footerStyle: "webgrid-footer",
                alternatingRowStyle: "webgrid-alternating-row",
                rowStyle: "webgrid-row-style",
                columns: grid.Columns(
            //add checkbox
                 grid.Column(format: @<text><input type="checkbox" name="ids" value="@item.Cobinedetails_id" /></text>, header: "Select"),
            // add column for serial no
            //grid.Column(header:"Serial No", format:@<text><div>@(item.WebGrid.Rows.IndexOf(item)+1)</div></text>),

                    grid.Column(format: @<text>@item.booker_companyname</text>, header: "Booker Company"),
                    grid.Column(format: @<text>@item.booker_name</text>, header: "Name"),
                    grid.Column(format: @<text>@item.booker_postalcode</text>, header: "Postal Code"),
                    grid.Column(format: @<text>@item.booker_city</text>, header: "City"),
                    grid.Column(format: @<text>@item.booker_state</text>, header: "State"),
                        grid.Column(format: @<text>@item.booker_contactnum</text>, header: "Contact No."),
                    grid.Column(format: @<text>@item.Receiver_companyname</text>, header: "Receiver Company"),
                    grid.Column(format: @<text>@item.Receiver_name</text>, header: "Name"),
                        grid.Column(format: @<text>@item.Receiver_postalcode</text>, header: "Postal Code"),
                    grid.Column(format: @<text>@item.Receiver_city</text>, header: "City"),
                    grid.Column(format: @<text>@item.Receiver_state</text>, header: "State"),
                    grid.Column(format: @<text>@item.Receiver_contactnum</text>, header: "Contact No."),
                    grid.Column(format: @<text>@item.DateofBooking</text>, header: "Date Of Booking")
                    ))
                 
    }
</div>

 

 

 

Views: 8226
Total Answered: 3
Total Marked As Answer: 0
Posted On: 08-Jul-2015 04:07

Share:   fb twitter linkedin
Answers
Abdul Wasit
Abdul W...
4 Points
2 Posts
         
@model GoPickCourierDDL.Models.tblGoPickpincode

@{
    ViewBag.Title = "AdminHome";
    Layout = "~/Views/Shared/_Layout/Master2.cshtml";
}

<!DOCTYPE html>

<html>
<head>
    <meta name="viewport" content="width=device-width" />
    <meta charset="utf-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta name="description" content="SityCab is a taxi company responsive html template.">
    <meta name="keywords" content="boostrap, responsive, html5, css3, jquery, theme, uikit, multicolor, parallax, retina, taxi business" />
    <meta name="author" content="dhsign">
    <meta name="robots" content="index, follow" />
    <meta name="revisit-after" content="3 days" />
    <title>GoPick Courier Service!</title>
    <link href="~/Custom/gopick.css" rel="stylesheet" />
    <script src="~/Scripts/jquery-1.7.1.js"></script>
    <script src="~/Scripts/jquery-1.7.1.min.js"></script>
    <script src="~/Scripts/jquery.unobtrusive-ajax.js"></script>
    <script src="~/Scripts/jquery.unobtrusive-ajax.min.js"></script>
    <script src="~/Scripts/jquery-1.3.2.min.js"></script>

    <link rel="stylesheet" href="//code.jquery.com/ui/1.11.4/themes/smoothness/jquery-ui.css">
     <script src="//code.jquery.com/jquery-1.10.2.js"></script>
<script src="//code.jquery.com/ui/1.11.4/jquery-ui.js"></script>

    <style type="text/css">
        .anchor {
        font-size:16px;
        font-weight:bold;
        color:#2d7cb7;
        }
        

    </style>

    <style type="text/css">
    .webGrid { margin: 4px; border-collapse: collapse; width: 500px;  background-color:#B4CFC3;}
    .header { background-color: #C1D4E6; font-weight: bold; color: #FFF; }
    .webGrid th, .webGrid td { border: 1px solid #C0C0C0; padding: 5px; }
    .alt { background-color: #E4E9F5; color: #000; }
    .gridHead a:hover {text-decoration:underline;}
    .description { width:auto}
    .select{background-color: #71857C}
</style>


    <script type="text/javascript">
        $(document).ready(function () {
            $("#btnpincode").click(function () {
                debugger;
                var pincode = $("#PinCode").val();
                var city = $("#City").val();
                var state = $("#State").val();
                var obj = {};
                obj._pincode = pincode;
                obj._city = city;
                obj._state = state;
                $.ajax({
                    type: "POST",
                    url: "/Admin/insertpincode",
                    data: JSON.stringify(obj),
                    contentType: "application/json",
                    datatype: "json",
                    success: function (data) {
                    }
                });

            });
        });
    </script>

    <script type="text/javascript">
        $(document).ready(function () {
            $("#lishoworders").click(function () {
                $("#divorders").show();
            });
        });
    </script>

    <script type="text/javascript">
        $(document).ready(function () {
            $("#ddlsearch").change(function () {
                debugger;
                var search = $(this).val();
                if (search == "1") {
                    $("#divcomp").show();
                    $("#divdate").hide();
                }
                else if (search == "2") {
                    $("#divdate").show();
                    $("#divcomp").hide();
                }
            });
        });
    </script>

     <script type="text/javascript">
         $(document).ready(function () {
             debugger;
             $("#txtdatefrom").datepicker();
         });
         $(document).ready(function () {
             debugger;
             $("#txtdateto").datepicker();
             
         });
    </script>
    <script type="text/javascript">
        $(document).ready(function () {
            $.get("@Url.Action("show","Admin")", function (data) {
                $("#divpartial").replaceWith(data);
            });
        });
    </script>

    @*<script type="text/javascript">
        $(document).ready(function () {
            debugger;
            $("#btnsearch").click(function () {
                $("#divpartial").show();
            });
        });
    </script>*@

    </head>
    
    <body>

<div class="container" style="width: 100%; border-bottom: 2px solid #2d7cb7; border-left: 2px solid #2d7cb7; border-top: 2px solid #2d7cb7; border-right: 2px solid #2d7cb7;">
    @using (Html.BeginForm())
    {
    <div id="travelo-login" class="travelo-login-box travelo-box ">
               
                <div class="form-group">
                    <input type="text" id="PinCode" class="input-text full-width" placeholder="PinCode">
                </div>
                <div class="form-group">
                    <input id="City" class="input-text full-width" placeholder="City">
                </div>
         <div class="form-group">
                    <input id="State" class="input-text full-width" placeholder="State">
                </div>
        @*<div class="form-group">
                    <input id="txtstatecode" class="input-text full-width" placeholder="State Code">
                </div>*@
                <div class="form-group">
                    <a href="#" class="soap-popupbox" style="color:#01b7f2;">Add More Pincodes?</a>
                    <input type="submit" id="btnpincode" formaction="/Admin/insertpincode" value="Add Pincode" style="width:257px;margin-top:10px;" class="btn" />
                </div>
                
                 <a href="#" class="close close_pop ">
                    <img src="~/images/close_pop.png" title="close"/>
                </a>
            </div>
    }
    @using(Html.BeginForm("Index","Admin"))
       {
    <div  >

            <div style="width: 100%; margin-top: 15px; " >
                
                    <p style="height: 35px; width: 165px; margin-top: 15px; margin-bottom: 20px; margin-left: 580px; border: 1px solid #2d7cb7; border-radius: 10px;">
                        <span style="color: #2d7cb7; font-weight: 600; font-size: large; margin-left: 12px;">::Admin Panel::</span>
                    </p>
                
               @* <div style="width:100%;">*@
                <div style="margin-left: 75px; margin-top: 35px; float:left; width:200px; margin-bottom:150px;">
                   
                  
                      <div>
                    <ul class="quick-menu pull-right btn" style=" border:1px solid #2d7cb7;margin-top:8px; width:200px;height:40px; border-radius:20px;">
                        <li><a href="#travelo-login" class="soap-popupbox " style="line-height:24px;">Add PinCode</a></li>
                        
                        </ul>
                          </div>
                    <div>
                    <ul class="quick-menu pull-right btn" style=" border:1px solid #2d7cb7;margin-top:8px; width:200px;height:40px; border-radius:20px;">
                        <li><a id="lishoworders" style="width:225px; margin-top:2px; margin-left:-15px;">View Orders</a></li>
                   </ul>
                       </div>
                    <div>
                     <ul class="quick-menu pull-right btn" style="border:1px solid #2d7cb7;margin-top:8px; width:200px;height:40px; border-radius:20px;">
                        <li style="width:225px; margin-top:2px; margin-left:-100px;">@Html.ActionLink("Add Amount", "ABC", "Admin", new { style="margin-left:143px;"})</li>
                   </ul>
                        </div>
                 </div>
                    
                        <div id="divorders" style="float:left;width:500px;margin-left:100px; margin-top:43px; display:none;">
                            <div style="float:left;margin-top:7px;">
                      @Html.Label("Filter Searching", null, new { style="color:#2d7cb7;font-size:14px; width:150px;"})
                                </div>
                            <div>
                       @Html.DropDownList("ddlsearch", new List<SelectListItem>
{
    new SelectListItem { Text = "-- Search Type --", Value = "0", Selected=true},
    new SelectListItem { Text = "Company Name", Value = "1"},
    new SelectListItem { Text = "Date", Value = "2"},
}, new { style="width:170px;margin-left:35px;", @class="text-box"});
                 
                       </div>

                    </div>
                <div id="divcomp" style="float:left;width:500px;margin-left:100px; margin-top:13px; display:none;">
                    <div style="float:left;margin-top:7px;">
                        @Html.Label("Enter Company Name", null, new { style="color:#2d7cb7;font-size:14px; width:187px;"})
                    </div>
                    <div style="width:500px;">
                        @Html.TextBox("txtcomp", null, new { @class="text-box", style="width:170px;"})
                    </div>
                    <input id="btnsearch" type="submit" value="Search" formaction="/Admin/AdminIndex" class="btn" style="width:170px;margin-left:185px;margin-top:8px;" />
                </div>

                <div id="divdate" style="float: left; width: 800px; margin-left: 100px; margin-top: 13px; display:none;">
                    <div style="float:left;margin-top:7px;">
                        @Html.Label("From::", null, new { style="color:#2d7cb7;font-size:14px; width:150px;margin-left:10px;"})
                    
                        @Html.TextBox("txtdatefrom", null, new { @class="text-box", style="width:166px; margin-left:0px;margin-top:0px;"})
                    </div>
                    <div style="float:left;margin-top:7px;">
                        @Html.Label("To::", null, new { style="color:#2d7cb7;font-size:14px; width:60px;margin-left:27px;"})
                    
                        @Html.TextBox("txtdateto", null, new { @class="text-box", style="width:166px;margin-left:20px;"})
                    </div>
                    <input id="btnsearchdate" type="submit" value="Search" formaction="/Admin/AdminIndexsearch" class="btn" style="width:200px;margin-left:35px;margin-top:28px;" />
                </div>
                <div id="divpartial" style="display:none;">
               
               </div>
                    </div>
                 
                
               
                
               
            </div>
            
            <!--   //TO Receiver Information //  -->

       

    }
        </div>
           
        </body>
    </html>
Posted On: 08-Jul-2015 04:19
Rahul Maurya
Rahul M...
Moderator
1172 Points
211 Posts
         

Hi abdul,

Change controller method as:

[HttpPost]
public ActionResult AdminIndexsearch(FormCollection collection)
{
DateTime date = Convert.ToDateTime(collection.GetValue("txtdatefrom").AttemptedValue).Date;
DateTime dateto = Convert.ToDateTime(collection.GetValue("txtdateto").AttemptedValue).Date;
CombinedBookereceiverInfo objcombine = new CombinedBookereceiverInfo();
var AdminData = new List<CombinedBookereceiverInfo>();
AdminData = db.CombinedBookereceiverInfoes.Where(x => x.DateofBooking >= date && x.DateofBooking <= dateto).ToList();
return view(AdminData);
}

I think it will work.

Posted On: 08-Jul-2015 04:36
Rahul Maurya
Rahul M...
Moderator
1172 Points
211 Posts
         

Hi Abdul,

Please specify the problem and also post the error message and then code if necessary.

Thank you for this post.

Posted On: 08-Jul-2015 04:53
 Log In to Chat