asp-classic-unified-framework/app/views/Household/edit.asp

<div class="container mt-4">
    <nav aria-label="breadcrumb">
        <ol class="breadcrumb">
            <li class="breadcrumb-item"><a href="/households">Households</a></li>
            <li class="breadcrumb-item"><a href="/households/<%= HouseholdController.household.Id %>"><%= Server.HTMLEncode(HouseholdController.household.Address) %></a></li>
            <li class="breadcrumb-item active" aria-current="page">Edit</li>
        </ol>
    </nav>

    <h1>Edit Household</h1>

    <% Flash().ShowErrorsIfPresent %>

    <div class="card">
        <div class="card-body">
            <form method="post" action="/households/<%= HouseholdController.household.Id %>">
                <div class="row">
                    <div class="col-md-6">
                        <div class="mb-3">
                            <label for="Address" class="form-label">Address <span class="text-danger">*</span></label>
                            <input type="text" class="form-control" id="Address" name="Address" required maxlength="255" value="<%= Server.HTMLEncode(HouseholdController.household.Address) %>">
                        </div>

                        <div class="row">
                            <div class="col-md-4">
                                <div class="mb-3">
                                    <label for="StreetNumber" class="form-label">Street Number</label>
                                    <input type="number" class="form-control" id="StreetNumber" name="StreetNumber" value="<%= HouseholdController.household.StreetNumber %>">
                                </div>
                            </div>
                            <div class="col-md-8">
                                <div class="mb-3">
                                    <label for="StreetName" class="form-label">Street Name</label>
                                    <input type="text" class="form-control" id="StreetName" name="StreetName" maxlength="255" value="<%= Server.HTMLEncode(HouseholdController.household.StreetName & "") %>">
                                </div>
                            </div>
                        </div>

                        <div class="mb-3">
                            <label for="TerritoryId" class="form-label">Territory <span class="text-danger">*</span></label>
                            <select class="form-select" id="TerritoryId" name="TerritoryId" required>
                                <option value="">Select a territory...</option>
                                <%
                                Dim tIter, tItem
                                Set tIter = HouseholdController.territoriesList.Iterator()
                                Do While tIter.HasNext()
                                    Set tItem = tIter.GetNext()
                                %>
                                <option value="<%= tItem.Id %>" <% If tItem.Id = HouseholdController.household.TerritoryId Then Response.Write "selected" End If %>><%= Server.HTMLEncode(tItem.Name) %></option>
                                <%
                                Loop
                                %>
                            </select>
                        </div>

                        <div class="mb-3">
                            <div class="form-check">
                                <input class="form-check-input" type="checkbox" id="IsBusiness" name="IsBusiness" value="1"
                                       <% If HouseholdController.household.IsBusiness = 1 Then Response.Write "checked" End If %>>
                                <label class="form-check-label" for="IsBusiness">
                                    This household is a business
                                </label>
                            </div>
                        </div>

                        <%
                            Dim doNotCallDateVal, doNotCallNotesVal, doNotCallPrivateNotesVal
                            doNotCallDateVal = ""
                            doNotCallNotesVal = ""
                            doNotCallPrivateNotesVal = ""
                            If IsDate(HouseholdController.household.DoNotCallDate) Then
                                doNotCallDateVal = Year(HouseholdController.household.DoNotCallDate) & "-" & _
                                                   Right("0" & Month(HouseholdController.household.DoNotCallDate), 2) & "-" & _
                                                   Right("0" & Day(HouseholdController.household.DoNotCallDate), 2)
                            End If
                            If Not IsNull(HouseholdController.household.DoNotCallNotes) Then
                                doNotCallNotesVal = HouseholdController.household.DoNotCallNotes
                            End If
                            If Not IsNull(HouseholdController.household.DoNotCallPrivateNotes) Then
                                doNotCallPrivateNotesVal = HouseholdController.household.DoNotCallPrivateNotes
                            End If
                        %>
                        <div class="card border-danger-subtle mb-3">
                            <div class="card-body">
                                <div class="form-check mb-3">
                                    <input class="form-check-input" type="checkbox" id="DoNotCall" name="DoNotCall" value="1"
                                           <% If HouseholdController.household.DoNotCall = 1 Then Response.Write "checked" End If %>>
                                    <label class="form-check-label" for="DoNotCall">
                                        Mark this household as Do Not Call
                                    </label>
                                </div>

                                <div class="mb-3">
                                    <label for="DoNotCallDate" class="form-label">Do Not Call Date</label>
                                    <input type="date" class="form-control" id="DoNotCallDate" name="DoNotCallDate" value="<%= doNotCallDateVal %>">
                                </div>

                                <div class="mb-3">
                                    <label for="DoNotCallNotes" class="form-label">Do Not Call Notes</label>
                                    <textarea class="form-control" id="DoNotCallNotes" name="DoNotCallNotes" rows="3"><%= Server.HTMLEncode(doNotCallNotesVal) %></textarea>
                                </div>

                                <div class="mb-0">
                                    <label for="DoNotCallPrivateNotes" class="form-label">Private Do Not Call Notes</label>
                                    <textarea class="form-control" id="DoNotCallPrivateNotes" name="DoNotCallPrivateNotes" rows="3"><%= Server.HTMLEncode(doNotCallPrivateNotesVal) %></textarea>
                                </div>
                            </div>
                        </div>

                        <div class="row">
                            <div class="col-md-6">
                                <div class="mb-3">
                                    <label for="Latitude" class="form-label">Latitude</label>
                                    <input type="text" class="form-control" id="Latitude" name="Latitude" value="<%= Server.HTMLEncode(HouseholdController.household.Latitude & "") %>">
                                </div>
                            </div>
                            <div class="col-md-6">
                                <div class="mb-3">
                                    <label for="Longitude" class="form-label">Longitude</label>
                                    <input type="text" class="form-control" id="Longitude" name="Longitude" value="<%= Server.HTMLEncode(HouseholdController.household.Longitude & "") %>">
                                </div>
                            </div>
                        </div>

                        <div class="d-flex gap-2">
                            <button type="submit" class="btn btn-primary">Update Household</button>
                            <a href="/households/<%= HouseholdController.household.Id %>" class="btn btn-secondary">Cancel</a>
                        </div>
                    </div>
                    <div class="col-md-6">
                        <label class="form-label">Location (click to update coordinates)</label>
                        <div id="map" style="height: 350px; width: 100%; border-radius: 8px;"></div>
                        <small class="text-muted">Click on the map to update latitude and longitude.</small>
                    </div>
                </div>
            </form>
        </div>
    </div>
</div>

<script>
    var existingLat = <%= IIf(HouseholdController.household.Latitude & "" <> "", HouseholdController.household.Latitude, "null") %>;
    var existingLng = <%= IIf(HouseholdController.household.Longitude & "" <> "", HouseholdController.household.Longitude, "null") %>;
</script>
<script src="https://maps.googleapis.com/maps/api/js?key=<%= Server.HTMLEncode(GetAppSetting("GoogleMapsApiKey")) %>&callback=initMap" async defer></script>
<script>
    var map, marker;

    function initMap() {
        var defaultCenter = { lat: -33.8688, lng: 151.2093 };

        // Use existing coordinates if available
        if (existingLat !== null && existingLng !== null) {
            defaultCenter = { lat: existingLat, lng: existingLng };
        }

        map = new google.maps.Map(document.getElementById('map'), {
            zoom: existingLat !== null ? 17 : 12,
            center: defaultCenter,
            mapTypeId: 'roadmap'
        });

        // Place marker if coordinates exist
        if (existingLat !== null && existingLng !== null) {
            marker = new google.maps.Marker({
                position: defaultCenter,
                map: map
            });
        }

        // Click to place/move marker and set coordinates
        map.addListener('click', function(event) {
            placeMarker(event.latLng);
        });
    }

    function placeMarker(location) {
        if (marker) {
            marker.setPosition(location);
        } else {
            marker = new google.maps.Marker({
                position: location,
                map: map
            });
        }

        document.getElementById('Latitude').value = location.lat().toFixed(6);
        document.getElementById('Longitude').value = location.lng().toFixed(6);
    }
</script>