webforms-phonebook / Phonebook / ContactsForm.aspx
ContactsForm.aspx
Raw
<%@ Page Language="C#" AutoEventWireup="true" CodeBehind="ContactsForm.aspx.cs" Inherits="Phonebook.ContactsForm" %>
<%@ Register Src="~/ModalControl.ascx" TagPrefix="uc1" TagName="ModalControl" %>

<!DOCTYPE html>

<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
    <title></title>
    <meta charset="utf-8" />
    <meta name="viewport" content="width=device-width, initial-scale=1" />
    <link href="https://cdn.jsdelivr.net/npm/bootstrap@5.1.2/dist/css/bootstrap.min.css" rel="stylesheet" />
    <script src="https://cdn.jsdelivr.net/npm/bootstrap@5.1.2/dist/js/bootstrap.bundle.min.js"></script>
    <link rel="stylesheet" href="https://www.w3schools.com/w3css/4/w3.css" />
    <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.7.0/css/font-awesome.min.css" />
    <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/css/bootstrap.min.css" integrity="sha384-1q8mTJOASx8j1Au+a5WDVnPi2lkFfwwEAa8hDDdjZlpLegxhjVME1fgjWPGmkzs7" crossorigin="anonymous" />
    <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/css/bootstrap-theme.min.css" integrity="sha384-fLW2N01lMqjakBkx3l/M9EahuwpSfeNvV63J5ezn3uZzapT0u7EYsXMjQV+0En5r" crossorigin="anonymous" />
    <script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/js/bootstrap.min.js" integrity="sha384-0mSbJDEHialfmuBBQP6A4Qrprq5OVfW37PRR3j5ELqxss1yVqOtnepnHVP9aJ7xS" crossorigin="anonymous"></script>
    <script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/bootbox.js/5.5.2/bootbox.min.js"></script>
    
    <script src="jQuery/jquery-3.6.0.min.js"></script>
    <link href="jQuery/jquery-ui.min.css" rel="stylesheet" />
    <script src="jQuery/jquery-ui.min.js"></script>

    <style>
        .pagination>li>a, .pagination>li>span{
            color: #555555;
        }
        .pagination-lg .page-link{
            font-size: 21.75px;
        }
        .pagination{
            margin: 66px;
        }
        .someClass {
            background-color: #f8f9fa;
            color: dimgray;
            font-family: Arial, Helvetica, sans-serif;
            font-size: 1.1em;
            font-weight: normal;
        }
        .someLbl{
            color: #FE0C0A;
            font-size: 1.28em;
            font-weight: bolder;
        }
        .someClassNew {
            background-color: navajowhite;
            color: dimgray;
            text-align: right;
            height: 60px;
            width: 559px;
        }
        table, th, td {
            text-align: center;
            font-family: Arial, Helvetica, sans-serif;
            vertical-align: middle;
            margin-top: 100px;
        }
        .ChkBoxClass input {
            width: 17px;
            height: 17px;
            vertical-align: middle;
        }
        page-link {
            width: 200px;
        }
        img {
            width: 29px;
        }
        .navbar {
            float: none;
            position: absolute;
            top: 3.5%;
            left: 50%;
            transform: translate(-50%, -50%);
        }
        .customIMG {
            margin-left: -20px;
            margin-top: 15px;
        }
        .btn-light {
            color: #ed5555;
            background-color: #ecedee;
        }
        .btn-success {
            background-image: -webkit-gradient(linear,left top,left bottom,from(#68cf68),to(#a9db69));
            border-color: #93d76a;
            color: #000;
            font-weight:bolder;
        }
        .btn-danger {
            background-image: linear-gradient(to bottom,#ff5555 0,#e63838 100%);
            color: #000;
            font-weight:bolder;
        }
        .btn-warning {
            background-image: linear-gradient(to bottom,#f5d53f 0,#f1c226 100%);
            border-color: #eec35e;
            font-weight:bolder;
        }
    </style>
</head>
<body style="background-color: #f8f9fa;">
    <form id="form1" runat="server" class="someClass">
        <asp:ScriptManager ID="ScriptManager1" runat="server" EnablePartialRendering="true">
        </asp:ScriptManager>

        <uc1:ModalControl ID="modalControl" runat="server" OnNavigatge="testx"></uc1:ModalControl>
         <asp:UpdatePanel ID="UpdatePanel2" runat="server" UpdateMode="Conditional">

             <ContentTemplate>
                
                <nav class="navbar navbar-expand-lg navbar-light border-secondary" style="background-color: navajowhite; height:96px;">
                    <a class="navbar-brand" style="text-align: center; text-transform: uppercase; color: #8e8e8e; font:bolder; font-size:23px; height:30px;">PhoneBook</a>
                    <img class="customIMG" src="https://img.icons8.com/external-wanicon-two-tone-wanicon/64/000000/external-agenda-customer-services-wanicon-two-tone-wanicon.png"/>

                    <div class="collapse navbar-collapse" id="navbarSupportedContent">
                        <ul class="navbar-nav ms-auto">
                            <li class="nav-item" style="position:center;">
                                    <div class="input-group" style="margin-top:18px; margin-right:15px; margin-left:5px;">
                                        <span class="input-group-addon">
                                            <i class="fa fa-list-alt" aria-hidden="true"></i>
                                        </span>
                                        <asp:DropDownList ID="DropDownListNew" runat="server" Visible="true" OnSelectedIndexChanged="DropDownListNew_SelectedIndexChanged" AutoPostBack="true" Style="width: 75px; height: 34px; border-radius: .25rem; border: 1px solid #ced4da">
                                            <asp:ListItem Value="1"></asp:ListItem>
                                            <asp:ListItem Value="3"></asp:ListItem>
                                            <asp:ListItem Value="4"></asp:ListItem>
                                            <asp:ListItem Value="5"></asp:ListItem>
                                            <asp:ListItem Value="10"></asp:ListItem>
                                        </asp:DropDownList>
                                    </div>
                            </li>
                            <li class="nav-item" style="position:center;">
                                        <div class="input-group" style="margin-top:18px;">
                                            <span class="input-group-addon">
                                                <i class="fa fa-mercury" style="font-size: 19px;"></i>
                                            </span>
                                            <asp:DropDownList ID="contactDropDown" runat="server" OnSelectedIndexChanged="contactDropDown_SelectedIndexChanged" AutoPostBack="true" Style="width: 270px; height: 34px; border-radius: .25rem; border: 1px solid #ced4da">
                                                <asp:ListItem Selected="True" Value="none">Select Gender Type</asp:ListItem>
                                                <asp:ListItem Value="0">Male</asp:ListItem>
                                                <asp:ListItem Value="1">Female</asp:ListItem>
                                                <asp:ListItem Value="2">Firm</asp:ListItem>
                                            </asp:DropDownList>
                                        </div>
                            </li>
                            <li class="nav-item" style="position:center;">
                                        <div class="input-group" style="margin-top:18px; margin-left:15px; width:500px;">
                                            <span class="input-group-addon">
                                                <asp:CheckBox ID="favorsCheckBox" runat="server" CssClass="ChkBoxClass" OnCheckedChanged="favorsCheckBox_CheckedChanged" AutoPostBack="true" Text='&nbsp;<i class="fa fa-heart style="vertical-align:middle;"></i>' />
                                            </span>
                                            <asp:TextBox ID="txtSearchBox" class="form-control" runat="server" placeholder="Search" CommandArgument='<%#Eval("Name") %>' Visible="true"></asp:TextBox>
                                            <span class="input-group-btn">
                                                <asp:Button ID="searchBtn" class="btn btn-default" runat="server" Text="Search" BorderStyle="Solid" OnClick="searchBtn_Click" CausesValidation="false" />
                                            </span>
                                        </div>
                            </li>    
                            <li class="nav-item" style="position:center;">
                                <asp:Button ID="modalPop" class="btn btn-warning" runat="server" style="margin-top: 18px; margin-left:15px;" Text="Create Contact" BorderStyle="Solid" OnClick="modalPop_Click1" CausesValidation="false" />
                            </li>       
                        </ul>
                    </div>
                </nav>

                <div visible="false">
                    <asp:TextBox ID="lbl1" runat = "server" Visible="false"></asp:TextBox>
                </div>
                <div style="margin-top:95px;" align="center" class="someClass someLbl">
                    <asp:Label ID="delComLbl" runat="server" Text="Contact has been deleted !" Visible="false"></asp:Label>
                </div>
                    
                <div>
                    <asp:Panel ID="repPanel" runat="server" Visible="true" placeholder="Error">
                        <table style="width: 72.6%" align="center" class="table table-borderless table-striped">
                            <asp:Repeater ID="repContactsNew" runat="server">
                                <HeaderTemplate>
                                    <tr class="table-secondary">
                                        <th>Full-Name</th>
                                        <th>Phone</th>
                                        <th>Email</th>
                                        <th>Gender</th>
                                        <th>Country</th>
                                        <th>Birthdate</th>
                                        <th>Edit</th>
                                        <th>Delete</th>
                                        <th><i class="fa fa-heart"></i></th>
                                    </tr>
                                </HeaderTemplate>
                                <ItemTemplate>
                                    <tr class="table-light">
                                        <td><%#Eval("Fullname") %></td>
                                        <td><%#Eval("Phone") %></td>
                                        <td><%#Eval("email") %></td>
                                        <td><%#Eval("Gender") %></td>
                                        <td><%#Eval("country") %></td>
                                        <td><%#string.Format("{0: dd/MM/yyyy}", Eval("birthdate")) %></td>
                                        <td align="center" style="vertical-align: middle;">
                                            <asp:LinkButton ID="editBtn" class="btn btn-success btn-md" runat="server" Text="Edit" CausesValidation="false" OnCommand="editBtn_Command" CommandArgument='<%#Eval("ID") %>'> </asp:LinkButton>
                                        </td>
                                        <td align="center" style="vertical-align: middle;">
                                            <asp:LinkButton ID="deleteBtn" runat="server" class="btn btn-danger btn-md" CommandArgument='<%#Eval("ID") %>' Text="Delete" OnCommand="deleteBtn_Command"></asp:LinkButton>
                                        </td>
                                        <td align="center" style="vertical-align:middle;">
                                            <asp:LinkButton ID="favBtn1" class="btn btn-light btn-md" runat="server" OnCommand="favBtn1_Command" Visible='<%#Eval("favourites").ToString()=="0"%>' CommandArgument='<%#Eval("ID")%>'><i class="fa fa-heart-o"></i></asp:LinkButton>
                                            <asp:LinkButton ID="favBtn2" class="btn btn-light btn-md" runat="server" OnCommand="favBtn2_Command" Visible='<%#Eval("favourites").ToString()=="1"%>' CommandArgument='<%#Eval("ID")%>'><i class="fa fa-heart"></i></asp:LinkButton>
                                        </td>
                                    </tr>
                                </ItemTemplate>
                            </asp:Repeater>
                        </table>
                    </asp:Panel>
                </div>
            </ContentTemplate>
        </asp:UpdatePanel>

        <div>
            <nav aria-label="Page navigation example" align="center" style="margin-top:15px;">
                <ul class="pagination pagination-lg justify-content-center">
                    <li class="page-item">
                        <asp:LinkButton ID="lbPrevious" class="page-link" runat="server" OnClick="lbPrevious_Click"><i class="fa fa-angle-double-left" aria-hidden="true"></i></asp:LinkButton>
                    </li>
                    <li class="page-item">
                        <asp:Label ID="lblpage" runat="server" Visible="true"></asp:Label>
                        <asp:Label ID="errlabel" runat="server" Text="Error"></asp:Label>
                    </li>
                    <li class="page-item">
                        <asp:LinkButton ID="lbNext" class="page-link" runat="server" OnClick="lbNext_Click"><i class="fa fa-angle-double-right" aria-hidden="true"></i></asp:LinkButton>
                    </li>
                </ul>
            </nav>
        </div>
    </form>
</body>
</html>