Diskuze: Změna PartialView bez aktualizace celé stránky

V předchozím kvízu, Test znalostí C# .NET online, jsme si ověřili nabyté zkušenosti z kurzu.

Aktivity

Michal Pflegshörl

Člen

Michal Pflegshörl:9.3.2021 10:38

Ve formuláři mám PartialView a potřebuji po stisku tlačítka místo něj zobrazit jiný PartialView aniž by se mi obnovila celá stránka

Views/Test/Index.cshtml

@model  Test.Models.dataSeznamUcastniku

<form method="post" autocomplete="off" onkeydown="return ((event.key != 'Enter' && event.target.tagName != 'TEXTAREA') || event.target.tagName == 'TEXTAREA');">
    <label class="Popisek" style="margin-left:10px;" asp-for="Agenda"></label>
    <br />
    <input id="agenda" name="agenda" class="TextovePole" style="text-align: left; width: 75%;" asp-for="Agenda">
    <div id="ucastnici">
        @await Html.PartialAsync("Ucastnici/SeznamUcastniku", Model)
    </div>
</form>

Views/Shared/Ucastnici/SeznamUcastniku.cshtml

@model Test.Models.dataSeznamUcastniku

@{
    foreach (dataUcastnik DataUcastnik in Model.SeznamUcastniku)
    {
        <button class="TlacitkoUcastnika" onclick="ZobrazUcastnika('@DataUcastnik.Ucastnik', '@DataUcastnik.Agenda.ToString()');">@DataUcastnik.Ucastnik</button>
        <br />
    }
}

<script>
    function ZobrazUcastnika(Ucastnik, Agenda) {
        $("#ucastnici").load("/Ucastnici/ZobrazUcastnika", { ucastnik: Ucastnik, agenda: Agenda });
    }
</script>

Views/Shared/Ucastnici/Ucastnik.cshtml

@model Test.Models.dataUcastnik

@{
    <span>@Model.Ucastnik</span>
}

Controllers/TestController.cs

using Microsoft.AspNetCore.Mvc;
using System;
using System.Collections.Generic;
using System.Linq;
using System.Threading.Tasks;
using Test.Models;

namespace Test.Controllers
{
    public class TestController : Controller
    {
        public IActionResult Index()
        {
            ViewData["Title"] = "Test";
            dataSeznamUcastniku DataSeznamUcastniku = new dataSeznamUcastniku("Testík");

            return View(DataSeznamUcastniku);
        }
    }
}

Controllers/UcastniciController.cs

using Test.Models;
using Microsoft.AspNetCore.Mvc;
using System;
using System.Collections.Generic;
using System.Linq;
using System.Threading.Tasks;

namespace eNOTSERVIS_Web.Controllers
{
    public class UcastniciController : Controller
    {
        [HttpPost]
        public IActionResult ZobrazUcastnika(string ucastnik, string agenda, string idSpisu)
        {
            dataUcastnik DataUcastnik = new dataUcastnik(ucastnik, agenda);

            return PartialView("Ucastnici/Ucastnik", DataUcastnik);
        }
    }
}

Models/Ucastnici.cs

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

namespace Test.Models
{
    public static class Ucastnici
    {
        public static List<string> SeznamUcastniku(string agenda)
        {
            List<string> Vysledek = new List<string>();

            Vysledek.Add("Účastník 1");
            Vysledek.Add("Účastník 2");
            Vysledek.Add("Účastník 3");

            return Vysledek;
        }
    }

    public class dataUcastnik
    {
        public string Ucastnik { get; set; }
        public string Agenda { get; set; }

        private void NastavVychoziHodnoty()
        {
            Ucastnik = "";
            Agenda = "";
        }

        public dataUcastnik(string ucastnik, string agenda)
        {
            NastavVychoziHodnoty();

            Ucastnik = ucastnik;
            Agenda = agenda;
        }
    }

    public class dataSeznamUcastniku
    {
        public List<dataUcastnik> SeznamUcastniku { get; set; }
        public string Agenda { get; set; }
        public string IdSpisu { get; set; }

        private void NastavVychoziHodnoty()
        {
            SeznamUcastniku = new List<dataUcastnik>();
            Agenda = "";
            IdSpisu = "";
        }

        public dataSeznamUcastniku(string agenda)
        {
            NastavVychoziHodnoty();

            List<string> NacteniUcastnici = Ucastnici.SeznamUcastniku(agenda);
            if (NacteniUcastnici != null)
            {
                foreach (string NactenyUcastnik in NacteniUcastnici)
                {
                    SeznamUcastniku.Add(new dataUcastnik(NactenyUcastnik, agenda));
                }
            }

            Agenda = agenda;
        }
    }
}

Zkusil jsem: Pokud je <div id="ucastnici"> mimo formulář funguje to tak jak má.
Já ho bohužel potřebuju mít ve formuláři a tam se po načtení nového PartialView automaticky obnoví celá stránka (načtou se výchozí hodnoty polí formuláře a nastaví se zpět výchozí PartialView)

Chci docílit: Potřebuji ve formuláři zobrazit seznam účastníků a po kliknutí na konkretního účastníka zobrazit místo seznamu údaje o účastníkovi, aniž by se obnovila celá stránka

Odpovědět

9.3.2021 10:38

Naučíme tě pracovat na home-office.

Zjistit více...

Děláme co je v našich silách, aby byly zdejší diskuze co nejkvalitnější. Proto do nich také mohou přispívat pouze registrovaní členové. Pro zapojení do diskuze se přihlas. Pokud ještě nemáš účet, zaregistruj se, je to zdarma.

Zobrazeno 1 zpráv z 1.