Fontawesome не распознает элементы - PullRequest
0 голосов
/ 25 октября 2019

Я создаю приложение ASP.NET CORE MVC 2.2, и одна интересная часть заключается в том, что, когда я создаю fontawesome, не распознает никаких действий (Edit, Details, Delete), я попытаюсь объяснить, что я имею в виду. У меня есть модель с ID и NAME и действием контроллера

Модель

using System;
using System.Collections.Generic;
using System.ComponentModel.DataAnnotations;
using System.Linq;
using System.Threading.Tasks;

namespace Svecanosti.Models
{
    public class CategoryEvent
    {
        public int Id { get; set; }

        [Required]
        public string  Name { get; set; }
    }
}

Контроллер

using System.Linq;
using System.Threading.Tasks;
using Microsoft.AspNetCore.Mvc;
using Svecanosti.Data;
using Svecanosti.Models;

namespace Svecanosti.Controllers
{
    [Area("Admin")]
    public class CategoryEventController : Controller
    {
        public readonly ApplicationDbContext _db;

        public CategoryEventController(ApplicationDbContext db)
        {
            _db = db;
        }

        public IActionResult Index()
        {
            return View(_db.CategoryEvents.ToList());
        }


        public IActionResult Create()
        {
            return View();
        }

        [HttpPost]
        [ValidateAntiForgeryToken]
        public async Task<IActionResult> Create(CategoryEvent categoryEvent)
        {
            if (ModelState.IsValid)
            {
                _db.Add(categoryEvent);
                await _db.SaveChangesAsync();
                return RedirectToAction(nameof(Index));
            }
            return View(categoryEvent);
        }


        //GET Edit Action method
        public async Task<IActionResult> Edit(int? id)
        {
            if (id == null)
            {
                return NotFound();
            }
            var categoryEvent = await _db.CategoryEvents.FindAsync(id);
            if (categoryEvent == null)
            {
                return NotFound();
            }
            return View(categoryEvent);
        }

        //POST Edit Action Method
        [HttpPost]
        [ValidateAntiForgeryToken]
        public async Task<IActionResult> Edit(int id, CategoryEvent categoryEvent)
        {
            if (id != categoryEvent.Id)
            {
                return NotFound();
            }

            if (ModelState.IsValid)
            {
                _db.Update(categoryEvent);
                await _db.SaveChangesAsync();
                return RedirectToAction(nameof(Index));
            }
            return View(categoryEvent);
        }

        //GET Details Action method
        public async Task<IActionResult> Details(int? id)
        {
            if (id == null)
            {
                return NotFound();
            }
            var categoryEvent = await _db.CategoryEvents.FindAsync(id);
            if (categoryEvent == null)
            {
                return NotFound();
            }
            return View(categoryEvent);
        }
    }
}

В моем индексном представлении я добавил частичный вид для кнопки (рисунок ниже)

@model int
@*
    For more information on enabling MVC for empty projects, visit http://go.microsoft.com/fwlink/?LinkID=397860
*@

<td style="width:150px">
    <div class="btn-group" role="group">
        <a type="button" class="btn btn-primary" href="@Url.Action("Edit/"+Model)">
            <i class="fas fa-edit"></i>
        </a>
        <a type="button" class="btn btn-success" href="@Url.Action("Details/"+Model)">
            <i class="far fa-list-alt"></i>
        </a>
        <a type="button" class="btn btn-danger" href="@Url.Action("Delete/"+Model)">
            <i class="fas fa-trash-alt"></i>
        </a>
    </div>
</td>

enter image description here

В моем Index.cshtml Я называю это Patial View, и когда я нажимаю для редактирования событий, ничего не происходит. Я пытаюсь отладить, и когда я ставлю точку останова в свой результат редактирования действия, компилятор не входит в функцию. Когда я проверяю консоль, я вижу это сообщение

[Deprecation] '-webkit-appearance: button' for a is deprecated and will be removed in M79, around December 2019. See https://www.chromestatus.com/features/5070237827334144 for more details.

Я включаю в свой Layout.cshtml fontawesome

<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
    <title>@ViewData["Title"] - Svecanosti.com</title>

    <environment include="Development">
        <link rel="stylesheet" href="~/lib/bootstrap/dist/css/bootstrap.css" />
        <link rel="stylesheet" href="~/css/site.css" />
        <link href="~/fontawesome/css/all.css" rel="stylesheet" />
        <link href="~/fontawesome/css/brands.css" rel="stylesheet" />
        <link href="~/fontawesome/css/fontawesome.css" rel="stylesheet" />
        <link href="~/fontawesome/css/regular.css" rel="stylesheet" />
        <link href="~/fontawesome/css/solid.css" rel="stylesheet" />
        <link href="~/fontawesome/css/svg-with-js.css" rel="stylesheet" />
        <link href="~/fontawesome/css/v4-shims.css" rel="stylesheet" />
    </environment>
    <environment exclude="Development">
        <link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/4.3.1/css/bootstrap.min.css"
              asp-fallback-href="~/lib/bootstrap/dist/css/bootstrap.min.css"
              asp-fallback-test-class="sr-only" asp-fallback-test-property="position" asp-fallback-test-value="absolute"
              crossorigin="anonymous"
              integrity="sha384-ggOyR0iXCbMQv3Xipma34MD+dH/1fQ784/j6cY/iJTQUOhcWr7x9JvoRxT2MZw1T" />
        <link rel="stylesheet" href="~/lib/bootstrap/dist/css/bootstrap.css" />
    </environment>
    <link rel="stylesheet" href="~/css/site.css" />
</head>
<body>
    <header>
        <nav class="navbar navbar-expand-md navbar-dark bg-dark fixed-top">
            <a class="navbar-brand" href="#">Svecanosti.com</a>
            <div class="collapse navbar-collapse">
                <ul class="navbar-nav mr-auto">
                    <li class="nav-item"><a class="nav-link" asp-area="Admin" asp-controller="CategoryEvent" asp-action="Index">Event Category</a></li>
                </ul>

            </div>
            <div>
                <partial name="_LoginPartial" />
            </div>
        </nav>
    </header>
    <div class="container">
        <partial name="_CookieConsentPartial" />
        <main role="main" class="pb-3">
            @RenderBody()
        </main>
    </div>

    <footer class="border-top footer text-muted">
        <div class="container">
            &copy; 2019 - Svecanosti.com - <a asp-area="" asp-controller="Home" asp-action="Privacy">Privacy</a>
        </div>
    </footer>

    <environment include="Development">
        <script src="~/lib/jquery/dist/jquery.js"></script>
        <script src="~/lib/bootstrap/dist/js/bootstrap.bundle.js"></script>
    </environment>
    <environment exclude="Development">
        <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"
                asp-fallback-src="~/lib/jquery/dist/jquery.min.js"
                asp-fallback-test="window.jQuery"
                crossorigin="anonymous"
                integrity="sha256-FgpCb/KJQlLNfOu91ta32o/NMZxltwRo8QtmkMRdAu8=">
        </script>
        <script src="https://stackpath.bootstrapcdn.com/bootstrap/4.3.1/js/bootstrap.bundle.min.js"
                asp-fallback-src="~/lib/bootstrap/dist/js/bootstrap.bundle.min.js"
                asp-fallback-test="window.jQuery && window.jQuery.fn && window.jQuery.fn.modal"
                crossorigin="anonymous"
                integrity="sha384-xrRywqdh3PHs8keKZN+8zzc5TX0GRTLCcmivcbNJWm2rs5C8PRhcEn3czEjhAO9o">
        </script>
    </environment>
    <script src="~/js/site.js" asp-append-version="true"></script>

    @RenderSection("Scripts", required: false)
</body>
</html>

Когда я создаю вид на следующем шаге, все работает идеально

enter image description here

У кого-нибудь сейчас есть проблема? У меня никогда раньше не было такой ситуации, и я полагаю, что проблема возникла из-за моего частичного взгляда и удивительной, но не уверен на 100%.

1 Ответ

1 голос
/ 25 октября 2019

Вы можете использовать F12 в своем браузере, чтобы проверить, правильно ли он генерирует href для вашего <a> тега.

Кажется, вы не используете @Url.Action() правильно, измените частичное представлениедо:

@model int

<td style="width:150px">
    <div class="btn-group" role="group">
        <a type="button" class="btn btn-primary" href="@Url.Action("Edit",new { id = Model })">
            <i class="fas fa-edit"></i>
        </a>
        <a type="button" class="btn btn-success" href="@Url.Action("Details",new { id = Model })">
            <i class="far fa-list-alt"></i>
        </a>
        <a type="button" class="btn btn-danger" href="@Url.Action("Delete",new { id = Model})">
            <i class="fas fa-trash-alt"></i>
        </a>
    </div>
</td>
...