Live price check using BookingSync Javascript API v2

booknow.liquid

<form id="bs_booknow_form" action="{{ rental.booknow_url }}" method="get">
  <input type="hidden" id="bs_booknow_rental_id" name="rental_id" value="{{ rental.bookingsync_id }}" />
  <input type="hidden" id="bs_booknow_source" name="source" value="{{ site.domain }}" />
  <input type="hidden" id="bs_booknow_include_tentative" name="include_tentative" value="{{ site.tentatives_as_available }}">
  <div class="row">
    <div class="col-xs-6 col-sm-12 col-md-6">
      <div class="form-group date">
        <label class="date control-label" for="bs_booknow_start_at">
          {% t 'search.form.checkin' %}</label>
        <input autocomplete="off" class="date form-control" data-datepicker=""
          id="bs_booknow_start_at" name="start_at"
          placeholder="{% t 'search.form.checkin' %}"
          data-min="{{ time.today | date: '%Y-%m-%d' }}"
          data-availability-map="{{ rental.availability.map }}"
          data-availability-start-date="{{ rental.availability.start_date | date: '%Y-%m-%d' }}"
          data-value="{{ search_form.checkin | date: '%Y-%m-%d'  }}"
          data-tentatives-as-available="{{ site.tentatives_as_available }}"
          type="text" value="{{ search_form.checkin | date: '%b %d, %Y' }}" />
      </div>
    </div>
    <div class="col-xs-6 col-sm-12 col-md-6">
      <div class="form-group date">
        <label class="date control-label" for="bs_booknow_end_at">
          {% t 'search.form.checkout' %}</label>
        <input autocomplete="off" class="date form-control" data-datepicker=""
          id="bs_booknow_end_at" name="end_at"
          placeholder="{% t 'search.form.checkout' %}"
          data-min="{{ time.tomorrow | date: '%Y-%m-%d' }}"
          data-availability-map="1{{ rental.availability_map }}"
          data-availability-start-date="{{ rental.availability.start_date | date: '%Y-%m-%d' }}"
          data-value="{{ search_form.checkout | date: '%Y-%m-%d'  }}"
          data-tentatives-as-available="{{ site.tentatives_as_available }}"
          type="text" value="{{ search_form.checkout | date: '%b %d, %Y' }}" />
      </div>
    </div>
  </div>
  <div class="row">
    <div class="col-xs-6">
      <div class="form-group number">
        <label class="number control-label" for="bs_booknow_adults">
          {% t 'rentals.booknow.adults.label' %}</label>
        <input autocomplete="off" class="number form-control"
          id="bs_booknow_adults" name="adults"
          placeholder="{% t 'rentals.booknow.adults.placeholder' %}"
          type="number" min="1" max="{{ rental.sleeps_max }}"
          value="{{ search_form.guests }}" />
      </div>
    </div>
    <div class="col-xs-6">
      <div class="form-group number">
        <label class="number control-label" for="bs_booknow_children">
          {% t 'rentals.booknow.children.label' %}</label>
        <input autocomplete="off" class="number form-control"
          id="bs_booknow_children" name="children"
          placeholder="{% t 'rentals.booknow.children.placeholder' %}"
          type="number" min="0" />
      </div>
    </div>
  </div>
  <div id="bs_booknow_price_details"></div>
  <p id="bs_booknow_price" class="price"></p>
  <div id="bs_booknow_errors"></div>
  {% if rental.bookable_online %}
    <button type="submit" class="btn btn-primary btn-block">{% t 'rentals.booknow.submit' %}</button>
    <p class="or">{% t 'rentals.booknow.or' %}</p>
  {% endif %}
  <a class="btn btn-info btn-block" href="{{ rental.inquire_url }}" id="bs_booknow_inquire">{% t 'rentals.booknow.inquire' %}</a>
  <p class="price_notes">{{ rental.price_public_notes }}</p>
</form>
<script type="text/javascript" src="//www.bookingsync.com/api/v2/js/booknow.js"></script>

sample_booknow.html

<form id="bs_booknow_form" action="" method="get">
  <input type="hidden" id="bs_booknow_rental_id" name="rental_id" value="2" />
  <input type="hidden" id="bs_booknow_source" name="source" value="your-website.com" />
  <input type="hidden" id="bs_booknow_include_tentative" name="include_tentative" value="true">
  <div class="row">
    <div class="col-xs-6 col-sm-12 col-md-6">
      <div class="form-group date">
        <label class="date control-label" for="bs_booknow_start_at">Check-in</label>
        <input class="date form-control" id="bs_booknow_start_at" name="start_at" type="text"
               data-value="2016-01-01" />
      </div>
    </div>
    <div class="col-xs-6 col-sm-12 col-md-6">
      <div class="form-group date">
        <label class="date control-label" for="bs_booknow_end_at">Check-out</label>
        <input class="date form-control" id="bs_booknow_end_at" name="end_at" type="text"
               data-value="2016-01-07" />
      </div>
    </div>
  </div>
  <div class="row">
    <div class="col-xs-6">
      <div class="form-group number">
        <label class="number control-label" for="bs_booknow_adults">Adults</label>
        <input class="number form-control" id="bs_booknow_adults" name="adults" type="number"
               min="1" />
      </div>
    </div>
    <div class="col-xs-6">
      <div class="form-group number">
        <label class="number control-label" for="bs_booknow_children">Children</label>
        <input class="number form-control" id="bs_booknow_children" name="children" type="number"
               min="0" />
      </div>
    </div>
  </div>
  <div id="bs_booknow_price_details"></div>
  <p id="bs_booknow_price" class="price"></p>
  <div id="bs_booknow_errors"></div>
</form>
<script type="text/javascript" src="https://www.bookingsync.com/api/v2/js/booknow.js"></script>

You might want to use https://gist.github.com/ZenCocoon/01ff5c681f7899bb24bb as well.