title: Getting the MVC textbox value using Jquery
body: <p>Good day</p>
  
  <p>I am trying to retrieve the value of a textbox field in MVC using Razor and assign it to a variable to later be passed via ajax to an action controller.
  I have tried using .val() but when debugging using Google developer tools I keep getting .val() is not a function. I am not that experienced with jquery right now and would like a little assistance. herre is the coode below.</p>
  
  <p>The Jquery Code</p>
  
  <pre><code>$(".RefreshQuantity").click(function () {
              // Get the id from the link
              var productToUpdate = $(this).attr("data-id");
              var countToUpdate = $('#txt-id').val();
              if (productToUpdate != '') {
                  // Perform the ajax post
                  $.post("/ShoppingCart/UpdateQuantity", { "id": productToUpdate, "cartCount": countToUpdate },
                      function (data) {
                          // Successful requests get here
                          // Update the page elements
                          if (data.ItemCount == 0) {
                              $('#row-' + data.DeleteId).fadeOut('slow');
                          } //else {
                          //    $('#item-count-' + data.DeleteId).text(data.ItemCount);  
                          //}
  
                          $('#cart-total').text(data.CartTotal).formatCurrency();
                          $('#update-message').text(data.Message).show();
                          setTimeout(function () { $("#update-message").hide(); }, 4000);
                          $('#cart-status').text('Cart (' + data.CartCount + ')');
  
                      });
              }
          })
  </code></pre>
  
  <p>I am trying to get the value and assign it to the countToUpdate variable,</p>
  
  <p>My Razor code is below</p>
  
  <pre><code> @{int i = 0;}
              @foreach (var item in Model.CartItems)
              {
                  &lt;tr id="row-@item.OrderCodeID"&gt;
                      &lt;td&gt;
                          @*@item.ProductAttribute.Product.ProductImagePath*@
                          &lt;img src="/Images/OnlineStore/ProductImages/@item.ProductAttribute.Product.ProductImagePath"
                               style="border:solid; height: 50px; width: 50px; border-color: #CCCCCC;" alt="@item.ProductAttribute.Product.ProductImagePath" /&gt;
                      &lt;/td&gt;
                      &lt;td&gt;
                          @item.ProductAttribute.OrderCodeID
                      &lt;/td&gt;
                      &lt;td&gt;
                          @Html.ActionLink(item.ProductAttribute.Product.ProductName, "ProductDetails", "Store", new { productId = item.ProductAttribute.ProductID }, null)
                      &lt;/td&gt;
                      &lt;td&gt;
                          @String.Format("{0:c}",@item.ProductAttribute.Product.ProductPrice)
                      &lt;/td&gt;
                      @*&lt;td id="item-count-@item.OrderCodeID"&gt;
                          @item.Quantity
                      &lt;/td&gt;*@
                      &lt;td&gt;
                          @Html.TextBoxFor(model =&gt; model.CartItems[i].Quantity, new { style = "width:50px; text-align:right"})
                      &lt;/td&gt;
                      &lt;td&gt;
                          &lt;a href="#" class="RemoveLink btn-success btn-sm" data-id="@item.OrderCodeID" &gt;
                              &lt;i class="fa fa-times"&gt;&amp;nbsp;Remove All&lt;/i&gt;&lt;/a&gt;&amp;nbsp;&amp;nbsp;
                          &lt;a href="#" class="RefreshQuantity btn-success btn-sm" data-id="@item.OrderCodeID" txt-id="CartItems_@(i)__count "&gt;
                              &lt;i class="fa fa-refresh"&gt;&amp;nbsp;Update&lt;/i&gt;
                          &lt;/a&gt;
                      &lt;/td&gt;
                      @*&lt;td&gt;
                          &lt;a href="#" class="RemoveLink btn-success btn-xs" data-id="@item.OrderCodeID"&gt;Update&lt;/a&gt;
                      &lt;/td&gt;*@
                  &lt;/tr&gt;   
                  i++;
              }
  </code></pre>
  
  <p>Please help, been at this for a couple hours.</p>