Блог

это долгий разговор. Мне очень жаль, если некоторые из этих вещей не имеют смысла, но у меня нет никаких знаний в области программирования. Я работаю над проектом, который нуждается в редизайне CSS. Проект-это веб-магазин, построенный с помощью .NET. Я сделал макет до просмотра файлов, поэтому добавил новые функции, для которых у меня нет кода. В веб-магазине был простой HTML-ввод количества товара, который уже имеет приращение и уменьшение, но в одном и том же поле. Моя идея состояла в том, чтобы сделать контейнер со значками плюс и минус по обе стороны счетчика количества, которые работают как кнопки добавления/удаления. Я включаю скриншот, указывающий именно на то, что я хотел. [1]: https://i.stack.imgur.com/9KS8e.png Поэтому я посмотрел учебник и придумал код JavaScript:

 var inputQty=document.getElementById('counter') var minus=document.getElementById('minus') var plus=document.getElementById('plus') var integer=1;  plus.addEventListener("click", function(){  integer =1;  inputQty.innerHTML=integer;  });    minus.addEventListener("click", function(){  if(integerlt;=1){  integer=1;  }  else{  integer-=1;  }  inputQty.innerHTML=integer;  });  

Он работает с простым html-документом, но я не знаю, как добавить его в этот проект. Следующий код-это документ ShoppingCart.cshtml.

 @model MiniShoppingCartModel @using SmartStore.Web.Models.ShoppingCart; @{  int attrMaxLength = Model.ShowProductImages ? 50 : 70; }  lt;div class="shopbar-flyout-inner cart-cnt"gt;   lt;div class="no-items muted @(Model.TotalProducts gt; 0 ? "hide" : "")"gt;  @T("ShoppingCart.Mini.NoItems")  lt;/divgt;   @if (Model.TotalProducts gt; 0)  {  lt;ul class="items unstyled"gt;  @for (int i = 0, length = Model.Items.Count; i lt; length; i  )  {  var item = Model.Items[i];  string itemClass = "item clearfix";  if (!Model.ShowProductImages)  {  itemClass  = " no-thumb";  }  if (i == 0)  {  itemClass  = " alpha";  }  if (i == length - 1 amp;amp; Model.IgnoredProductsCount == 0)  {  itemClass  = " omega";  }   lt;li class="@itemClass"gt;  @* @if (Model.ShowProductImages)  {  lt;figure class="picture pull-left"gt;  lt;a href="@Url.RouteUrl("Product", new { SeName = item.ProductSeName })" title="@item.Picture.Title"gt;  lt;img alt="@item.Picture.AlternateText" src="@item.Picture.ImageUrl" title="@item.Picture.Title" /gt;  lt;/agt;  lt;/figuregt;  } *@   lt;div class="name-and-price-row"gt;   lt;div class="name"gt;  lt;a href="@Url.RouteUrl("Product", new {SeName = item.ProductSeName})" title="@item.ProductName"gt;@item.ProductNamelt;/agt;  @if (item.AttributeInfo.HasValue())  {   lt;span class="attributes muted" title="@item.AttributeInfo"gt;  @Html.Raw(item.AttributeInfo.Truncate(attrMaxLength, "..."))  lt;/spangt;  }  lt;/divgt;  lt;div class="price-cart"gt;@item.UnitPricelt;/divgt;  lt;divgt;  lt;a class="delete-icon ajax-cart-link"  href="#"  rel="nofollow"  data-href='@Url.Action("DeleteCartItem", "ShoppingCart", new { cartItemId = item.Id })'  data-name="@item.ProductName"  data-type="cart"  data-action="remove"  title='@T("Common.Remove")'gt;  lt;i class="far fa-trash-alt"gt;lt;/igt;   lt;/agt;   lt;/divgt;   lt;/divgt;   lt;div class="quantity-row"gt;   lt;button class="minus"gt; lt;i id="minus" class="fas fa-minus"gt;lt;/igt;lt;/buttongt;  lt;div id="counter"gt; lt;/divgt;  lt;button class="plus"gt;lt;i class="fas fa-plus" id="plus"gt; lt;/igt;lt;/buttongt;  @*   lt;input type="number" value="@item.Quantity" pattern="[0-9]*" class="item-quantity"   name="updatecartitem-@item.Id" data-ajax-attribute-name="itemquantity@(item.Id)" data-   url="@Url.Action("Cart","ShoppingCart")" /gt;    *@  lt;/divgt;     @if (item.BundleItems.Count gt; 0)  {  lt;div class="mb-bundle-pictures"gt;  @for (int j = 0, bundlelength = item.BundleItems.Count; j lt; bundlelength; j  )  {  var bundleItem = item.BundleItems[j];   lt;a href="@Url.RouteUrl("Product", new { SeName = bundleItem.ProductSeName })" title="@bundleItem.ProductName"gt;  lt;img alt="@bundleItem.ProductName" src="@bundleItem.PictureUrl" title="@bundleItem.ProductName" /gt;  lt;/agt;   if (bundlelength != (j   1))  {  lt;i class="fa fa-plus"gt;lt;/igt;  }  }  lt;/divgt;  }   lt;/ligt;  }  @if (Model.IgnoredProductsCount gt; 0)  {  string resId = "ShoppingCart.Mini.More.{0}".FormatInvariant(Model.IgnoredProductsCount == 1 ? "Singular" : "Plural");  lt;li class="item more omega"gt;  lt;a class="name" href="@Url.RouteUrl("ShoppingCart")"gt;  @(T(resId).ToString().FormatInvariant(Model.IgnoredProductsCount))...  lt;/agt;  lt;/ligt;  }  lt;/ulgt;  lt;div class="total-cnt"gt;  lt;span class="label-zwischensumme"gt;@T("ShoppingCart.Totals.SubTotal")lt;/spangt;  lt;span class="price-cart"gt;@Model.SubTotallt;/spangt;   lt;/divgt;    lt;div class="buttons-cnt"gt;    @if (Model.DisplayShoppingCartButton)  {  lt;div class="to-basket"gt;  lt;a href="@Url.RouteUrl("ShoppingCart")"gt; @T("ShoppingCart.Mini.ViewCart")lt;/agt;  lt;/divgt;   }  @if (Model.DisplayCheckoutButton)  {  var checkoutUrl = "";  if (Model.AnonymousCheckoutAllowed amp;amp; Model.CurrentCustomerIsGuest)  {  checkoutUrl = Url.Action("Login", "Customer", new { checkoutAsGuest = true, returnUrl = Url.RouteUrl("ShoppingCart") });  }  else  {  checkoutUrl = Url.RouteUrl("Checkout");  }  lt;div class="to-pay"gt;  lt;a href="@checkoutUrl"gt;  @T("Checkout.Button")amp;nbsp;  lt;i class="fas fa-chevron-right"gt;lt;/igt;  lt;/agt;  lt;/divgt;    }  lt;/divgt;  }  @Html.Widget("mini_shopping_cart_bottom") lt;/divgt; lt;scriptgt;  $(function () {  applyCommonPlugins("#shopbar-flyout-cart");  }); lt;/scriptgt;   

Я предполагаю, что я должен добавить туда код JS, но когда я добавляю теги скриптов с моим кодом [введите описание изображения здесь][1]в конце страницы, это не работает.

Кроме того, когда я увеличиваю или уменьшаю количество продукта, он должен добавить его цену к общей цене, я думаю, что мне следует использовать какой-то код из старого ввода, но опять же, не уверен, что именно. Старые входные данные:

 lt;input type="number" value="@item.Quantity" pattern="[0-9]*" class="item-quantity"   name="updatecartitem-@item.Id" data-ajax-attribute-name="itemquantity@(item.Id)" data-   url="@Url.Action("Cart","ShoppingCart")" /gt;  

У программиста нет времени работать со мной, но клиенты ожидают получить именно то, что видно на макете.
Любая помощь или предложение будут с радостью оценены, спасибо.