Updating a value in CSHTML from an input button

Greetings.

This may be more of an embarrassing coding question than a specific nopCommerce question, but I'm confident someone here can point me in the right direction.  

I am updating some code for a theme.  This theme was originally put in place when we have nopCommerce 3.6 and now we have 4.0.  A coworker had made some customizations to the theme that are not working properly in nopCommerce 4.0, so I'm looking into it.  Unfortunately, the theme developers can't help (even though we have paid support) because we have customized the code.  That's understandable.  So, I turn to this great community!

In a view, I have several text inputs and "add to cart" buttons like this:

@Html.TextBoxFor(Model => Model.EnteredQuantity, new { @id = "qty-" + Model.Id, @style = "width:60px;" })

<input type="button" id="[email protected]" class="button-2 product-box-add-to-cart-button" value="@addToCartText" data-productid="@Model.Id" onclick="AjaxCart.addproducttocart_catalog('@Url.RouteUrl("AddProductToCart-Catalog", new { productId = Model.Id, quantity = Model.EnteredQuantity, shoppingCartTypeId = (int)ShoppingCartType.ShoppingCart })');return false;" />

This results in a layout with a quantity box and an "add to cart" button so that the user can choose to add any number of something to the cart.  The problem I'm having is that Model.EnteredQuantity always starts as 1 (I think because of minimum order quantity) and that value never gets updated.  So, if I enter "20" in the box beside the "add to cart" button and then click the button, only 1 is added to the cart.  

How do I get

TextBoxFor(Model => Model.EnteredQuantity)

to actually updated the value of

EnteredQuantity

?

Thanks for any assistance.  I'll owe you a drink.

Jeremy

You are changing value in text box, but submitted value is not getting from that field.
Actually submitted quantity is directly hard coded on url.

<input type="button" id="[email protected]" class="button-2 product-box-add-to-cart-button" value="@addToCartText" data-productid="@Model.Id" onclick="AjaxCart.addproducttocart_catalog('@Url.RouteUrl("AddProductToCart-Catalog", new { productId = Model.Id, quantity = Model.EnteredQuantity, shoppingCartTypeId = (int)ShoppingCartType.ShoppingCart })');return false;" />

You can rewrite your code something like this.

@Html.TextBoxFor(Model => Model.EnteredQuantity, new { @id = "qty-" + Model.Id, @style = "width:60px;" })

<input type="button" id="[email protected]" class="button-2 product-box-add-to-cart-button" value="@addToCartText" data-productid="@Model.Id" onclick="add_to_cart_@(Model.Id)()" />


<script>

function add_to_cart_@(Model.Id)(){
    var url = '@Url.RouteUrl("AddProductToCart-Catalog", new { productId = Model.Id, shoppingCartTypeId = (int)ShoppingCartType.ShoppingCart })';
    var qty = $('#[email protected]').val();
    url = url + '&quantity=' + qty; 

    AjaxCart.addproducttocart_catalog(url);
    return false;
}
</script>

This looks like a great idea.  I will definitely try this out today and let you know how it goes.

Thanks!

Jeremy

mhsjaber, you are my hero.  With your inspiration, this now works really well.  Here's what I ended up doing:

function add_to_cart_@(Model.Id)() {
        var productId = "@Model.Id";
        var shoppingCartTypeId = "@((int)ShoppingCartType.ShoppingCart)";
        var quantity = $('#[email protected]').val();
        var addToCartUrlConstructed = "addproducttocart/catalog/" + productId + "/" + shoppingCartTypeId + "/" + quantity;
        AjaxCart.addproducttocart_catalog(addToCartUrlConstructed);
        $('#[email protected]').val("1");
        return false;
    }

I had to build the URL because getting it with RouteUrl always came back empty.  And I added a little line at the end to return the text input to its state of having a value of 1 when the operation is finished.

Thanks a ton!

Jeremy

My pleasure :)