<%@ Page Title="" Language="C#" MasterPageFile="~/SunMaster.Master" AutoEventWireup="true"
    CodeBehind="AddTransferStock.aspx.cs" Inherits="SUNWEB.AddTransferStock" %>

<%@ Register Assembly="AjaxControlToolkit" TagPrefix="asp" Namespace="AjaxControlToolkit" %>
<asp:Content ID="Content1" ContentPlaceHolderID="head" runat="server">
    <%-- <link rel="stylesheet" href="../assets/vendor/bootstrap/css/bootstrap.min.css">
    <link href="../assets/vendor/fonts/circular-std/style.css" rel="stylesheet">
    <link rel="stylesheet" href="../assets/libs/css/style.css">
    <link rel="stylesheet" href="../assets/vendor/fonts/fontawesome/css/fontawesome-all.css">
      <link rel="stylesheet" type="text/css" href="../assets/vendor/datatables/css/dataTables.bootstrap4.css">
    <link rel="stylesheet" type="text/css" href="../assets/vendor/datatables/css/buttons.bootstrap4.css">
    <link rel="stylesheet" type="text/css" href="../assets/vendor/datatables/css/select.bootstrap4.css">
    <link rel="stylesheet" type="text/css" href="../assets/vendor/datatables/css/fixedHeader.bootstrap4.css">
    <link type="text/css" rel="Stylesheet" href="css/style.css" />--%>

   <%-- <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js"></script>--%>
<%--    <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.5.1/jquery.min.js"></script>--%>
    <%-- <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.7.0/css/font-awesome.min.css">--%>
    <link href="css/Gridstyle.css" rel="Stylesheet" type="text/css" />
    <script src="https://cdn.jsdelivr.net/npm/sweetalert2@11"></script>

    <link href="https://cdn.jsdelivr.net/npm/bootstrap@5.0.2/dist/css/bootstrap.min.css" rel="stylesheet" integrity="sha384-EVSTQN3/azprG1Anm3QDgpJLIm9Nao0Yz1ztcQTwFspd3yD65VohhpuuCOmLASjC" crossorigin="anonymous">
    <script src="https://cdn.jsdelivr.net/npm/bootstrap@5.0.2/dist/js/bootstrap.bundle.min.js" integrity="sha384-MrcW6ZMFYlzcLA8Nl+NtUVF0sA7MsXsP1UyJoMp4YLEuNSfAP+JcXn/tWtIaxVXM" crossorigin="anonymous"></script>

    <script src="https://cdn.jsdelivr.net/npm/@popperjs/core@2.9.2/dist/umd/popper.min.js" integrity="sha384-IQsoLXl5PILFhosVNubq5LC7Qb9DXgDA9i+tQ8Zj3iwWAwPtgFTxbJ8NT4GN1R8p" crossorigin="anonymous"></script>
    <script src="https://cdn.jsdelivr.net/npm/bootstrap@5.0.2/dist/js/bootstrap.min.js" integrity="sha384-cVKIPhGWiC2Al4u+LWgxfKTRIcfu0JTxR+EQDz/bgldoEyl4H0zUF0QKbrJ0EcQF" crossorigin="anonymous"></script>

    <%-- <script src="https://code.jquery.com/jquery-3.5.1.slim.min.js" integrity="sha384-DfXdz2htPH0lsSSs5nCTpuj/zy4C+OGpamoFVy38MVBnE+IbbVYUew+OrCXaRkfj" crossorigin="anonymous"></script>
<script src="https://cdn.jsdelivr.net/npm/bootstrap@4.5.3/dist/js/bootstrap.bundle.min.js" integrity="sha384-ho+j7jyWK8fNQe+A12Hb8AhRq26LrZ/JpcUGGOn+Y7RsweNrtN/tE3MoK7ZeZDyx" crossorigin="anonymous"></script>--%>

    <!-- Bootstrap CSS -->
    <%--    <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/bootstrap@5.0.2/dist/css/bootstrap.min.css">--%>
    <!-- Bootstrap Font Icon CSS -->
    <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/bootstrap-icons@1.5.0/font/bootstrap-icons.css">


    <%--<script type="text/javascript">
    function showProgress() 
    {
        var updateProgress = $get("<%= UpdateProgress.ClientID %>");
        updateProgress.style.display = "block";
    }
    </script>--%>
    <style type="text/css">
    .divReportCss {
        max-height: 100%;
        overflow-y: auto;
    }

    .tableReportHeader {
        /*border: 1px solid black;*/
        width: 100%;
        font-size: medium;
        margin-bottom: 20px;
        margin-top: 50px;
    }

        .tableReportHeader tr td {
            width: 50%;
        }

    .tableReportDetail {
        border: 1px solid black;
        width: 100%;
        font-size: medium;
    }

        .tableReportDetail tr th {
            padding: 10px;
        }

        .tableReportDetail tr td {
            padding: 10px;
        }


    .tableheaderCss {
        margin-bottom: 20px
    }

    .trHeaderTh {
        width: 30vw;
    }

    .tabledetailCss {
        width: 100%;
        margin-bottom: 20px;
        border: thin solid black;
        margin-top: 70px;
    }

    .tabledetailtrthCss {
        /* width: 100%;*/
        margin-bottom: 20px;
        /* border: thin solid black;*/
        height: 50px;
        padding: 10px;
    }

    .tabledetaildatatrCss {
        width: 100%;
        margin-bottom: 20px;
        border: thin solid black;
        height: 50px
    }

    .tabledetaildatatdCss {
        border: thin solid black;
        padding: 10px;
        color: black;
    }


    /* The Modal (background) */
    .modal {
        display: none; /* Hidden by default */
        position: fixed; /* Stay in place */
        z-index: 1; /* Sit on top */
        left: 0;
        top: 0;
        width: 100%; /* Full width */
        height: 100%; /* Full height */
        overflow: auto; /* Enable scroll if needed */
        background-color: rgb(0,0,0); /* Fallback color */
        background-color: rgba(0,0,0,0.4); /* Black w/ opacity */
    }

    /* Modal Content/Box */
    .modal-content {
        background-color: #fefefe;
        /*  margin: 15% auto;*/ /* 15% from the top and centered */
        padding: 20px;
        border: 1px solid #888;
        width: 80%; /* Could be more or less, depending on screen size */
        height: 100%;
    }

    /* The Close Button */
    .close {
        color: #aaa;
        float: right;
        font-size: 28px;
        font-weight: bold;
        text-align: right;
    }

        .close:hover,
        .close:focus {
            color: black;
            text-decoration: none;
            cursor: pointer;
        }


    .column {
        float: left;
        width: 40%;
        padding: 16px;
        /*  height: 48px; */ /* Should be removed. Only for demonstration */
    }

    /* Clear floats after the columns */
    .rowgrid {
        flex-wrap: wrap;
        margin-right: -15px;
    }


    .row:after {
        content: "";
        display: table;
        clear: both;
    }

    .disabledCss {
        border: 1px solid #999999;
        background-color: #cccccc;
        color: #666666;
        height: 40px;
    }

    .btnSaveCss {
        height: 40px;
        width: 150px;
        background-color: #5969ff;
        border-color: #5969ff;
        color: white;
        font-size: 14px;
        padding: 9px 16px;
        border-radius: 2px;
    }

    .btnVoidCss {
        background: red;
        margin: 0;
        font-family: Circular Std Book;
        font-size: 14px;
        line-height: inherit;
        border-width: thin;
        border-color: red;
        border-radius: 2px;
        color: #212529;
        height: 40px;
        width: 150px;
    }

    .btnConfirmTransferCss {
        height: 40px;
        width: 150px;
        background-color: Green;
        border-color: Green;
        color: white;
        padding: 9px 16px;
        border-radius: 2px;
    }

    input[type="checkbox"] {
        transform: scale(1.2);
    }


    input[type="search"]::-webkit-search-cancel-button {
        /* Remove default */
        -webkit-appearance: none;
        /* Now your own custom styles */
        height: 14px;
        width: 14px;
        display: block;
        background-image: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAB4AAAAeCAYAAAA7MK6iAAAAn0lEQVR42u3UMQrDMBBEUZ9WfQqDmm22EaTyjRMHAlM5K+Y7lb0wnUZPIKHlnutOa+25Z4D++MRBX98MD1V/trSppLKHqj9TTBWKcoUqffbUcbBBEhTjBOV4ja4l4OIAZThEOV6jHO8ARXD+gPPvKMABinGOrnu6gTNUawrcQKNCAQ7QeTxORzle3+sDfjJpPCqhJh7GixZq4rHcc9l5A9qZ+WeBhgEuAAAAAElFTkSuQmCC);
        /* setup all the background tweaks for our custom icon */
        background-repeat: no-repeat;
        /* icon size */
        background-size: 14px;
    }

    table thead tr th {
       text-align:center
    }

  </style>

    <script type="text/javascript">
        var btn = document.getElementById("myBtn");
        var span = document.getElementsByClassName("close")[0];


      <%--  $(document).ready(function () {
            //document.getElementById()txtSendStatus
            var txtSendStatus = document.getElementById("<%=txtSendStatus.ClientID %>");

            if (txtSendStatus.value == "Send" || txtSendStatus.value == "Void") {
                var btnSave = document.getElementById("<%=btnSave.ClientID%>")
                btnSave.className = "disabledCss";

                var btnSend = document.getElementById("<%=btnSend.ClientID%>")
                btnSend.className = "disabledCss";

                var btnVoid = document.getElementById("<%=btnVoid.ClientID%>")
                btnVoid.className = "disabledCss";
            }
        });--%>

        function ShowModal() {

            var modal = document.getElementById("myModal");
            modal.style.display = "block";
        }

        function Close() {
            modal.style.display = "none";
        }

        function GetBranchNamebyID(DB, BranchID) {
            var RetValue;
            $.ajax({
                type: "POST",
                url: "AddTransferStock.aspx/GetBranchFullName",
                data: "{'DB':'" + DB + "','BranchID':'" + BranchID + "'}",
                async: false,
                contentType: 'application/json;charset=utf8',
                dataType: 'json',
                error: function (XMLHttpRequest, textStatus, errorThrown) {

                },
                success: function (result) {

                    var jsonItem = JSON.parse(result.d);
                    var itemCount = jsonItem.length;
                    for (var x = 0; x < itemCount; x++) {
                        var BranchFullName = jsonItem[x].BranchFullName;
                        RetValue = BranchFullName;
                    }
                }

            });

            return RetValue;
        }

        function ViewModalReport() {
            var sDB = '<%=Session["DB"] %>';
            var sTransferID = '<%=Session["TransferID"] %>';
            $.ajax({
                type: "POST",
                url: "AddTransferStock.aspx/GetReportHeader",
                data: "{'DB':'" + sDB + "','TransferID':'" + sTransferID + "'}",
                //data:
                async: false,
                contentType: 'application/json; charset=utf-8',
                dataType: 'json',
                error: function (XMLHttpRequest, textStatus, errorThrown) {
                    // alert("Request: " + XMLHttpRequest.toString() + "\n\nStatus: " + textStatus + "\n\nError: " + errorThrown);
                },
                success: function (result) {
                    var jsonItem = JSON.parse(result.d);
                    var itemCount = jsonItem.length;
                    for (var x = 0; x < itemCount; x++) {
                        //table 1
                        var TransferNo = jsonItem[x].TransferNo;
                        var TransferDate = jsonItem[x].TransferDate;
                        var ReceivingNo = jsonItem[x].ConfirmNo;
                        //table 2
                        var FromBranch = jsonItem[x].FromBranchID;
                        var SendDate = jsonItem[x].SendDateTime;
                        var ReceiveStatus = jsonItem[x].ConfirmFlag;
                        //table 3
                        var ToBranch = jsonItem[x].ToBranchID;
                        var SendStatus = jsonItem[x].SendFlag;
                        var EmployeeName = jsonItem[x].EmployeeName;
                        //table 4
                        var Notes = jsonItem[x].TNotes;

                        if (ReceivingNo == "") {
                            ReceivingNo = "N/A";
                        }

                        if (SendStatus == "0") {
                            SendStatus = "Not Send";
                        } else if (SendStatus == "1") {
                            SendStatus = "Send";
                        } else if (SendStatus == "3") {
                            SendStatus = "Void";
                        }

                        if (ReceiveStatus == "0") {
                            ReceiveStatus = "PENDING";
                        } else {
                            ReceiveStatus = "CONFIRMED";
                        }

                        if (Notes == "") {
                            Notes = "N/A";
                        }
                        //table 1
                        var table1 = document.createElement("table");
                        table1.id = "table1a";
                        table1.className = "tableheaderCss";
                        document.getElementById("divReport").appendChild(table1);

                        var table1trheader = document.createElement("tr");
                        table1trheader.id = "table1trheader";
                        document.getElementById("table1a").appendChild(table1trheader);

                        var table1trth1 = document.createElement("th");
                        table1trth1.id = "table1trth1";
                        table1trth1.innerHTML = "Transfer No."
                        table1trth1.className = "trHeaderTh";
                        document.getElementById("table1trheader").appendChild(table1trth1);

                        var table1trth2 = document.createElement("th");
                        table1trth2.id = "table1trth2";
                        table1trth2.innerHTML = "Transfer Date."
                        table1trth2.className = "trHeaderTh";
                        document.getElementById("table1trheader").appendChild(table1trth2);

                        var table1trth3 = document.createElement("th");
                        table1trth3.id = "table1trth3";
                        table1trth3.innerHTML = "Receiving No."
                        table1trth3.className = "trHeaderTh";
                        document.getElementById("table1trheader").appendChild(table1trth3);

                        var table1trRow1 = document.createElement("tr");
                        table1trRow1.id = "table1trRow1";
                        document.getElementById("table1a").appendChild(table1trRow1)

                        var table1trCol1 = document.createElement("td");
                        table1trCol1.id = "tabletrCol1";
                        table1trCol1.innerHTML = TransferNo;
                        table1trCol1.className = "trHeaderTh";
                        document.getElementById("table1trRow1").appendChild(table1trCol1);

                        var tabletrCol2 = document.createElement("td");
                        tabletrCol2.id = "tabletrCol2";
                        tabletrCol2.innerHTML = TransferDate.replace("T", " ");
                        tabletrCol2.className = "trHeaderTh";
                        document.getElementById("table1trRow1").appendChild(tabletrCol2);

                        var tabletrCol3 = document.createElement("td");
                        tabletrCol3.id = "tabletrCol2";
                        tabletrCol3.innerHTML = ReceivingNo;
                        tabletrCol3.className = "trHeaderTh";
                        document.getElementById("table1trRow1").appendChild(tabletrCol3);

                        //table 2
                        var table2 = document.createElement("table");
                        table2.id = "table2a";
                        table2.className = "tableheaderCss";
                        document.getElementById("divReport").appendChild(table2);

                        var table2trheader = document.createElement("tr");
                        table2trheader.id = "table2trheader";
                        document.getElementById("table2a").appendChild(table2trheader);

                        var table2trth1 = document.createElement("th");
                        table2trth1.id = "table2trth1";
                        table2trth1.innerHTML = "From Branch"
                        table2trth1.className = "trHeaderTh";
                        document.getElementById("table2trheader").appendChild(table2trth1);

                        var table2trth2 = document.createElement("th");
                        table2trth2.id = "table2trth2";
                        table2trth2.innerHTML = "Send Date"
                        table2trth2.className = "trHeaderTh";
                        document.getElementById("table2trheader").appendChild(table2trth2);

                        var table2trth3 = document.createElement("th");
                        table2trth3.id = "table1trth3";
                        table2trth3.innerHTML = "Receiving Status"
                        table2trth3.className = "trHeaderTh";
                        document.getElementById("table2trheader").appendChild(table2trth3);

                        var table2trRow1 = document.createElement("tr");
                        table2trRow1.id = "table2trRow1";
                        document.getElementById("table2a").appendChild(table2trRow1)

                        var table2trCol1 = document.createElement("td");
                        table2trCol1.id = "table2trCol1";
                        table2trCol1.innerHTML = GetBranchNamebyID(sDB, FromBranch);
                        table2trCol1.className = "trHeaderTh";
                        document.getElementById("table2trRow1").appendChild(table2trCol1);

                        var table2trCol2 = document.createElement("td");
                        table2trCol2.id = "table2trCol2";
                        table2trCol2.innerHTML = SendDate.replace("T", " ");
                        table2trCol2.className = "trHeaderTh";
                        document.getElementById("table2trRow1").appendChild(table2trCol2);

                        var table2trCol3 = document.createElement("td");
                        table2trCol3.id = "table3trCol3";
                        table2trCol3.innerHTML = ReceiveStatus;
                        table2trCol3.className = "trHeaderTh";
                        document.getElementById("table2trRow1").appendChild(table2trCol3);

                        //table3
                        var table3 = document.createElement("table");
                        table3.id = "table3a";
                        table3.className = "tableheaderCss";
                        document.getElementById("divReport").appendChild(table3);

                        var table3trheader = document.createElement("tr");
                        table3trheader.id = "table3trheader";
                        document.getElementById("table3a").appendChild(table3trheader);

                        var table3trth1 = document.createElement("th");
                        table3trth1.id = "table3trth1";
                        table3trth1.innerHTML = "To Branch"
                        table3trth1.className = "trHeaderTh";
                        document.getElementById("table3trheader").appendChild(table3trth1);

                        var table3trth2 = document.createElement("th");
                        table3trth2.id = "table2trth2";
                        table3trth2.innerHTML = "Send Status"
                        table3trth2.className = "trHeaderTh";
                        document.getElementById("table3trheader").appendChild(table3trth2);

                        var table3trth3 = document.createElement("th");
                        table3trth3.id = "table1trth3";
                        table3trth3.innerHTML = "User"
                        table3trth3.className = "trHeaderTh";
                        document.getElementById("table3trheader").appendChild(table3trth3);

                        var table3trRow1 = document.createElement("tr");
                        table3trRow1.id = "table3trRow1";
                        document.getElementById("table3a").appendChild(table3trRow1)

                        var table3trCol1 = document.createElement("td");
                        table3trCol1.id = "table3trCol1";
                        table3trCol1.innerHTML = GetBranchNamebyID(sDB, ToBranch);
                        table3trCol1.className = "trHeaderTh";
                        document.getElementById("table3trRow1").appendChild(table3trCol1);

                        var table3trCol2 = document.createElement("td");
                        table3trCol2.id = "table3trCol2";
                        table3trCol2.innerHTML = SendStatus;
                        table3trCol2.className = "trHeaderTh";
                        document.getElementById("table3trRow1").appendChild(table3trCol2);

                        var table3trCol3 = document.createElement("td");
                        table3trCol3.id = "table3trCol3";
                        table3trCol3.innerHTML = EmployeeName;
                        table3trCol3.className = "trHeaderTh";
                        document.getElementById("table3trRow1").appendChild(table3trCol3);

                        //table4
                        var table4 = document.createElement("table");
                        table4.id = "table4a";
                        table4.className = "tableheaderCss";
                        document.getElementById("divReport").appendChild(table4);

                        var table4trheader = document.createElement("tr");
                        table4trheader.id = "table4trheader";
                        document.getElementById("table4a").appendChild(table4trheader);

                        var table4trth1 = document.createElement("th");
                        table4trth1.id = "table2trth1";
                        table4trth1.innerHTML = "Notes"
                        table4trth1.className = "trHeaderTh";
                        document.getElementById("table4trheader").appendChild(table4trth1);

                        var table4trRow1 = document.createElement("tr");
                        table4trRow1.id = "table4trRow1";
                        document.getElementById("table4a").appendChild(table4trRow1)

                        var table4trCol1 = document.createElement("td");
                        table4trCol1.id = "table4trCol1";
                        table4trCol1.innerHTML = Notes;
                        table4trCol1.className = "trHeaderTh";
                        document.getElementById("table4trRow1").appendChild(table4trCol1);


                        var tableDetail = document.createElement("table");
                        tableDetail.id = "tableDetail";
                        tableDetail.className = "tabledetailCss";
                        document.getElementById("divReport").appendChild(tableDetail)

                        var tabledetailtrHeader = document.createElement("tr");
                        tabledetailtrHeader.id = "tabledetailtrHeader";
                        //tabledetailtrHeader.className = "tabledetailtrthCss";
                        document.getElementById("tableDetail").appendChild(tabledetailtrHeader);

                        var tabledetailtrth1 = document.createElement("th");
                        tabledetailtrth1.id = "tabledetailtrth1";
                        tabledetailtrth1.innerHTML = "Barcode";
                        tabledetailtrth1.className = "tabledetailtrthCss";
                        document.getElementById("tabledetailtrHeader").appendChild(tabledetailtrth1);

                        var tabledetailtrth2 = document.createElement("th");
                        tabledetailtrth2.id = "tabledetailtrth2";
                        tabledetailtrth2.innerHTML = "InventoryName";
                        tabledetailtrth2.className = "tabledetailtrthCss";
                        document.getElementById("tabledetailtrHeader").appendChild(tabledetailtrth2);

                        var tabledetailtrth3 = document.createElement("th");
                        tabledetailtrth3.id = "tabledetailtrth3";
                        tabledetailtrth3.innerHTML = "Description";
                        tabledetailtrth3.className = "tabledetailtrthCss";
                        document.getElementById("tabledetailtrHeader").appendChild(tabledetailtrth3);

                        var tabledetailtrth4 = document.createElement("th");
                        tabledetailtrth4.id = "tabledetailtrth4";
                        tabledetailtrth4.innerHTML = "Unit";
                        tabledetailtrth4.className = "tabledetailtrthCss";
                        document.getElementById("tabledetailtrHeader").appendChild(tabledetailtrth4);

                        var tabledetailtrth5 = document.createElement("th")
                        tabledetailtrth5.id = "tabledetailtrth5";
                        tabledetailtrth5.innerHTML = "QTY";
                        tabledetailtrth5.className = "tabledetailtrthCss";
                        document.getElementById("tabledetailtrHeader").appendChild(tabledetailtrth5);

                        $.ajax({
                            type: "POST",
                            url: "AddTransferStock.aspx/GetReportDetail",
                            data: "{'DB':'" + sDB + "','TransferID':'" + sTransferID + "'}",
                            //data:
                            async: false,
                            contentType: 'application/json; charset=utf-8',
                            dataType: 'json',
                            error: function (XMLHttpRequest, textStatus, errorThrown) {
                                // alert("Request: " + XMLHttpRequest.toString() + "\n\nStatus: " + textStatus + "\n\nError: " + errorThrown);
                            },
                            success: function (result) {
                                var jsonItem = JSON.parse(result.d);
                                var ItemCount = jsonItem.length;
                                //alert(result.d);
                                for (var x = 0; x < ItemCount; x++) {
                                    var Barcode = jsonItem[x].Barcode;
                                    var InventoryName = jsonItem[x].InventoryName;
                                    var Description = jsonItem[x].Description;
                                    var Unit = jsonItem[x].Unit;
                                    var PackQuantity = jsonItem[x].PackQuantity;

                                    var tabledetaildatatr = document.createElement("tr");
                                    tabledetaildatatr.id = "tabledetaildatatr" + x;
                                    tabledetaildatatr.className = "tabledetaildatatrCss";
                                    document.getElementById("tableDetail").appendChild(tabledetaildatatr);

                                    var tabledetaildatatd1 = document.createElement("td");
                                    tabledetaildatatd1.id = "tabledetaildatatd1" + x;
                                    tabledetaildatatd1.innerHTML = Barcode;
                                    tabledetaildatatd1.className = "tabledetaildatatdCss";
                                    document.getElementById("tabledetaildatatr" + x).appendChild(tabledetaildatatd1);

                                    var tabledetaildatatd2 = document.createElement("td");
                                    tabledetaildatatd2.id = "tabledetaildatatd2" + x;
                                    tabledetaildatatd2.innerHTML = InventoryName;
                                    tabledetaildatatd2.className = "tabledetaildatatdCss";
                                    document.getElementById("tabledetaildatatr" + x).appendChild(tabledetaildatatd2);

                                    var tabledetaildatatd3 = document.createElement("td");
                                    tabledetaildatatd3.id = "tabledetaildatatd3" + x;
                                    tabledetaildatatd3.innerHTML = Description;
                                    tabledetaildatatd3.className = "tabledetaildatatdCss";
                                    document.getElementById("tabledetaildatatr" + x).appendChild(tabledetaildatatd3);

                                    var tabledetaildatatd4 = document.createElement("td");
                                    tabledetaildatatd4.id = "tabledetaildatatd4" + x;
                                    tabledetaildatatd4.innerHTML = Unit;
                                    tabledetaildatatd4.className = "tabledetaildatatdCss";
                                    document.getElementById("tabledetaildatatr" + x).appendChild(tabledetaildatatd4);

                                    var tabledetaildatatd5 = document.createElement("td");
                                    tabledetaildatatd5.id = "tabledetaildatatd5" + x;
                                    tabledetaildatatd5.innerHTML = PackQuantity;
                                    tabledetaildatatd5.className = "tabledetaildatatdCss";
                                    document.getElementById("tabledetaildatatr" + x).appendChild(tabledetaildatatd5);

                                }
                            }
                        });
                    }

                    ShowModal();
                }
            });
        }

        function printDiv(divID) {
            //Get the HTML of div
            var divElements = document.getElementById(divID).innerHTML;
            //Get the HTML of whole page
            var oldPage = document.body.innerHTML;

            //Reset the page's HTML with div's HTML only
            document.body.innerHTML =
                "<html><head><title></title></head><body>" +
                divElements + "</body>";

            //Print Page
            window.print();

            //Restore orignal HTML
            document.body.innerHTML = oldPage;
        }

    </script>

    <style type="text/css">
    body {
        font-family: Arial;
        font-size: 10pt;
    }

    .modalBackground {
        background-color: #F7F7F7;
        filter: alpha(opacity=90);
        opacity: 0.8;
    }

    .modalPopup {
        background-color: white;
        border: 3px solid #ccc;
        padding: 10px;
        width: 40%;
        height: 55%;
    }


    .ButtonSearch {
        background: #ffc108;
        margin: 0;
        font-family: Circular Std Book;
        font-size: 14px;
        line-height: inherit;
        border-width: thin;
        border-color: #212529;
        border-radius: 2px;
        color: #212529;
    }

    /* Modal Search Item*/
    .modalCss {
        display: none; /* Hidden by default */
        position: fixed; /* Stay in place */
        z-index: 1; /* Sit on top */
        padding-top: 70px; /* Location of the box */
        left: 0;
        top: 0;
        width: 100%; /* Full width */
        height: 100%; /* Full height */
        overflow: auto; /* Enable scroll if needed */
        background-color: rgb(0,0,0); /* Fallback color */
        background-color: rgba(0,0,0,0.4); /* Black w/ opacity */
    }

    .modal-dialogCss {
        margin-top: 30px;
    }

    /* Modal Content */
    .modal-contentCss {
        /*background-color: #fefefe;
            margin: auto;
            border: 1px solid #888;
            width: 80%;
            height: 70%;*/
        background-color: #fefefe;
        margin: auto;
        width: 1200px;
        height: 850px;
        border-radius: 3px;
    }

    /* The Close Button */
    .close {
        color: #aaaaaa;
        float: right;
        font-size: 28px;
        font-weight: bold;
    }

        .close:hover, .close:focus {
            color: #000;
            text-decoration: none;
            cursor: pointer;
        }

  </style>

    <script type="text/javascript">
        // for check all checkbox  
        function CheckAll(Checkbox) {
            var GridVwHeaderCheckbox = document.getElementById("<%=grdDisplayItems.ClientID %>");
            for (i = 1; i < GridVwHeaderCheckbox.rows.length; i++) {
                GridVwHeaderCheckbox.rows[i].cells[0].getElementsByTagName("INPUT")[0].checked = Checkbox.checked;
            }
        }

        function GetConfirmation() {
            var retVal = confirm("Are you sure you want to save items?");
            if (retVal == true) {

                return true;
            } else {

                return false;
            }
        }

        function CheckBoxValidation() {
            var valid = false;
            //Varibale to hold the checked checkbox count
            var chkselectcount = 0;
            //Get the gridview object
            var gridview = document.getElementById('<%= grdDisplayItems.ClientID %>');
            //Loop thorugh items
            for (var i = 0; i < gridview.getElementsByTagName("input").length; i++) {
                //Get the object of input type
                var node = gridview.getElementsByTagName("input")[i];
                //check if object is of type checkbox and checked or not
                if (node != null && node.type == "checkbox" && node.checked) {
                    valid = true;
                    //Increase the count of check box
                    chkselectcount = chkselectcount + 1;
                }
            }

            //Checking the count is zero , this means no checkbox is selected
            if (chkselectcount == 0) {
                alert("Please select atleast one checkbox");
                return false;
            }
            else {
                GetConfirmation();
            }
        }

        function ShowModalItems() {
            var modal = document.getElementById("myModalSearch");
            modal.style.display = "block";
        }

        function CloseModalItems() {
            var modal = document.getElementById("myModalSearch");
            modal.style.display = "none";
        }

    </script>

    <script type="text/javascript">
        /*$(function () {
            var tabName = $("[id*=TabName]").val() != "" ? $("[id*=TabName]").val() : "contact";
            $('#Tabs a[href="#' + tabName + '"]').tab('show');
            $("#Tabs a").click(function () {
                $("[id*=TabName]").val($(this).attr("href").replace("#", ""));
            });
        });*/
    </script>

</asp:Content>
<asp:Content ID="Content2" ContentPlaceHolderID="ContentPlaceHolder1" runat="server">
    <asp:UpdatePanel ID="UpdatePanel3" runat="server" UpdateMode="Conditional">
        <ContentTemplate>
            <table style="        width: 100%;
        padding-bottom: 2px;
        display: none;">
                <tr>
                    <td></td>
                    <td align="right" style="        padding-bottom: 7px;
        padding-right: 15px;">
                        <label for="validationCustom05">
                            Branch
                            <asp:Label ID="Label5" runat="server"></asp:Label>
                        </label>
                        <%-- <asp:DropDownList ID="cmbBranches1" CssClass="custom-select" runat="server" AutoPostBack="true"
                            OnSelectedIndexChanged="cmbBranches_SelectedIndexChanged" Width="200px" Height="35px" Visible="false">
                        </asp:DropDownList>--%>
                        <asp:Label ID="cmbBranches" CssClass="custom-select" Width="250px" runat="server"
                            autopostback="true">
                        </asp:Label>
                    </td>
                </tr>
            </table>

            <asp:Label ID="lblBranchAliasName" ForeColor="Blue" runat="server"></asp:Label>

            <div class="d-none">
                <ul class="nav nav-tabs" id="myTab5" role="tablist">
                </ul>
                <div>
                    <div class="tab-pane fade show active" id="profile-simple" role="tabpanel" aria-labelledby="profile-tab-simple">
                        <div class="card">
                            <h5 class="card-header" style="        background-color: #4c4c4c;
        font-size: 14px;
        color: #F8F9FA">STOCK TRANSFER &nbsp;&nbsp;   
                                    <button type="button" class="ButtonSearch" onclick="ShowModalItems()">
                                        Search
                                    </button>
                                &nbsp;
                                &nbsp;
                        
                            </h5>
                            <div class="card-body">
                                <div class="form-row">
                                    <div class="col-xl-4 col-lg-4 col-md-12 col-sm-12 col-12 mb-2">
                                        <label for="validationCustom03">
                                            Transfer No</label>
                                        <asp:TextBox ID="txtRefNo" runat="server" placeholder="" AutoPostBack="True" OnTextChanged="txtRefNo_TextChanged"
                                            Enabled="False" class="form-control"></asp:TextBox>
                                        <div class="invalid-feedback">
                                        </div>
                                    </div>
                                    <div class="col-xl-4 col-lg-4 col-md-12 col-sm-12 col-12 mb-2">
                                        <label for="validationCustom03">
                                            TransDate</label>
                                        <asp:TextBox ID="txtTransDate" runat="server" class="form-control" placeholder=""
                                            Enabled="False"></asp:TextBox>
                                        <div class="invalid-feedback">
                                        </div>
                                    </div>
                                    <div class="col-xl-4 col-lg-4 col-md-12 col-sm-12 col-12 mb-2">
                                        <label for="validationCustomer03">
                                            Receiving No.</label>
                                        <asp:TextBox ID="txtConfirm" runat="server" placeholder="" class="form-control" Enabled="False"></asp:TextBox>
                                    </div>
                                </div>
                                <div class="form-row">
                                    <div class="col-xl-4 col-lg-4 col-md-12 col-sm-12 col-12 mb-2">
                                        <label for="validationCustom03">
                                            From Branch</label>
                                        <asp:TextBox ID="txtFBranch" runat="server" placeholder="" class="form-control" Enabled="False"></asp:TextBox>
                                    </div>
                                    <div class="col-xl-4 col-lg-4 col-md-12 col-sm-12 col-12 mb-2">
                                        <label for="validationCustom03">
                                            Send Date</label>
                                        <asp:TextBox ID="txtSendDate" runat="server" placeholder="" class="form-control"
                                            Enabled="False"></asp:TextBox>
                                    </div>
                                    <div class="col-xl-4 col-lg-4 col-md-12 col-sm-12 col-12 mb-2">
                                        <label for="validationCustom03">
                                            Receiving Status</label>
                                        <asp:TextBox ID="txtConfirmStatus" runat="server" placeholder="" class="" Enabled="False"></asp:TextBox>
                                    </div>
                                </div>
                                <div class="form-row">
                                    <div class="col-xl-4 col-lg-4 col-md-12 col-sm-12 col-12 mb-2">
                                        <label for="validationCustom03">
                                            To Branch</label>
                                        <asp:DropDownList ID="cmbTBranch" class="custom-select" runat="server" OnSelectedIndexChanged="cmbTBranch_SelectedIndexChanged">
                                        </asp:DropDownList>
                                        <asp:TextBox ID="lblBranchTitle" runat="server" placeholder="" class="form-control"
                                            Enabled="False"></asp:TextBox>
                                    </div>
                                    <div class="col-xl-4 col-lg-4 col-md-12 col-sm-12 col-12 mb-2">
                                        <label for="validationCustom03">
                                            Send Status</label>
                                        <asp:TextBox ID="txtSendStatus" runat="server" placeholder="" class="form-control"
                                            Enabled="False"></asp:TextBox>
                                    </div>
                                    <div class="col-xl-4 col-lg-4 col-md-12 col-sm-12 col-12 mb-2">
                                        <label for="validationCustom03">
                                            USER</label>
                                        <asp:TextBox ID="txtUser" runat="server" placeholder="" class="form-control"
                                            Enabled="False"></asp:TextBox>
                                    </div>
                                </div>
                                <div class="form-row">
                                    <div class="col-xl-4 col-lg-4 col-md-12 col-sm-12 col-12 mb-2">
                                        <label for="validationCustom03">
                                            NOTES</label>
                                        <asp:TextBox ID="txtNotes" runat="server" TextMode="MultiLine" placeholder="Notes"></asp:TextBox>
                                    </div>
                                    <div class="col-xl-4 col-lg-4 col-md-12 col-sm-12 col-12 mb-2">
                                    </div>
                                    <%--<div class="col-xl-4 col-lg-4 col-md-12 col-sm-12 col-12 mb-2">
                                          <label for="validationCustom03">
                                            dd</label>
                                        
                                    </div>--%>

                                    <div class="col-xl-4 col-lg-4 col-md-12 col-sm-12 col-12 mb-2" align="right">
                                        <label for="validationCustom03">
                                        </label>
                                        <asp:Button ID="btnVoid" runat="server" Text="Void" Width="150px" BorderStyle="None" class="btnVoidCss" OnClientClick="return confirm('Are you sure you want to void this transfer?');" OnClick="btnVoid_Click" />
                                    </div>
                                </div>
                                <%--     <asp:Button ID="btnAddItems" runat="server" Text="ADD ITEMS" class="btn btn-space btn-secondary"
                                        PostBackUrl="profile-tab-simple" />--%>
                                <asp:HiddenField ID="HiddenField1" runat="server" />
                                <%--  <asp:LinkButton runat="server" id="SomeLinkButton" href="contact-simple" CssClass="btn btn-primary btn-sm">Button Text</asp:LinkButton>
                                            <asp:Button ID="btnAddTab" runat="server" Text="ADD" PostBackUrl = "contact-simple" />--%>
                                <%--       <ul class="nav nav-tabs" id="Ul1" role="tablist">
                                        <li class="nav-item"><a class="nav-link" id="A1" data-toggle="tab" href="#contact-simple"
                                            role="tab" aria-controls="contact" aria-selected="false">ADD ITEMS </a></li>
                                    </ul>--%>
                                <%--   <asp:Button ID="BtnDelete" runat="server" Text="DELETE ITEMS" class="btn btn-space btn-secondary" />--%>
                                <div class="table-responsive">
                                    <div>
                                        <%--   <table id="Table1" class="table table-striped table-bordered second" style="width: 100%">--%>
                                        <asp:GridView ID="grdTransferDetails" EmptyDataText="No Record found" runat="server"
                                            CellPadding="4" ForeColor="#333333" AutoGenerateColumns="False" Height="68px"
                                            Width="100%" ShowHeaderWhenEmpty="true" DataKeyNames="Barcode" OnRowEditing="grdTranferDetails_RowEditing"
                                            OnRowUpdating="grdTranferDetails_RowUpdating" OnRowCancelingEdit="grdTranferDetails_RowCancelingEdit"
                                            OnRowDeleting="grdTranferDetails_RowDeleting" OnRowCommand="grdTranferDetails_RowCommand">
                                            <AlternatingRowStyle BackColor="White" ForeColor="#284775" />
                                            <Columns>
                                                <asp:TemplateField HeaderText="ID" Visible="false">
                                                    <ItemTemplate>
                                                        <asp:Label ID="lblTSDetailID" runat="server" Text='<%#Eval("TSDetailID") %>'></asp:Label>
                                                    </ItemTemplate>
                                                </asp:TemplateField>
                                                <asp:TemplateField HeaderText="ID" Visible="false">
                                                    <ItemTemplate>
                                                        <asp:Label ID="lblID" runat="server" Text='<%#Eval("InventoryID") %>'></asp:Label>
                                                    </ItemTemplate>
                                                </asp:TemplateField>
                                                <asp:TemplateField HeaderText="Barcode">
                                                    <ItemTemplate>
                                                        <asp:Label ID="lblBarcode" runat="server" Text='<%#Eval("Barcode") %>'></asp:Label>
                                                    </ItemTemplate>
                                                </asp:TemplateField>
                                                <asp:TemplateField HeaderText="Inventory Name">
                                                    <ItemTemplate>
                                                        <asp:Label ID="lblInvName" runat="server" Text='<%#Eval("InventoryName") %>'></asp:Label>
                                                    </ItemTemplate>
                                                </asp:TemplateField>
                                                <asp:TemplateField HeaderText="Description">
                                                    <ItemTemplate>
                                                        <asp:Label ID="lblDesc" runat="server" Text='<%#Eval("Description") %>'></asp:Label>
                                                    </ItemTemplate>
                                                </asp:TemplateField>
                                                <asp:TemplateField HeaderText="Unit">
                                                    <ItemTemplate>
                                                        <asp:Label ID="lblUnit" runat="server" Text='<%#Eval("PackUnit") %>'></asp:Label>
                                                    </ItemTemplate>
                                                </asp:TemplateField>
                                                <asp:TemplateField HeaderText="Pack Price">
                                                    <ItemTemplate>
                                                        <asp:Label ID="lblPackPrice" runat="server" text-align="left" Text='<%#Eval("PackPrice") %>'></asp:Label>
                                                    </ItemTemplate>
                                                </asp:TemplateField>
                                                <asp:TemplateField HeaderText="QTY">
                                                    <ItemTemplate>
                                                        <asp:TextBox ID="txtinputqty" runat="server" CssClass="textbox" TextMode="Number" onKeyDown="if(this.value.length==4 && event.keyCode!=8) return false;" MaxLength="4" Width="80px"
                                                            Text='<%#Eval("PackQuantity") %>'></asp:TextBox>
                                                        <asp:Label ID="lblupdate" runat="server"></asp:Label>
                                                    </ItemTemplate>
                                                </asp:TemplateField>
                                                <asp:TemplateField HeaderText="" Visible="false">
                                                    <ItemTemplate>
                                                        <asp:TextBox ID="txtAdjQTY" runat="server" CssClass="textbox" MaxLength="4" Width="80px"
                                                            Text=''></asp:TextBox>

                                                    </ItemTemplate>
                                                </asp:TemplateField>
                                                <%--  <asp:TemplateField HeaderText="UPDATE">
                                                    <ItemTemplate>
                                                        <asp:Button ID="btnUpdate" runat="server" Text="Update" OnClick="btnUpdate_Click" />
                                                        
                                                    </ItemTemplate>
                                                </asp:TemplateField>--%>
                                                <asp:TemplateField HeaderText="UPDATE" Visible="false">
                                                    <%--  <ItemTemplate>
                                                        <asp:Button ID="btnDelete" runat="server" Text="Delete" />
                                                    </ItemTemplate>--%>
                                                    <ItemTemplate>
                                                        <%--                                                            <asp:Button ID="btn_Edit" runat="server" Text="Edit" CommandName="Edit" class="btn btn-primary"
                                                                OnRowDataBound="OnRowDataBound" />--%>
                                                        <%--   <asp:LinkButton ID="Update" runat="server" CausesValidation="False" ForeColor="Red"
                                                                ToolTip="Click Here to Update" CommandName="Update" OnClientClick="javascript: return confirm('Do you want to Update this record?')"
                                                                CommandArgument='<%#bind("barcode") %>' Text="Update"></asp:LinkButton>--%>
                                                        <asp:Button ID="btnDn" runat="server" CommandArgument="<%#((GridViewRow)Container).RowIndex%>"
                                                            CommandName="Update" CssClass="btn btn-primary" Text="UPDATE" />
                                                    </ItemTemplate>
                                                    <EditItemTemplate>
                                                        <asp:Button ID="btn_Update" runat="server" Text="Update" CommandName="Update" class="btn btn-primary" />
                                                        <asp:Button ID="btn_Cancel" runat="server" Text="Cancel" CommandName="Cancel" class="btn btn-primary" />
                                                    </EditItemTemplate>
                                                </asp:TemplateField>
                                                <asp:TemplateField HeaderText=" ">
                                                    <ItemTemplate>
                                                        <asp:Button ID="btnDelete" runat="server" class="btn btn-primary" Text="Delete" CommandName="Delete"
                                                            OnRowDataBound="OnRowDataBound" OnClientClick="return confirm('Are you sure you want to remove this item?');" />
                                                    </ItemTemplate>
                                                </asp:TemplateField>
                                            </Columns>
                                        </asp:GridView>
                                        <%-- </table>--%>
                                    </div>
                                </div>
                                <br />
                                <br />
                                <div class="rowgrid" align="right" style="        width: 100%">
                                    <div class="column" align="left" style="        width: 50%;
        padding: 0px;
        padding-left: 0px;">
                                        <button type="button" class="btn btn-space btn-primary" style="        background-color: black;
        color: white;" onclick="ViewModalReport();">Preview Report</button>
                                    </div>
                                    <div class="column" align="right" style="        width: 50%;
        padding: 4px;">
                                        <asp:Button ID="btnSave" runat="server" Text="Save" OnClientClick="return confirm('Are you sure you want to save this transfer?');" Width="150px" Height="40px" class="btnSaveCss"
                                            OnClick="btnSave_Click" />
                                    </div>
                                </div>
                                <div class="rowgrid" align="right" style="        width: 100%">
                                    <div class="column" align="left" style="        width: 50%;
        padding: 4px;"></div>

                                    <div class="column" align="right" style="        width: 50%;
        padding: 4px;">
                                        <asp:Button ID="btnSend" runat="server" class="btnConfirmTransferCss" Text="Confirm Transfer"
                                            Width="150px" Height="40px" OnClick="btnSend_Click" OnClientClick="return confirm('Are you sure you want to Confirm this transfer?');" />
                                    </div>


                                </div>
                                <br />
                                <br />
                                <br />
                                <div class="row" style="        display: none;">
                                    <div class="col-xl-12 col-lg-12 col-md-12 col-sm-12 col-12">
                                        <div class="card">
                                            <h5 class="card-header">STOCK</h5>
                                            <div class="card-body">
                                                <div class="row">
                                                    <div class="col-xl-12 col-lg-12 col-md-12 col-sm-12 col-12">
                                                        <div class="card">
                                                            <div class="card-body">
                                                                <form class="needs-validation" novalidate>
                                                                    <div class="form-row">
                                                                        <div class="col-xl-4 col-lg-4 col-md-12 col-sm-12 col-12 mb-2">
                                                                            <label for="validationCustom03">
                                                                                InventoryID</label>
                                                                            <asp:TextBox ID="txtInventoryid" runat="server" class="form-control" AutoPostBack="true"
                                                                                onkeypress="return isNumberKey(event,this)" OnTextChanged="txtInventoryid_TextChanged">
                                                                            </asp:TextBox>
                                                                        </div>
                                                                        <div class="col-xl-4 col-lg-4 col-md-12 col-sm-12 col-12 mb-2">
                                                                            <label for="validationCustom04">
                                                                                Inventory Name
                                                                            </label>
                                                                            <asp:TextBox ID="txtInventoryNameSearch" class="form-control" runat="server"></asp:TextBox>
                                                                        </div>
                                                                        <%-- <div class="col-xl-4 col-lg-4 col-md-12 col-sm-12 col-12 mb-2">
                                                <label for="validationCustom05">Zip</label>
                                                <input type="text" class="form-control" id="validationCustom05" placeholder="Zip" required>
                                                <div class="invalid-feedback">
                                                    Please provide a valid zip.
                                                </div>
                                            </div>--%>
                                                                        <div class="input-group mb-3">
                                                                            <asp:TextBox ID="txtBarcodesearch" runat="server" class="form-control" placeholder="Barcode"> </asp:TextBox>
                                                                            <div class="input-group-append">
                                                                                <asp:Button ID="btnSearch" runat="server" Text="Search" data-toggle="tooltip" data-placement="top"
                                                                                    title="Inventory Search By Bar " CssClass="btn btn-primary" OnClick="btnSearch_Click" />
                                                                            </div>
                                                                        </div>
                                                                        <div class="input-group mb-3">
                                                                        </div>
                                                                    </div>
                                                                </form>
                                                            </div>
                                                        </div>
                                                    </div>
                                                </div>
                                                <div class="table-responsive" id="Tabs">
                                                    <asp:HiddenField ID="TabName" runat="server" />
                                                    <table id="example" class="table table-striped table-bordered second" style="        width: 100%">
                                                        <tbody>
                                                            <caption>
                                                                <asp:HiddenField ID="hidTAB" runat="server" Value="image" />
                                                                <%--   <asp:GridView ID="grdDisplayItems" runat="server" AutoGenerateColumns="False" EmptyDataRowStyle-CssClass="alert-dark"
                                                                        Font-Size="11px" HeaderStyle-BackColor="RoyalBlue" EmptyDataText="No Such Record Found ! "
                                                                        FooterStyle-BackColor="Green" FooterStyle-ForeColor="white" Width="920px" AllowPaging="true"
                                                                        PageSize="15" BackColor="White" AllowSorting="true" BorderColor="#CCCCCC" BorderStyle="None"
                                                                        BorderWidth="1px" CellPadding="3" OnPageIndexChanging="grdDisplayItems_PageIndexChanging">
                                                                        <Columns>
                                                                            <asp:TemplateField ItemStyle-Width="20px">
                                                                                <HeaderTemplate>
                                                                                    <asp:CheckBox ID="chkAllSelect" runat="server" onclick="CheckAll(this);" />
                                                                                </HeaderTemplate>
                                                                                <ItemTemplate>
                                                                                    <!--<asp:CheckBox ID="chkSelect" runat="server" AutoPostBack="true" OnCheckedChanged="CheckBoxProcess_OnCheckedChanged" />-->
                                                                                    <asp:CheckBox ID="chkSelected" runat="server" />
                                                                                </ItemTemplate>
                                                                            </asp:TemplateField>
                                                                            <asp:TemplateField HeaderText="Inventory ID">
                                                                                <ItemTemplate>
                                                                                    <asp:Label ID="lblInventoryID" runat="server" Text='<%#Eval("InventoryID") %>'></asp:Label>
                                                                                </ItemTemplate>
                                                                            </asp:TemplateField>
                                                                            <asp:TemplateField HeaderText="Barcode">
                                                                                <ItemTemplate>
                                                                                    <asp:Label ID="lbldisplayBarcode" runat="server" Text='<%#Eval("barcode") %>'></asp:Label>
                                                                                </ItemTemplate>
                                                                            </asp:TemplateField>
                                                                            <asp:TemplateField HeaderText="Inventory Name">
                                                                                <ItemTemplate>
                                                                                    <asp:Label ID="lblName" runat="server" Text='<%#Eval("inventoryname") %>'></asp:Label>
                                                                                </ItemTemplate>
                                                                            </asp:TemplateField>
                                                                            <asp:TemplateField HeaderText="Description">
                                                                                <ItemTemplate>
                                                                                    <asp:Label ID="lbldispName" runat="server" Text='<%#Eval("description") %>'></asp:Label>
                                                                                </ItemTemplate>
                                                                            </asp:TemplateField>
                                                                        </Columns>
                                                                        <FooterStyle BackColor="#006699" ForeColor="White"></FooterStyle>
                                                                        <HeaderStyle BackColor="White" Font-Bold="True" ForeColor="Black"></HeaderStyle>
                                                                        <PagerStyle BackColor="White" ForeColor="#000066" HorizontalAlign="Left" />
                                                                        <RowStyle ForeColor="#000066" />
                                                                        <SelectedRowStyle BackColor="#669999" Font-Bold="True" ForeColor="White" />
                                                                        <SortedAscendingCellStyle BackColor="#F1F1F1" />
                                                                        <SortedAscendingHeaderStyle BackColor="#007DBB" />
                                                                        <SortedDescendingCellStyle BackColor="#CAC9C9" />
                                                                        <SortedDescendingHeaderStyle BackColor="#00547E" />
                                                                    </asp:GridView>--%>
                                                            </caption>
                                                        </tbody>
                                                    </table>
                                                </div>
                                                <%--  <asp:Button ID="btnAddToTransferList" runat="server" Text="ADD" class="btn btn-space btn-primary"
                                                        OnClick="btnAddToTransferList_Click" />--%>
                                            </div>
                                        </div>
                                    </div>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>

            </div>

            <div id="divcontainer" class="container-fluid bg-white p-2">
                <div class="pt-2">
                    <h3>Transfer Stock</h3>
                   <%-- <button type="button" id="btn-save" class="btn btn-primary btn-sm">Save</button>
                    <button type="button" id="btn-confirm" class="btn btn-success btn-sm">Confirm</button>
                    <button type="button" id="btn-cancel" class="btn btn-sm" style="background-color: gray;color: white">Back</button>--%>
                </div>
                <hr />
                <div>
                    <div class="row pb-2">
                        <div class="col-sm-5 col-md-4">
                            <label class="form-label">Transfer No.</label>
                            <input type="text" id="input-transfernumber" class="form-control" placeholder="" readonly>
                        </div>
                        <div class="col-sm-5 col-md-4">
                            <label class="form-label">Date</label>
                            <input type="text" id="input-date" class="form-control" placeholder="" readonly>
                        </div>
                        <div class="col-sm-5 col-md-4">
                            <label class="form-label">Receive No.</label>
                            <input type="text" id="input-receive" class="form-control" placeholder="N/A" readonly>
                        </div>
                    </div>

                    <div class="row pb-2">
                        <div class="col-sm-5 col-md-4">
                            <label class="form-label">Branch From</label>
                            <input type="text" id="input-branchfrom" class="form-control text-capitalize" placeholder="" readonly>
                        </div>
                        <div class="col-sm-5 col-md-4">
                            <label class="form-label">Date Send</label>
                            <input type="text" id="input-senddate" class="form-control" placeholder="N/A" readonly>
                        </div>
                        <div class="col-sm-5 col-md-4">
                            <label class="form-label">Receive Status</label>
                            <input type="text" id="input-receive-status" class="form-control" placeholder="N/A" readonly>
                        </div>
                    </div>

                    <div class="row pb-2">
                        <div class="col-sm-5 col-md-4">
                            <div class="row">
                                <label class="form-label">Branch To</label>
                                <%--<input type="text" class="form-control" placeholder="Ang Mo Kio" readonly>--%>
                                <!-- Example single danger button -->
                                <div class="btn-group">
                                    <button type="button" id="btn-branch" class="btn btn-primary dropdown-toggle text-capitalize" data-bs-toggle="dropdown" aria-expanded="false" style="width: 100%;height: 35px;text-align: left;display: flex;justify-content: space-between;align-items: center">
                                        Select Branch
                                    </button>
                                    <ul class="dropdown-menu" id="ul-branches" style="        width: 90%">
                                    </ul>
                                </div>
                            </div>

                        </div>
                        <div class="col-sm-5 col-md-4">
                            <label class="form-label">Send Status</label>
                            <input type="text" id="input-send-status" class="form-control" placeholder="N/A" readonly>
                        </div>
                        <div class="col-sm-5 col-md-4">
                            <label class="form-label">User</label>
                            <input type="text" id="input-user" class="form-control" placeholder="N/A" readonly>
                        </div>
                    </div>

                    <div class="row pb-2">
                        <div class="col-sm-5 col-md-4">
                            <label class="form-label">Notes</label>
                            <textarea class="form-control" id="textarea-notes" style="height: 140px"></textarea>
                        </div>


                    </div>

                </div>
                <hr />
                <div class="pb-2">
                    <button type="button" id="btn-additem" class="btn btn-primary btn-sm">Add Item</button>
                </div>
                <div class="container-fluid p-0" style="        overflow-x: auto">
                    <table id="tbl-items" class="table table table-bordered">
                        <thead>
                            <tr>
                                <th scope="col">#</th>
                                <th scope="col">ID</th>
                                <th scope="col">Barcode</th>
                                <th scope="col">Name</th>
                                <th scope="col">Description</th>
                                <th scope="col">Unit</th>
                                <th scope="col">Batch #</th>
                                <th scope="col">Cost</th>
                                <th scope="col">Quantity</th>
                                <th scope="col">Action</th>
                            </tr>
                        </thead>
                        <tbody id="table-body-transfer-item">
                        </tbody>
                    </table>
                </div>
                <div class="pt-2 text-right">
                    <button type="button" id="btn-save" class="btn btn-primary btn-sm" style="width:85px">Save</button>
                    <button type="button" id="btn-confirm" class="btn btn-success btn-sm" style="width:85px">Confirm</button>
                    <button type="button" id="btn-void" class="btn btn-danger btn-sm" style="width:85px">Void</button>
                    <button type="button" id="btn-cancel" class="btn btn-sm" style="background-color: gray;color: white; width:85px;">Back</button>
                </div>
            </div>

            <!--Modal Add Item-->
            <div class="modal" id="modal-additem" tabindex="-1">
                <div class="modal-dialog  modal-dialog-centered">
                    <div class="modal-content p-1">
                        <div class="modal-header">
                            <h5 class="modal-title" id="header-additem">Add Item</h5>
                            <button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button>
                        </div>
                        <div class="modal-body">
                             <label for="input" id="label-index" class="fw-light" style=" visibility: hidden;"></label>
                            <div class="col-sm-5 col-md p-1 ">
                               
                                <label for="input" id="label-barcode" class="fw-light">Barcode </label>
                                <div class="row">
                                    <div class="col-10">
                                        <div class="input-group">
                                            <input type="text" id="input-barcode" class="form-control" placeholder="" autocomplete="off" data-validation="alphanumeric" readonly>
                                        </div>
                                    </div>
                                    <div class="col-2 pl-0">
                                        <button type="button" id="btn-search-item" class="btn btn-white border">
                                            <span class="bi-search"></span>
                                    </div>
                                </div>
                            </div>
                            <div class="col-sm-5 col-md p-1 ">
                                <label for="input" class="fw-light">Name </label>
                                <div class="input-group">
                                    <input type="text" id="input-name" class="form-control" placeholder="" autocomplete="off" data-validation="alphanumeric" readonly>
                                </div>
                            </div>
                            <div class="col-sm-5 col-md p-1 ">
                                <label for="input" class="fw-light">Description </label>
                                <div class="input-group">
                                    <input type="text" id="input-desc" class="form-control" placeholder="" autocomplete="off" data-validation="alphanumeric" readonly>
                                </div>
                            </div>
                            <div class="col-sm-5 col-md p-1 ">
                                <label for="input" class="fw-light">Batch # </label>
                                <div class="input-group">
                                    <input type="text" id="input-batch" class="form-control" placeholder="" autocomplete="off" data-validation="alphanumeric" readonly>
                                </div>
                            </div>

                            <div class="col-sm-5 col-md p-1 ">
                                <div class="row">
                                    <div class="col">
                                        <label for="input" class="fw-light">QOH</label>
                                        <div class="input-group">
                                            <input type="text" id="input-qoh" class="form-control" placeholder="" autocomplete="off" data-validation="alphanumeric" readonly>
                                        </div>
                                    </div>
                                    <div class="col">
                                        <label for="input" class="fw-light">Cost</label>
                                        <div class="input-group">
                                            <input type="text" id="input-cost" class="form-control" placeholder="" autocomplete="off" data-validation="alphanumeric" readonly>
                                        </div>
                                    </div>
                                </div>
                            </div>

                            <div class="col-sm-5 col-md p-1 ">
                                <div class="row">
                                    <div class="col">
                                        <label for="input" class="fw-light">Quantity</label>
                                        <div class="input-group">
                                            <input type="text" id="input-qty" class="form-control" placeholder="0.00" autocomplete="off" data-validation="alphanumeric">
                                        </div>
                                    </div>
                                    <div class="col">
                                    </div>
                                </div>
                            </div>
                        </div>
                        <div class="modal-footer">
                            <button id="btn-add" type="button" class="btn btn-primary">Add</button>
                            <button type="button" id="btn-additem-close" class="btn btn-primary" data-bs-dismiss="modal">Close</button>
                        </div>
                    </div>
                </div>
            </div>

            <!--Modal Search Item-->
            <div class="modal" id="modal-search-item">
                <div class="modal-dialog modal-lg  modal-dialog-centered">
                    <div class="modal-content p-1" style="        height: calc(100vh - 120px);">
                        <div class="modal-header">
                            <h5 class="modal-title">Search Item</h5>
                            <button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button>
                        </div>
                        <div class="modal-body">
                            <div class="row">
                                <div class="col">
                                    <select id="selectedsearch" class="form-select rounded-0" aria-label="size 3 select example">

                                        <option value="1">Category</option>
                                        <option value="2">Barcode</option>
                                        <option value="3">Name</option>
                                        <option value="4">Description</option>
                                    </select>
                                    <%-- <div class="dropdown">
                                        <button class="btn dropdown-toggle w-100 border" type="button" id="dropdownMenuButton1" data-bs-toggle="dropdown" aria-expanded="false">
                                            Search
                                        </button>
                                        <ul class="dropdown-menu w-100" aria-labelledby="dropdownMenuButton1">
                                            <li><a class="dropdown-item">Category</a></li>
                                            <li><a class="dropdown-item">Barcode</a></li>
                                            <li><a class="dropdown-item">Name</a></li>
                                            <li><a class="dropdown-item">Description</a></li>
                                        </ul>
                                    </div>--%>
                                </div>
                                <div class="col">
                                    <div class="input-group mb-3">
                                        <input id="input-search" type="search" class="form-control">
                                        <%-- <span class="input-group-text" id="basic-addon2"><span class="bi-search"></span></span>--%>
                                    </div>
                                </div>
                            </div>
                            <div style="        height: calc(65vh - 85px);
        overflow-x: auto">
                                <table class="table table table-bordered">
                                    <thead>
                                        <tr>
                                            <th scope="col"></th>
                                            <th scope="col">Barcode</th>
                                            <th scope="col">Name</th>
                                            <th scope="col">Description</th>
                                            <th scope="col">Category</th>
                                            <th scope="col">Quantity</th>
                                        </tr>
                                    </thead>

                                    <tbody id="table_body_items">
                                    </tbody>
                                </table>
                            </div>
                            <div class="modal-footer">
                                <button type="button" id="btn-selecteditem" class="btn btn-primary">Select</button>
                                <button type="button" id="btn-searchitem-close" class="btn btn-primary" data-bs-dismiss="modal">Close</button>
                            </div>
                        </div>
                    </div>
                </div>
            </div>

            <!--Modal Search Item-->
            <div class="modal" id="modal-batch-item">
                <div class="modal-dialog modal-lg  modal-dialog-centered">
                    <div class="modal-content p-1" style="        min-height: 80vh">
                        <div class="modal-header">
                            <h5 class="modal-title">Select Batch #</h5>
                            <button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button>
                        </div>
                        <div class="modal-body">
                            <div class="row g-2 align-items-center">
                                <div class="col-2 text-right">
                                    <label class="col-form-label">Barcode :</label>
                                </div>
                                <div class="col-auto pl-0">
                                    <label id="lblbarcode" class="col-form-label">A001</label>
                                </div>
                            </div>
                            <div class="row g-2 align-items-center">
                                <div class="col-2 text-right">
                                    <label class="col-form-label">Name :</label>
                                </div>
                                <div class="col-auto  pl-0">
                                    <label id="lblname" class="col-form-label">Coke</label>
                                </div>
                            </div>
                            <div class="row g-2 align-items-center">
                                <div class="col-2 text-right">
                                    <label for="" class="col-form-label">Description :</label>
                                </div>
                                <div class="col-auto  pl-0">
                                    <label id="lbldesc" class="col-form-label">Coke Coke</label>
                                </div>
                            </div>
                            <table id="tblbatch" class="table table table-bordered">
                                <thead>
                                    <tr>
                                        <th scope="col"></th>
                                        <%--  <th scope="col">Batch ID</th>--%>
                                        <th scope="col">Batch #</th>
                                        <th scope="col">Unit Cost</th>
                                        <th scope="col">Quantity</th>
                                    </tr>
                                </thead>
                                <tbody id="table_body_batch">
                                    <%--               <tr>
                                        <td>
                                            <div class="checkbox text-center">
                                                <label class="form-checkbox form-icon" for="s_fac">
                                                    <input id="s_fac" type="checkbox" class="sev_check">
                                                </label>
                                            </div>
                                        </td>
                                        <td>00001</td>
                                        <td>10.00</td>
                                        <td>20</td>
                                    </tr>
                                    <tr>
                                        <td>
                                            <div class="checkbox text-center">
                                                <label class="form-checkbox form-icon" for="s_fac">
                                                    <input id="s_fac" type="checkbox" class="sev_check">
                                                </label>
                                            </div>
                                        </td>
                                        <td>00002</td>
                                        <td>09.00</td>
                                        <td>12</td>
                                    </tr>--%>
                                </tbody>

                            </table>
                        </div>
                        <div class="modal-footer">
                            <button type="button" id="btn-select-batch" class="btn btn-primary">Select</button>
                            <button type="button" id="btn-batchitem-close" class="btn btn-primary" data-bs-dismiss="modal">Close</button>
                        </div>
                    </div>
                </div>
            </div>
        </ContentTemplate>
    </asp:UpdatePanel>

    <div class="modalCss d-none" id="myModalSearch">
        <div class="modal-dialogCss">
            <div class="modal-contentCss">
                <div class="modal-body" style="        padding: 0px">
                    <div class="card">
                        <h5 class="card-header" style="        background-color: #4c4c4c;
        font-size: 14px;
        color: #F8F9FA">Inventory List
                            <button type="button" class="close" style="        color: White;
        opacity: 1;" onclick="CloseModalItems()">
                                &times;</button></h5>

                        <div class="card-body">
                            <div class="row">
                                <div class="column">
                                    <label for="validationCustom03">
                                        Search Type
                                    </label>
                                    <asp:DropDownList ID="cmbSearchOption" CssClass="custom-select" Height="35px"
                                        runat="server">
                                        <asp:ListItem Value="0" Text="Select"></asp:ListItem>
                                        <asp:ListItem Value="1" Text="Barcode"></asp:ListItem>
                                        <asp:ListItem Value="2" Text="Inventory Name"></asp:ListItem>
                                        <asp:ListItem Value="3" Text="Description"></asp:ListItem>
                                    </asp:DropDownList>
                                    <div style="        margin-top: 8px;">
                                        <asp:Button ID="btnApplySearchItem" runat="server" class="btn btn-primary" Text="Apply" OnClick="btnSearch_Click" />
                                        <%--  OnClick="btnApplySearchModifier_Click" --%>
                                    </div>
                                </div>
                                <div class="column">
                                    <label for="validationCustom03">
                                        Enter Value
                                    </label>
                                    <div style="        padding-top: 0px">
                                        <asp:TextBox ID="txtSearchInput" runat="server" class="form-control" Width="320px"> </asp:TextBox>
                                    </div>
                                </div>
                                <div class="column">
                                </div>

                            </div>
                            <div>
                                <div class="table-responsive" style="        height: 700px;">
                                    <label for="validationCustom03">
                                        Search Result:
                                    </label>
                                    <table id="table" class="table table-striped table-bordered second">
                                        <tbody>
                                            <caption>
                                                <asp:Panel ID="Panel2" runat="server" BackColor="white" Height="70%" ScrollBars="Auto"
                                                    Width="1500px">
                                                    <asp:GridView ID="grdDisplayItems" runat="server" AutoGenerateColumns="False" EmptyDataRowStyle-CssClass="alert-dark"
                                                        Font-Size="11px" HeaderStyle-BackColor="RoyalBlue" EmptyDataText="No Such Record Found ! "
                                                        FooterStyle-BackColor="Green" FooterStyle-ForeColor="white" Width="920px" AllowPaging="true"
                                                        BackColor="White" AllowSorting="true" BorderColor="#CCCCCC" BorderStyle="None"
                                                        BorderWidth="1px" CellPadding="3" PageSize="100" OnPageIndexChanging="grdDisplayItems_PageIndexChanging">
                                                        <%-- OnPageIndexChanging="grdDisplayItems_PageIndexChanging"--%>
                                                        <Columns>
                                                            <asp:TemplateField ItemStyle-Width="20px">
                                                                <HeaderTemplate>
                                                                    <asp:CheckBox ID="chkAllSelect" runat="server" onclick="CheckAll(this);" />
                                                                </HeaderTemplate>
                                                                <ItemTemplate>
                                                                    <!--<asp:CheckBox ID="chkSelect" runat="server" AutoPostBack="true" OnCheckedChanged="CheckBoxProcess_OnCheckedChanged" />-->
                                                                    <asp:CheckBox ID="chkSelected" runat="server" />
                                                                </ItemTemplate>
                                                            </asp:TemplateField>
                                                            <asp:TemplateField HeaderText="Inventory ID">
                                                                <ItemTemplate>
                                                                    <asp:Label ID="lblInventoryID" runat="server" Text='<%#Eval("InventoryID") %>'></asp:Label>
                                                                </ItemTemplate>
                                                            </asp:TemplateField>
                                                            <asp:TemplateField HeaderText="Barcode">
                                                                <ItemTemplate>
                                                                    <asp:Label ID="lbldisplayBarcode" runat="server" Text='<%#Eval("barcode") %>'></asp:Label>
                                                                </ItemTemplate>
                                                            </asp:TemplateField>
                                                            <asp:TemplateField HeaderText="Inventory Name">
                                                                <ItemTemplate>
                                                                    <asp:Label ID="lblName" runat="server" Text='<%#Eval("inventoryname") %>'></asp:Label>
                                                                </ItemTemplate>
                                                            </asp:TemplateField>
                                                            <asp:TemplateField HeaderText="Description">
                                                                <ItemTemplate>
                                                                    <asp:Label ID="lbldispName" runat="server" Text='<%#Eval("description") %>'></asp:Label>
                                                                </ItemTemplate>
                                                            </asp:TemplateField>
                                                        </Columns>
                                                        <FooterStyle BackColor="#006699" ForeColor="White"></FooterStyle>
                                                        <HeaderStyle BackColor="White" Font-Bold="True" ForeColor="Black"></HeaderStyle>
                                                        <%--  <PagerStyle BackColor="White" ForeColor="#000066" HorizontalAlign="Left" />--%>
                                                        <RowStyle ForeColor="#000066" />
                                                        <SelectedRowStyle BackColor="#669999" Font-Bold="True" ForeColor="White" />
                                                        <SortedAscendingCellStyle BackColor="#F1F1F1" />
                                                        <SortedAscendingHeaderStyle BackColor="#007DBB" />
                                                        <SortedDescendingCellStyle BackColor="#CAC9C9" />
                                                        <SortedDescendingHeaderStyle BackColor="#00547E" />

                                                    </asp:GridView>
                                                </asp:Panel>
                                            </caption>
                                        </tbody>
                                    </table>
                                </div>
                            </div>
                            <div style="        padding: 8px;
        text-align: right">
                                <asp:Button ID="btnAddToTransferList" runat="server" Text="Add Item" class="btn btn-space btn-primary"
                                    OnClick="btnAddToTransferList_Click" />
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>

    <%--  Preview Report--%>
    <div class="form-group d-none">
        <div class="card">
            <div class="card-body">
                <div class="table-responsive">
                    <div id="myModal" class="modal">
                        <div class="modal-content">
                            <button id="btnClose" class="close" onclick="Close()">&times;</button>
                            <div id="divReport" class="divReportCss">
                                <div style="        text-align: center;
        font-size: 32px;
        margin-bottom: 20px;">
                                    STOCK TRANSFER
                                </div>
                            </div>
                            <input type="button" style="        height: 100px;
        margin-top: 20px;
        font-size: 18px" value="Print" onclick="printDiv('divReport')" />
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>

    <script src="sunScript/stocktransfer.js"></script>
    <%--    <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script>
    <script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js"></script>--%>

    <script src="https://cdn.jsdelivr.net/npm/bootstrap@5.1.3/dist/js/bootstrap.bundle.min.js" integrity="sha384-ka7Sk0Gln4gmtz2MlQnikT1wXgYsOg+OMhuP+IlRH9sENBO0LRn5q+8nbTov4+1p" crossorigin="anonymous"></script>
    
    <script src="https://cdn.jsdelivr.net/npm/table-to-json@1.0.0/lib/jquery.tabletojson.min.js"></script>
    <script>
         $('#input-user').val(document.getElementById("<%=txtUser.ClientID%>").value);
    </script>
</asp:Content>
