Skip to content

Instantly share code, notes, and snippets.

@version-control

version-control/conditional-dropdown.markdown

Created February 14, 2022 15:36
Show Gist options
  • Save version-control/5877a69920fee5eb221193b277f1b0e5 to your computer and use it in GitHub Desktop.
Save version-control/5877a69920fee5eb221193b277f1b0e5 to your computer and use it in GitHub Desktop.
Download ZIP
conditional dropdown
Raw
index.html
<section icobalt="CobaltControls.Controls.StaticContent" id="PhysCustomForm" class="contact-page hc1 light" universal_="true" dynamic_="true">
<a name="ContactForm"></a>
<div id="ContactPageHC1CSS" src__="%2Fincludes%2Fcontact-page-hc1.css" icobalt="CobaltControls.Controls.Styles">
STYLES: Contact Page HC1 CSS Reference
</div>
<div class="box contact-pad">
<header>
<h3 id="request">REQUEST AN APPOINTMENT OR REFER A PATIENT</h3>
</header>
<fieldset icobalt="CobaltControls.Controls.DataForm" id="PhysContactFormHC1" class="form" datasource_="CobaltControls:CobaltControls.Results.WebContact.ContactForms" filterresults_="@FieldName='ContactID',FilterValue='0'" actions_="RedirectToPage%2CPage%252C%25252FContact%25252FThank-You.aspx%3BNotificationEmail%2CEmailTemplate%252C24592280">
<ul>
<li class="half">
<label for="{ClientID:WorkflowEmail}" class="hide">Workflow Email</label>
<div class="input-text">
<input id="WorkflowEmail" type="text" icobalt="System.Web.UI.WebControls.TextBox" ondatabinding___="Cobalt.Dynamic.Bind" style="background-image:url('data:image/png;background-repeat:no-repeat;background-attachment:scroll;background-size:16px 18px;background-position:98% 50%" />
</div>
</li>
<li class="half">
<label for="{ClientID:Subject}" class="hide">Subject</label>
<div class="input-text">
<input id="Subject" type="text" icobalt="System.Web.UI.WebControls.TextBox" ondatabinding___="Cobalt.Dynamic.Bind" style="background-image:url('data:image/png;background-repeat:no-repeat;background-attachment:scroll;background-size:16px 18px;background-position:98% 50%" />
</div>
</li>
<li class="half">
<label for="{ClientID:FirstName}" class="hide">First Name</label>
<div class="input-text">
<input name="agency" type="hidden" _="" />
<input name="channel" type="hidden" _="" />
<input name="hgcampaignid" type="hidden" _="" />
<input name="hospital" type="hidden" _="" />
<input name="jobnumber" type="hidden" _="" />
<input name="keyword" type="hidden" _="" />
<input name="matchtype" type="hidden" _="" />
<input name="placement" type="hidden" _="" />
<input name="serviceline" type="hidden" _="" />
<input name="target" type="hidden" _="" />
<input name="utm_medium" type="hidden" _="" />
<input name="utm_source" type="hidden" _="" />
<input name="ga_cid" type="hidden" _="" />
<input name="campaign_url" type="hidden" _="" />
<input id="FirstName" placeholder="First Name" type="text" icobalt="System.Web.UI.WebControls.TextBox" ondatabinding___="Cobalt.Dynamic.Bind" style="background-image:url('data:image/png;background-repeat:no-repeat;background-attachment:scroll;background-size:16px 18px;background-position:98% 50%');cursor:auto" /><span display_="Dynamic" controltovalidate_="FirstName" class="validator" icobalt="System.Web.UI.WebControls.RequiredFieldValidator" style="display:none">Name is Required</span>
</div>
</li>
<li class="half">
<label for="{ClientID:LastName}" class="hide">Last Name</label>
<div class="input-text">
<input id="LastName" placeholder="Last Name" type="text" icobalt="System.Web.UI.WebControls.TextBox" ondatabinding___="Cobalt.Dynamic.Bind" /><span display_="Dynamic" controltovalidate_="LastName" class="validator" icobalt="System.Web.UI.WebControls.RequiredFieldValidator" style="display:none">Name is Required</span>
</div>
</li>
<li class="half">
<label for="{ClientID:Address}" class="hide">Address</label>
<div class="input-text">
<input id="Address" placeholder="Address" type="text" icobalt="System.Web.UI.WebControls.TextBox" ondatabinding___="Cobalt.Dynamic.Bind" /><span display_="Dynamic" controltovalidate_="Address" class="validator" icobalt="System.Web.UI.WebControls.RequiredFieldValidator" style="display:none">Address is Required</span>
</div>
</li>
<li class="half">
<label for="{ClientID:ZipCode}" class="hide">Zip Code</label>
<div class="input-text">
<input id="ZipCode" placeholder="Zip Code" type="text" icobalt="System.Web.UI.WebControls.TextBox" ondatabinding___="Cobalt.Dynamic.Bind" /><span display_="Dynamic" controltovalidate_="ZipCode" class="validator" icobalt="System.Web.UI.WebControls.RequiredFieldValidator" style="display:none">ZipCode is Required</span>
</div>
</li>
<li class="half">
<label for="{ClientID:Phone}" class="hide">Phone</label>
<div class="input-text">
<input id="Phone" placeholder="Phone" type="text" icobalt="System.Web.UI.WebControls.TextBox" ondatabinding___="Cobalt.Dynamic.Bind" /><span display_="Dynamic" controltovalidate_="Phone" class="validator" icobalt="System.Web.UI.WebControls.RequiredFieldValidator" style="display:none">Phone is Required</span>
<span display_="Dynamic" controltovalidate_="Phone" class="validator" icobalt="System.Web.UI.WebControls.RegularExpressionValidator" expression_="PhoneNumber" style="display:none">Invalid Phone Number</span>
</div>
</li>
<li class="half">
<label for="{ClientID:HowHelp}" class="hide">Are you a New or Existing Patient?</label>
<div class="input-text">
<select id="HowHelp" icobalt="System.Web.UI.WebControls.DropDownList" ondatabinding___="Cobalt.Dynamic.Bind">
<option value="">New or Existing Patient?</option>
<option value="New Patient">New Patient</option>
<option value="Existing Patient">Existing Patient</option>
</select>
<span display_="Dynamic" controltovalidate_="HowHelp" class="validator" icobalt="System.Web.UI.WebControls.RequiredFieldValidator" style="display:none">Patient Status is Required
<br>
</span>
</div>
</li>
<li class="half hide existing">
<label for="{ClientID:ExistingPatient}" class="hide">What do you need assistance with?</label>
<div class="input-text">
<select id="ExistingPatient" icobalt="System.Web.UI.WebControls.DropDownList" ondatabinding___="Cobalt.Dynamic.Bind">
<option value="[email protected]">Refill Request</option>
<option value="[email protected]">Studies Request</option>
<option value="[email protected]">Appointment Request</option>
</select>
<span display_="Dynamic" controltovalidate_="ExistingPatient" class="validator" icobalt="System.Web.UI.WebControls.RequiredFieldValidator" style="display:none">Select an option
<br>
</span>
</div>
</li>
<li>
<label for="{ClientID:ReasonForAppt}" class="hide">Reason for your appointment:</label>
<div class="input-text">
<textarea id="ReasonForAppt" placeholder="Reason for your appointment:" textmode_="MultiLine" icobalt="System.Web.UI.WebControls.TextBox" ondatabinding___="Cobalt.Dynamic.Bind" class="hidefirstoption"></textarea>
</div>
</li>
<li>For your security, please do not use email to share personal information,
health information, social security numbers or credit card numbers.</li>
</ul>
<input id="FormLocation" type="text" icobalt="System.Web.UI.WebControls.TextBox" ondatabinding___="Cobalt.Dynamic.Bind" defaultproperties="@DefaultValueType='StaticProperty',DefaultValueField='Cobalt:Cobalt.WebUser.CurrentPageName'" style="display:none" />
<input id="FFD6" type="hidden" icobalt="Topaz.Controls.HiddenInput" ondatabinding___="Cobalt.Dynamic.Bind" />
<center><a href="javascript:void(0);" icobalt="System.Web.UI.WebControls.LinkButton" class="btn v1" commandname_="Update">Send Message</a> </center>
<span icobalt="System.Web.UI.WebControls.ValidationSummary" showmessagebox_="true" showsummary_="false" style="display:none">The form is incomplete:</span>
</fieldset>
</div>
</section>
Raw
script.js
var OptionSelected;
var Existing;
$(document).on("change", $('[id$="HowHelp"]'), function () {
OptionSelected = $("select[id$=HowHelp] option:selected").text();
Existing = $('select[id$="ExistingPatient"]').closest("li");
});
$(document).on("change", $('[id$="HowHelp"]'), function () {
if (OptionSelected === "Existing Patient") {
Existing.show();
var v = $('[id$="ExistingPatient"]').val();
var n = $('[id$="ExistingPatient"] option:selected').text();
$('[id$="Subject"]').val(n);
$('[id$="WorkflowEmail"]').val(v);
} else {
Existing.hide().removeClass("valid filled");
$('[id$="WorkflowEmail"]').val();
$('[id$="Subject"]').val();
}
});
$(document).on("change", $('[id$="HowHelp"]'), function () {
if (OptionSelected === "New Patient") {
$('[id$="WorkflowEmail"]').val("[email protected]");
$('[id$="Subject"]').val("New Patient");
} else {
$('[id$="WorkflowEmail"]').val();
$('[id$="Subject"]').val();
}
});
Raw
scripts
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.6.0/jquery.min.js"></script>
Raw
styles
<link href="https://www.brrh.com/includes/general.css" rel="stylesheet" />
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment