ASP.NET MVC Shopping Cart & jQuery

I have a pricing page which display a list of products along with their prices. User can choose to add multiple products to shopping cart (active shopping cart is being shown on right hand side of page). Currently this is how I have implemented it using Ajax/Jquery...

Code snippet from my view (ASPX): Looping thro available products in ViewModel and displaying details:

<% foreach (var _product in _supplier.HotelProducts)
    { %>
    <tr>
        <td colspan="2" align="left" valign="top"><% = _product.Description %></td>
        <td  align="left">
            <% using (Html.BeginForm("AddToCart", "ShoppingCart", FormMethod.Post, new { @class = "addProductToCartForm" }))
                { %>
                <input type="hidden" name="hSupplierID" id="hSupplierID" value="<% = _supplier.ID %>" />
                <input type="hidden" name="hProductCode" id="hProductCode" value="<% = _product.Code %>" />
                <input type="hidden" name="hProductDescription" id="hProductDescription" value="<% = _product.Description %>" />
                <input type="hidden" name="hProductPrice" id="hProductPrice" value="<% = _product.TotalPrice %>" />
                <input type="submit" value="+ Add to cart" />
            <% } %>
        </td>
        <td valign="top" align="center">
            <span id="spanProductPrice" class="_price">$<% = _product.TotalPrice %></span>
        </td>
    </tr>
<% } %>    

As you can see from above code snippet, I have "+ Add to cart" button againts each product and my requirement is to pass SupplierID and Product details (Code, Desc & Price) to my Controller and Cart. Please note that I get list of Products & their pricing from an external webservice and there is no way for me to just pass the Product Code and retrieve corresponding description & price on server side, that's why I need to capture required product details when user adds it to cart.

$(function () {
    $(".addProductToCartForm").submit(function (e) {
        e.preventDefault();
        var HiddenCartForm = {
            SupplierID: $(this.hSupplierID).val(),
            Code: $(this.hProductCode).val(),
            Description: $(this.hProductDescription).val(),
            TotalPrice: $(this.hProductPrice).val()
        };
        $.post($(this).attr("action"), 开发者_JAVA技巧HiddenCartForm, function (data) {
            //alert("Success");
            renderCart(data);
        });
        return false; // form already submitted using ajax, don't submit it again the regular way 
    });
});

function renderCart(data) {
    $("#rightColumn").html(data);
} 

Here is my custom HiddenCartForm object which I use to pass information from View to Controller via JQuery

public class HiddenCartForm
    {
        public string SupplierID { get; set; }
        public string Code { get; set; }
        public string Description { get; set; }
        public decimal? TotalPrice { get; set; }
        //public ProductView Product { get; set; }
    }

I have TWO questions:

[1] Is there a better way to handle this scenario? I am little uncomfortable with so many forms & hidden fields (for holding SupplierID & Product Details) on the View. These forms & hidden fields will be visible when someone does view source.

[2] I need pretty much all of the information from "_product" when user adds a particular product to shopping cart. Is there a better way to pass this information via JQuery instead of using hidden fields as I am looping thro the products foreach (var _product in _supplier.HotelProducts) in my view?

I am on MVC 2 currently.

Why do you need to pass the product's description and price in your form post? Couldn't the controller action that handles the AJAX post look those values up from the database? Depending on how model is defined, supplier ID might also be removed for similar reasons.