I'm having an error when I try to add a product to the basket.

Master HTML:
<%--including uCommerce libraries--%>
        <script src="/../scripts/uCommerce.ServiceStack.js"></script>
        <script src="/../scripts/uCommerce.jQuery.js"></script>

Page HTML:
<a href="#" id="add-to-basket" class="btn">Add to basket</a>
@*Hidden Inputs*@
<input type="hidden" id="selectedcatalogid" value="24">
<input type="hidden" id="selectedsku" value="jobook">
<input type="hidden" id="selectedvariantsku" value="">

Javascript:
$("#add-to-basket").click(function () {
                $.uCommerce.addToBasket(
                {
                    catalogId: $('#selectedcatalogid').val(),
                    sku: $('#selectedsku').val(),
                    variantSku: $('#selectedvariantsku'),
                    quantity: 1
                });
                return false;
            });

The error message is the follow:

1.  
   1. Uncaught TypeError: Accessing selectionDirection on an input element that cannot have a selection. uCommerce.ServiceStack.js:26
      1. P.senduCommerce.ServiceStack.js:26
      2. P.postToServiceuCommerce.ServiceStack.js:99
      3. callServiceStackuCommerce.jQuery.js:54
      4. $.extend.uCommerce.addToBasketuCommerce.jQuery.js:35
      5. (anonymous function)script.js:1401
      6. v.event.dispatchjquery.min.js:2
      7. o.handle.u

          

         
         

      The inputs seem to be right, what am I doing wrong?