Блог

Я хочу создать анонимную корзину покупок, новый пользователь заходит на сайт, добавляет товар в свою корзину покупок, создается файл cookie, в котором хранится идентификатор пользователя и общее количество товаров. Фактическая корзина хранится в базе данных. Добавление нового элемента вызывает метод на стороне сервера с использованием ajax.

мой вопрос в том, как реализовать метку на панели навигации, чтобы показывать количество товаров по мере изменения количества товаров. при добавлении товаров не выполняется обратная отправка или переход к обзору корзины.

Я думал о том, чтобы просто иметь ссылку и текст корзины покупок в качестве части, которая считывает общее количество из обновленного файла cookie и обновляет его, но я не уверен, можно ли обновить часть с другой страницы.

Как это делают другие люди? Просто обновить метку с помощью Javascript?

Вы можете легко использовать partialview. Возвращает partialview в качестве вывода при изменении корзины покупок. И создайте partialview в зависимости от вашего вкуса. Я ввожу код в качестве примера

html-код:

 <span id="framebasket">
     @Html.Partial("_Basket")
</span>
 

_Basket частичный:

  <div class="col-level1-14">
      <div class="row-new padding-r-25">
         <span class="color-black style-font-12-sb">@p.ProductName</span>
       </div>
       <div class="row-new padding-r-25">
          <span class="color-black style-font-12-sb">@p.ColorTitle</span>
       </div>
                   
       <div class="row-new padding-r-25">
           <span class="style-font-12-sb color-888">Count: </span>
           <span class="style-font-12-sb color-888">@item.Count</span>
           @if (p.ShowOfferPrice.Value)
            {
                 total = total   (p.OfferPrice * item.Count);
                <span class="float-l style-font-12-sb padding-t-5 color-888">@p.OfferPrice.ToPrice()</span>
            }
            else
            {
              total = total   (p.Price * item.Count);
              <span class="float-l style-font-12-sb padding-t-5 color-888">@p.Price.ToPrice()</span>
            }
      </div>
</div>
 

Требуется скрипт:

 <script>
$('.addtobasket').click(function () {
       showLoad();
       var basket = $(this).attr('basket');
       var inst = $('[data-remodal-id=modalbasket]').remodal();

       $.ajax({
         url: "/Basket/AddToBasket",
         data: { basket: basket },
         type: "Post",
         dataType: "Json",
         success: function (result) {
         $("#framebasket").html(result.HtmlBody);
         //this for aler The information was logged into the system to reassure the user
         inst.open();
         closeshowLoad();
        },
        error: function () {
         closeshowLoad();
       }
     });
   });
</script>
 

пример контроллера :

 [HttpPost]
public ActionResult AddToBasket(string basket)
{
    basket operation ...
    return Json(new JsonData()
    {
       HtmlMsg = "",
       HtmlBody = this.RenderPartialToString("_Basket", lst),
       Success = true,
    });
}
 

Это было просто общее объяснение.