Add Product with Quantity in Search Box

I want to make an enhancement such that the Products are added from the Search Box instead from the List in the body.

For this I have changed the code in SearchBox.cshtml as below

  $(document).ready(function(e) {
                    $('#small-searchterms').autocomplete({
                            delay: 500,
                            minLength: @(Model.SearchTermMinimumLength.ToString()),
                            source: '@(Url.RouteUrl("ProductSearchAutoComplete"))',
                            appendTo: '.search-box',
                            select: function(event, ui) {
                                $("#small-searchterms").val(ui.item.label);
                                setLocation(ui.item.producturl);
                                return false;
                            }
                        })
                        .data("ui-autocomplete")._renderItem = function(ul, item) { 
                            var t = item.label;alert(JSON.stringify(item));
                            //html encode
                            t = htmlEncode(t);
                            return $("<li></li>")
                                .data("item.autocomplete", item)
                                
                                .append(t+ "<img height='42' width='42' style='cursor:pointer;'  src='/Content/Images/blue-shopping-cart-icon-48778.png' onclick='AddToCart_FromSearchBox(\"" + t + "\");' alt="+t +" >")
                                
                                .appendTo(ul);
                        };
                });




function ddToCart_FromSearchBox(t){ alert(t);
        //var did = $(t).attr('data-value');
        //alert(JSON.stringify(item))
        //var ithis=item;
        $(document).ready(function ()
        { 
            var form = $("form").serialize();
            var ithis = $(this);alert('this.id'+ithis.id);
            //alert(JSON.stringify(form));
            $.ajax({
                url: '/ShoppingCart/AddProductToCart_Details',
                //url: '/ShoppingCart/AddProductToCart_Catalog',
                type: 'POST',
                //data: { productId: 14 ,shoppingCartTypeId:1,quantity:1,forceredirection :false},
                data: { productId: $this.data('itemid') ,shoppingCartTypeId:1,form:form},
                dataType: 'json',
                success: function (data) { 
                    //alert(JSON.stringify(data)); 
                    $("#flyout-cart").replaceWith(data.updateflyoutcartsectionhtml);
                    jQuery.each($(".cart-qty"), function (i, val) {
                        $(val).text(data.updatetopcartsectionhtml);
                    }); },
                error: function () { },
                complete: function () { }
            });
        });

    }

I have hard coded the Product Id here - so every time the image - basket icon - is clicked - same product gets added to the cart with Quantity 1
Please help me how to add the Product ID and Quatity on the SearchBox DropDown so that the Shopping Cart gets updated.

Thanks

I am giving more description on my Requirement here below:-
I want to make an enhancement such that the Products are also added to Shopping Cart from the Search Box - that on key down with letters drops down as a down-down list that contains the filtered products of the text entered in the Search box