~/wcscripts/guestbook.wc
<% * VS Addin Comment: SourceFile="~\..\..\fox\samples\wwdemo\wwdemo.prg" %>
<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
    <title>Guest Book Browser</title>
    <meta charset="utf-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">
    <meta name="description" content="">

    <link rel="shortcut icon" href="favicon.ico" type="image/x-icon" />
    <meta name="apple-mobile-web-app-capable" content="yes" />
    <meta name="apple-mobile-web-app-status-bar-style" content="black" />
    <link rel="apple-touch-icon" href="touch-icon.png" />

    <link rel="icon" href="touch-icon.png" />
    <meta name="msapplication-TileImage" content="touch-icon.png">

    <!-- application.css references bootstrap and font-awesome -->
    <link href="~/lib/bootstrap/dist/css/bootstrap.min.css" rel="stylesheet" />
    <link href="~/lib/fontawesome/css/all.min.css" rel="stylesheet" />
    <link href="~/css/application.css" rel="stylesheet" />
    <style>
        .btn {
            min-width: 90px;
        }
    </style>
</head>
<body>

    <div>

        <div class="banner no-slide-menu">
            <a class="slide-menu-toggle-open no-slide-menu"
               title="More Samples">
                <i class="fa fa-bars"></i>
            </a>

            <div class="title-bar no-slide-menu">
                <a href="./">
                    <img src="images/icon.png"
                         style="height: 45px; float: left" />
                    <div style="float: left; margin: 4px 5px; line-height: 1.0">
                        <i style="color: #0092d0; font-size: 0.9em; font-weight: bold;">West Wind</i><br />
                        <i style="color: whitesmoke; font-size: 1.6em; font-weight: 600;">
                            Web Demo
                        </i>
                    </div>
                </a>
            </div>

            <nav class="banner-menu-top float-right">
                <a id="SamplesLink" class="hidable">
                    <i class="fa fa-list"></i>
                    More
                </a>
                <a href="http://west-wind.com/webconnection/docs/" class="hidable">
                    <i class="fa fa-book"></i>
                    Documentation
                </a>
                <a href="admin/admin.aspx" class="hidable">
                    <i class="fa fa-gear"></i>
                    Admin
                </a>
            </nav>
        </div>
    </div>

    <div id="MainView" class="container">
        <div class="container">
            <div class="page-header-text">
                <i class="fa fa-list-alt"></i> Guest Book Browser
            </div>

            <div class="btn-group margin-bottom">
                <a href="default.htm" class="btn btn-secondary"><i class="fa fa-home"></i> Home</a>
                <a href="GuestBrowser.wwd" class="btn btn-secondary"><i class="fa fa-calendar"></i> Browse</a>
                <a href="guest_book.wwd?Action=Add&id=<%= pcId %>" class="btn btn-secondary"><i class="fa fa-plus-circle"></i> Add Guest</a>
                <a href="showcode.wwd?func=Guest_Book" class="btn btn-secondary"><i class="fa fa-code"></i> Show Code</a>
                <a href="showfileastext.wwd?file=~/wcscripts/guestbook.wc" class="btn btn-secondary"><i class="fa fa-edit"></i> Show Template</a>
            </div>

            <div class="alert alert-info" style="margin-top: 15px;">
                <i class="fa fa-info-circle pull-left"></i>
                This example uses Html Templates for rendering along with HtmlHelpers to render most of the input controls.
                The code in this sample is driven through a single class method (wwDemo::GuestBook) which handles all the
                buttons and navigation as well as the save operation.
            </div>


            <div style="clear: both"></div>

            <!-- display error here - if empty nothing displays, otherwise error box shows -->
            <%= HtmlErrorDisplay(pcErrorMessage,pcErrorIcon) %>


            <div class="btn-group float-left" style="margin: 15px 0;">
                <a href="guest_book.wwd?Action=Top&id=<%=pcID%>" class="btn btn-sm btn-secondary"><i class="fa fa-fast-backward"></i> First</a>
                <a href="guest_book.wwd?Action=Previous&id=<%=pcID%>" class="btn btn-sm btn-secondary"><i class="fa fa-backward"></i> Previous</a>
                <a href="guest_book.wwd?Action=Next&id=<%=pcID%>" class="btn btn-sm btn-secondary">Next <i class="fa fa-forward"></i></a>
                <a href="guest_book.wwd?Action=Bottom&id=<%=pcID%>" class="btn btn-sm btn-secondary">Last <i class="fa fa-fast-forward"></i></a>
            </div>

            <br clear="all" />




            <form action="guest_book.wwd" method="post">

                <div class="form-group" style="background: #adcfdd;padding: 8px 5px;">

                    <%= HtmlDropDown("cmbName",TRIM(guest.custId),"tquery","TRIM(custid)","name", [onchange="btnRefresh.click();" class="form-control" style="display: inline; width: 80%; font-weight: bold"] ) %>

                    <button id="btnRefresh" class="btn btn-default" type="button"
                            onclick="location.href='guest_book.wwd?id=' + document.getElementById('cmbName').value">
                        <i class="fa fa-refresh"></i> Refresh
                    </button>
                </div>
                
                <div class="float-right">
                    <i class="fa fa-clock-o"></i>  Entered on: <%=IIF(EMPTY(guest.entered),DTOC(date()),DTOC(guest.entered))%>
                </div>




                <div class="form-group">
                    <label class="control-label" for="txtName">Name</label>
                    <%= HtmlTextBox("txtName",trim(guest.name),[ class="form-control" placeholder="Enter your name"] ) %>
                </div>
                <div class="form-group">
                    <label class="control-label" for="txtName">Company</label>
                    <%= HtmlTextBox("txtCompany",trim(guest.company),[ class="form-control" placeholder="Company or leave empty"] ) %>
                </div>

                <div class="form-group">
                    <label class="control-label" for="txtEmail">Email</label>
                    <%= HtmlTextBox("txtEmail",TRIM(guest.email),[class="form-control"]) %>
                </div>

                <div class="form-group">
                    <label>From:</label>
                    <%= HtmlTextBox("txtLocation",TRIM(guest.location),[class="form-control" placeholder="Where are you writing from?"]) %>
                </div>

                <div class="form-group">
                    <label>Leave a note:</label>
                    <%= HtmlTextArea("txtMessage",TRIM(guest.message),[class="form-control" style="height: 100px;"]) %>
                </div>
                <div class="form-group">
                    <label>Password</label>
                    <%= HtmlPassword("txtPassword",[],[class="form-control"]) %>
                    <small>(required to change entry)</small>
                </div>
                <div class="form-group">

                    <label>Validate</label>
                    <%= pcCaptchaHtml %>

                    <hr />
                    <button id="btnSubmit" name="btnSubmit"
                            type="submit" value="SAVE"
                            class="btn btn-default" style="width: 170px;">
                        <i class="fa fa-check" style="color: green"></i> Update Entry
                    </button>
                </div>


                <div class="dialog-statusbar" style="margin-top: 10px;font-size: 8pt;">
                    <%=STR(RecCount())%> visitors have signed the guestbook.
                </div>


                <%= HtmlHidden("Id",guest.CustId) %>
                <%= Process.AddAntiForgeryToken(.T.) %>
            </form>



        </div>
    </div>

    <hr>

    <a href="https://webconnection.west-wind.com" class="float-right">
        <img src="~/images/wcpower.png" alt="Powered by Web Connection" style="margin: 0 5px 20px;" />
    </a>

    <!--<small>
        <a href="/wconnect/" class="btn btn-link">Web Connection Demo page</a>
        <a href="showcode.wwd?func=GuestBook" class="btn btn-link">Show Code</a>
        <a href="showfileastext.wwd?file=guest.wc" class="btn btn-link">Show Template</a>
    </small>-->

    

</body>
</html>