Update Request Demo form: add state/county/comments + interest dropdown;…

Update Request Demo form: add state/county/comments + interest dropdown; simplify validation (name/email/phone/agency required); make contact radios optional with Email default

emSystemsWeb/View.RequestDemo.dfm

@@ -5,8 +5,8 @@ object FRequestDemo: TFRequestDemo
   ElementFont = efCSS
   OnCreate = WebFormCreate
   object lblReqPrefMethod: TWebLabel
-    Left = 54
-    Top = 138
+    Left = 50
+    Top = 218
     Width = 225
     Height = 15
     Caption = 'Please choose a preferred contact method.'
@@ -18,8 +18,8 @@ object FRequestDemo: TFRequestDemo
   end
   object edtReqName: TWebEdit
     Left = 50
-    Top = 62
-    Width = 121
+    Top = 34
+    Width = 267
     Height = 22
     TabStop = False
     ElementID = 'edt_req_name'
@@ -30,7 +30,7 @@ object FRequestDemo: TFRequestDemo
     WidthPercent = 100.000000000000000000
   end
   object edtReqEmail: TWebEdit
-    Left = 196
+    Left = 50
     Top = 62
     Width = 121
     Height = 22
@@ -45,8 +45,8 @@ object FRequestDemo: TFRequestDemo
     WidthPercent = 100.000000000000000000
   end
   object edtReqAgency: TWebEdit
-    Left = 196
-    Top = 100
+    Left = 50
+    Top = 90
     Width = 121
     Height = 22
     TabStop = False
@@ -59,8 +59,8 @@ object FRequestDemo: TFRequestDemo
     WidthPercent = 100.000000000000000000
   end
   object edtReqPhoneNumber: TWebEdit
-    Left = 50
-    Top = 100
+    Left = 196
+    Top = 62
     Width = 121
     Height = 22
     TabStop = False
@@ -75,8 +75,8 @@ object FRequestDemo: TFRequestDemo
     WidthPercent = 100.000000000000000000
   end
   object radReqPhone: TWebRadioButton
-    Left = 54
-    Top = 164
+    Left = 50
+    Top = 239
     Width = 117
     Height = 22
     Caption = 'Phone'
@@ -89,26 +89,27 @@ object FRequestDemo: TFRequestDemo
     HeightPercent = 100.000000000000000000
     ShowFocus = False
     WidthPercent = 100.000000000000000000
+    OnClick = radReqPhoneClick
   end
   object radReqEmail: TWebRadioButton
     Left = 196
-    Top = 164
+    Top = 239
     Width = 121
     Height = 22
     Caption = 'Email'
-    Checked = False
+    Checked = True
     ChildOrder = 6
     Color = clNone
     ElementID = 'rad_req_email'
     ElementFont = efCSS
     HeightStyle = ssAuto
     HeightPercent = 100.000000000000000000
-    ShowFocus = False
     WidthPercent = 100.000000000000000000
+    OnClick = radReqEmailClick
   end
   object btnReqSendRequest: TWebButton
-    Left = 54
-    Top = 212
+    Left = 50
+    Top = 267
     Width = 96
     Height = 25
     Caption = 'Send Request'
@@ -121,10 +122,77 @@ object FRequestDemo: TFRequestDemo
     WidthPercent = 100.000000000000000000
     OnClick = btnReqSendRequestClick
   end
+  object edtReqState: TWebEdit
+    Left = 196
+    Top = 90
+    Width = 121
+    Height = 22
+    TabStop = False
+    ChildOrder = 8
+    ElementClassName = 'form-control'
+    ElementID = 'edt_req_state'
+    ElementFont = efCSS
+    HeightStyle = ssAuto
+    HeightPercent = 100.000000000000000000
+    ShowFocus = False
+    WidthPercent = 100.000000000000000000
+  end
+  object edtReqCounty: TWebEdit
+    Left = 50
+    Top = 118
+    Width = 121
+    Height = 22
+    TabStop = False
+    ChildOrder = 8
+    ElementClassName = 'form-control'
+    ElementID = 'edt_req_county'
+    ElementFont = efCSS
+    HeightStyle = ssAuto
+    HeightPercent = 100.000000000000000000
+    ShowFocus = False
+    WidthPercent = 100.000000000000000000
+  end
+  object memoAdditionalComments: TWebMemo
+    Left = 50
+    Top = 147
+    Width = 267
+    Height = 65
+    TabStop = False
+    ElementID = 'memo_additional_comments'
+    ElementFont = efCSS
+    HeightPercent = 100.000000000000000000
+    Lines.Strings = (
+      '')
+    SelLength = 0
+    SelStart = 2
+    ShowFocus = False
+    WidthPercent = 100.000000000000000000
+  end
+  object wcbInterest: TWebComboBox
+    Left = 196
+    Top = 118
+    Width = 121
+    Height = 23
+    ElementClassName = 'form-select'
+    ElementID = 'wcb_interest'
+    ElementFont = efCSS
+    HeightStyle = ssAuto
+    HeightPercent = 100.000000000000000000
+    ShowFocus = False
+    TabStop = False
+    WidthPercent = 100.000000000000000000
+    ItemIndex = -1
+    Items.Strings = (
+      ''
+      'Public Safety'
+      'Records Management'
+      'Custom Software'
+      'Other')
+  end
   object xdwcRequestDemo: TXDataWebClient
     Connection = DMConnection.ApiConnection
     OnError = xdwcRequestDemoError
-    Left = 270
-    Top = 260
+    Left = 264
+    Top = 362
   end
 end

emSystemsWeb/View.RequestDemo.html

@@ -22,24 +22,45 @@
                 </div>
 
                 <div class="col-12 col-md-7">
-                  <label for="edt_req_email" class="form-label mb-1">Email</label>
+                  <label for="edt_req_email" class="form-label mb-1">Email*</label>
                   <input type="email" class="form-control" id="edt_req_email">
                   <div id="fb_req_email" class="invalid-feedback">Please enter a valid email address.</div>
                 </div>
 
                 <div class="col-12 col-md-5">
-                  <label for="edt_req_phone_number" class="form-label mb-1">Phone Number</label>
+                  <label for="edt_req_phone_number" class="form-label mb-1">Phone Number*</label>
                   <input type="tel" class="form-control" id="edt_req_phone_number">
                   <div id="fb_req_phone" class="invalid-feedback">Please enter a phone number.</div>
                 </div>
 
                 <div class="col-12 col-md-6">
-                  <label for="edt_req_agency" class="form-label mb-1">Agency</label>
+                  <label for="edt_req_agency" class="form-label mb-1">Company/Agency*</label>
                   <input type="text" class="form-control" id="edt_req_agency">
+                  <div id="fb_req_agency" class="invalid-feedback">Please enter your Agency or Company.</div>
+                </div>
+
+                <div class="col-12 col-md-6">
+                  <label for="edt_req_state" class="form-label mb-1">State</label>
+                  <input type="text" class="form-control" id="edt_req_state">
+                </div>
+
+                <div class="col-12 col-md-6">
+                  <label for="edt_req_county" class="form-label mb-1">County</label>
+                  <input type="text" class="form-control" id="edt_req_county">
+                </div>
+
+                <div class="col-12 col-md-6">
+                  <label for="wcb_interest" class="form-label mb-1">Interest</label>
+                  <select class="form-select" id="wcb_interest"></select>
                 </div>
 
                 <div class="col-12">
-                  <div id="lbl_req_pref_method" class="form-label mb-2">Preferred Contact Method*</div>
+                  <label for="memo_additional_comments" class="form-label mb-1">Additional Comments</label>
+                  <textarea class="form-control" id="memo_additional_comments" rows="4"></textarea>
+                </div>
+
+                <div class="col-12">
+                  <div id="lbl_req_pref_method" class="form-label mb-2">Preferred Contact Method</div>
 
                   <div class="d-flex flex-column flex-sm-row gap-2 gap-sm-4">
                     <div class="form-check">
@@ -53,9 +74,6 @@
                     </div>
                   </div>
 
-                    <div id="fb_req_pref" class="text-danger small mt-1 d-none">
-                      Please choose a preferred contact method.
-                    </div>
                 </div>
 
                 <div class="col-12 mt-4">
@@ -63,12 +81,8 @@
                     Send Request
                   </button>
                 </div>
-
               </div>
             </form>
-
-
-
           </div>
         </div>
       </div>

emSystemsWeb/View.RequestDemo.pas

@@ -18,7 +18,13 @@ type
     radReqEmail: TWebRadioButton;
     btnReqSendRequest: TWebButton;
     xdwcRequestDemo: TXDataWebClient;
+    edtReqState: TWebEdit;
+    edtReqCounty: TWebEdit;
+    memoAdditionalComments: TWebMemo;
+    wcbInterest: TWebComboBox;
     procedure btnReqSendRequestClick(Sender: TObject);
+    procedure radReqEmailClick(Sender: TObject);
+    procedure radReqPhoneClick(Sender: TObject);
     procedure WebFormCreate(Sender: TObject);
     procedure xdwcRequestDemoError(Error: TXDataClientError);
   private
@@ -27,7 +33,6 @@ type
     procedure NavScrollSizing;
     procedure ClearFieldErrors;
     procedure SetInvalid(const inputId: string);
-    procedure ShowFeedback(const feedbackId: string);
     function ValidateRequest: Boolean;
     procedure SendRequest;
   end;
@@ -93,14 +98,6 @@ begin
   Result := '';
 end;
 
-procedure TFRequestDemo.ShowFeedback(const feedbackId: string);
-var
-  el: TJSHTMLElement;
-begin
-  el := TJSHTMLElement(document.getElementById(feedbackId));
-  if Assigned(el) then
-    el.classList.remove('d-none');
-end;
 
 procedure TFRequestDemo.SetInvalid(const inputId: string);
 var
@@ -114,7 +111,6 @@ end;
 procedure TFRequestDemo.ClearFieldErrors;
 var
   inputEl: TJSHTMLElement;
-  prefEl: TJSHTMLElement;
 begin
   inputEl := TJSHTMLElement(document.getElementById('edt_req_name'));
   if Assigned(inputEl) then inputEl.classList.remove('is-invalid');
@@ -125,52 +121,49 @@ begin
   inputEl := TJSHTMLElement(document.getElementById('edt_req_phone_number'));
   if Assigned(inputEl) then inputEl.classList.remove('is-invalid');
 
-  prefEl := TJSHTMLElement(document.getElementById('fb_req_pref'));
-  if Assigned(prefEl) then
-    prefEl.classList.add('d-none');
+  inputEl := TJSHTMLElement(document.getElementById('edt_req_agency'));
+  if Assigned(inputEl) then inputEl.classList.remove('is-invalid');
 end;
 
-
 function TFRequestDemo.ValidateRequest: Boolean;
 var
-  prefMissing: Boolean;
-  needsEmail: Boolean;
-  needsPhone: Boolean;
-  emailHasText: Boolean;
+  isValid: Boolean;
+  emailText: string;
 begin
   ClearFieldErrors;
+  isValid := True;
 
   if edtReqName.Text.Trim = '' then
   begin
     SetInvalid('edt_req_name');
-    Exit(False);
+    isValid := False;
   end;
 
-  prefMissing := not (radReqPhone.Checked or radReqEmail.Checked);
-  if prefMissing then
+  emailText := edtReqEmail.Text.Trim;
+  if emailText = '' then
   begin
-    ShowFeedback('fb_req_pref');
-    Exit(False);
-  end;
-
-  needsEmail := radReqEmail.Checked;
-  needsPhone := radReqPhone.Checked;
-
-  emailHasText := edtReqEmail.Text.Trim <> '';
-
-  if (needsEmail or emailHasText) and (not IsEmailValid(edtReqEmail.Text)) then
+    SetInvalid('edt_req_email');
+    isValid := False;
+  end
+  else if not IsEmailValid(emailText) then
   begin
     SetInvalid('edt_req_email');
-    Exit(False);
+    isValid := False;
   end;
 
-  if needsPhone and (edtReqPhoneNumber.Text.Trim = '') then
+  if edtReqPhoneNumber.Text.Trim = '' then
   begin
     SetInvalid('edt_req_phone_number');
-    Exit(False);
+    isValid := False;
   end;
 
-  Result := True;
+  if edtReqAgency.Text.Trim = '' then
+  begin
+    SetInvalid('edt_req_agency');
+    isValid := False;
+  end;
+
+  Result := isValid;
 end;
 
 
@@ -194,17 +187,38 @@ begin
   SendRequest;
 end;
 
+procedure TFRequestDemo.radReqEmailClick(Sender: TObject);
+begin
+  if radReqEmail.Checked then
+  radReqPhone.Checked := False;
+end;
+
+procedure TFRequestDemo.radReqPhoneClick(Sender: TObject);
+begin
+  if radReqPhone.Checked then
+  radReqEmail.Checked := False;
+end;
+
 procedure TFRequestDemo.SendRequest;
 var
   bodyText: string;
+  pref: string;
 begin
+  pref := PreferredMethod;
+
   bodyText :=
     'Demo request details:' + sLineBreak +
     'Name: ' + edtReqName.Text + sLineBreak +
     'Email: ' + edtReqEmail.Text + sLineBreak +
     'Phone: ' + edtReqPhoneNumber.Text + sLineBreak +
-    'Agency: ' + edtReqAgency.Text + sLineBreak +
-    'Preferred contact: ' + PreferredMethod;
+    'Company/Agency: ' + edtReqAgency.Text + sLineBreak +
+    'State: ' + edtReqState.Text + sLineBreak +
+    'County: ' + edtReqCounty.Text + sLineBreak +
+    'Interest: ' + wcbInterest.Text + sLineBreak +
+    'Additional comments: ' + memoAdditionalComments.Text;
+
+  if pref <> '' then
+    bodyText := bodyText + sLineBreak + 'Preferred contact: ' + pref;
 
   xdwcRequestDemo.RawInvoke('IApiService.SendEmail',
     [edtReqName.Text, edtReqEmail.Text, 'Demo Request', bodyText],
@@ -217,8 +231,12 @@ begin
       edtReqEmail.Text := '';
       edtReqPhoneNumber.Text := '';
       edtReqAgency.Text := '';
+      edtReqState.Text := '';
+      edtReqCounty.Text := '';
+      memoAdditionalComments.Text := '';
       radReqPhone.Checked := False;
-      radReqEmail.Checked := False;
+      radReqEmail.Checked := True;
+      wcbInterest.ItemIndex := -1;
 
       ShowNotificationModal('Your demo request has been sent successfully. We will reach out shortly.');
     end);

emSystemsWebServer/bin/emSystemsWebServer.ini

 [Settings]
 memoLogLevel=3
 fileLogLevel=4
-LogFileNum=43
+LogFileNum=44
 webClientVersion=1.0.1
 
 [SMTP]