Thank you so much for replying;
There’s no public link unfortunately, site pulled down because of this challenge. I am trying to get it back so you can have a look.
the only explanation and change that has happened that i can think of. It still work in some browsers so that makes it really hard for me to figure out what else could be the problem
in the meantime,
// this code is what initiates the modal show
Template.openTimeSlots.events({
'click .confirm-button'(e,t) {
e.preventDefault();
if (!Meteor.userId()) {
// show guest Signup Modal
Modal.show('guestSignupModal');
}
},
})
// modal code
<div id="guestSignupModal" class="modal fade guestSignupModal" tabindex="-1" role="dialog" aria-labelledby="guestSignupModal">
<div class="modal-dialog modal-login modal-dialog-centered">
<div class="modal-content">
{{#if showConfirmationContent}}
<!-- <h5> Confirmation Content </h5> -->
<!-- TODO: if appointment doesnt reuire host confirmaion, then its confirmed automatically,
if confirmed, show confirmation message else show waiting on host confirmation -->
<div class="modal-header">
<div class="avatar">
<img src="/examples/images/avatar.png" alt="Avatar">
</div>
{{#if confirmed}}
<h4 class="modal-title">Confirmed!</h4>
{{else}}
<h4 class="modal-title">Awaiting Confirmation</h4>
{{/if}}
<button type="button" class="close" data-dismiss="modal" aria-hidden="true">×</button>
</div>
<div class="modal-body px-0 py-0">
<div class="text-center py-3">
{{#if confirmed}}
<!-- <h4 class="modal-title">Confirmed!</h4> -->
<h6 class="mb-2"> You are scheduled with {{hostName}}</h6>
<div class="form-group mx-auto" style="max-width: 195px">
<select class="form-control" id="sel1" style="border: none;
background: transparent;
border-bottom: 1px dashed blue;">
<!-- make placeholder -->
<option value="" hidden>Add to your calendar</option>
<option>3as <small>**</small> </option>
<option>Gooogle</option>
<option>ICal</option>
<option>Outlook</option>
<option>Other</option>
</select>
</div>
{{else}}
{{/if}}
<hr>
<!-- Appointment Summary -->
<div class="mx-auto">
<div class="text-center mb-1">
<span class="d-inline-block">
<i class="fa fa-circle" style="color:{{appointmentColor}}"></i>
</span>
<span class="d-inline">{{ appointmentName }}</span>
</div>
<div class="text-center mb-1">
<span class="d-inline-block">
<i class="fa fa-calendar"></i>
</span>
<span class="d-inline">{{ appointmentTime }} {{ appointmentTimezone }}</span>
</div>
<div class="text-center mb-1">
<span class="d-inline-block">
<i class="fa fa-phone"></i>
</span>
<span class="d-inline-block"><a href="tel:{{appointmentPhoneNo}}">{{appointmentPhoneNo}}</a></span>
<span class="d-inline-block">
<i class="fa fa-map-marker"></i>
</span>
<span class="d-inline-block"><a href="{{appointmentMapDirections}}"> Map Directions</a></span>
</div>
</div>
<!-- /Appointment Summary -->
<hr>
<h6> Publish yours ... </h6>
<div class="input-group mb-2">
<input type="text" class="form-control enter-email-input" placeholder="Enter your email">
<div class="input-group-append">
<button class="btn enter-email-submit" type="submit">Start!</button>
</div>
</div>
<h6 class="text-center" style="font-size: 10px;">
Get started for free. No credit card required
</h6>
</div>
</div>
{{else}}
<div class="modal-header">
<div class="avatar">
<img src="/examples/images/avatar.png" alt="Avatar">
</div>
<h4 class="modal-title">Guest Information</h4>
<button type="button" class="close" data-dismiss="modal" aria-hidden="true">×</button>
</div>
<div class="modal-body">
<!-- {{#autoForm schema=AutoFormSchemas.GuestSignupFormSchema id="registerAppointmentGuest" type='method' meteormethod="users.createAppointmentGuest"}} -->
<!-- FIXME: error lables not showing under each field
https://forums.meteor.com/t/schema-validation-errors-not-showing-in-autoform/36225/13?u=nosizejosh
-->
{{#autoForm schema=AutoFormSchemas.AppointmentGuestsSchema id="registerAppointmentGuest"}}
<fieldset>
<div class="form-group required {{#if afFieldIsInvalid name='name'}}has-error{{/if}}">
{{> afFieldInput name='name' placeholder="Name"}}
</div>
<div class="form-group required {{#if afFieldIsInvalid name='email'}}has-error{{/if}}">
{{> afFieldInput name='email' placeholder="Email"}}
</div>
<div class="form-group required {{#if afFieldIsInvalid name='phone'}}has-error{{/if}}">
{{> afFieldInput name='phone' placeholder="Primary Phone Number"}}
</div>
<div class="form-group">
<button type="submit" class="btn btn-primary btn-lg btn-block login-btn">Book Appointment</button>
</div>
</fieldset>
{{/autoForm}}
</div>
<div class="modal-footer">
<a href="#">Already Have an Account? SignIn to Book</a>
</div>
{{/if}}
</div>
</div>
</div>
I am trying to push it back
