Jamie888 Ответов: 1

Перезагрузите только div в HTML-странице при обновлении

Привет, у меня есть html-страница в частичном просмотре с помощью razor .NET. В настоящее время я делаю полное частичное обновление страницы просмотра каждые 5 минут, и это работает нормально. Я планирую улучшить его, перезагрузив только div внутри html-страницы без обновления всего html/частичного представления.
Есть ли какая-нибудь статья или ссылка, на которую я могу сослаться? Я знаю, что JavaScript имеет функцию. load (), но это не то, что я хочу(или я что-то упустил?)

Что я уже пробовал:

Искал в Интернете решение, но ни одно из них действительно не соответствовало моему требованию.

Suvendu Shekhar Giri

проверять Документация по API Ajax | jQuery[^]

Jamie888

Сэр, я заглянул в ссылку, и самая близкая из них-это .load(). Я снова проверил онлайн на наличие .load (), и в одном я не уверен: может ли .load () принять функцию внутри JavaScript и принять ее в качестве параметра? Например:
У меня есть функция MyFunction (). Могу ли я написать так:
$ ("#myDiv"). load ("MyFunction () #myDiv"); ?

Поскольку MyFunction() будет возвращать много данных из базы данных, возможно ли это сделать?

1 Ответов

Рейтинг:
0

F-ES Sitecore

общий вид

<script type="text/javascript">
    $(document).ready(function () {
        window.setInterval(updatePartial, 1000);
    });

    function updatePartial() {
        // the second param is an empty object {}, this is where you would pass
        // your param data, but if you leave the param off a GET is used and due
        // to chaching you won't see the page change, so I passed an empty object
        // to force a POST
        $("#p").load('@Url.Action("ShowPartial", "Home")', {});
    }
</script>
    <div id="m">Main view: @DateTime.Now</div>
    <div id="p">@Html.Partial("_myPartialView")</div>

</body>
</html>


частичное представление

Partial view: @DateTime.Now


контроллер

public ActionResult ShowPartial()
{
    return PartialView("_myPartialView");
}


Вот пример передачи данных в частичное представление

<script type="text/javascript">
    $(document).ready(function () {
        window.setInterval(updatePartial, 1000);
    });

    function updatePartial() {
        $("#p").load('@Url.Action("ShowPartial", "Home")', {"ID":$("#dataID").val(), "Name":$("#dataName").val()});
    }
</script>
<div>
    ID <input type="number" id="dataID" value="1" /> Name <input type="text" id="dataName" value="John" />
</div>
<div id="m">Main view: @DateTime.Now</div>
<div id="p">@Html.Partial("_myPartialView", new TestModel{ID=1, Name="John"})</div>


Частичное представление

@model YourNamespace.Models.TestModel
Partial view: @DateTime.Now, model data: @Model.ID @Model.Name


Контроллер

public ActionResult ShowPartial(TestModel model)
{
    return PartialView("_myPartialView", model);
}


Модель

public class TestModel
{
    public int ID { get; set; }
    public string Name { get; set; }
}

Karthik_Mahalingam

5!

Jamie888

Сэр, у меня есть несколько вещей, которые я здесь не понимаю, и я искал в интернете некоторые объяснения. Пожалуйста, поправьте меня, если я ошибаюсь, могу ли я предположить, что ShowPartial-это имя функции в моем контроллере, а Home-это имя моего файла контроллера?
Кроме того, будет ли пустой объект {} автоматически распознавать мои ранее использованные параметры и использовать его каждый раз при обновлении? Поскольку все вышеперечисленные коды будут использоваться для освежающих целей. Спасибо.

F-ES Sitecore

Да, " дом " - это имя контроллера. Если вы хотите передать данные в представление, вам нужно будет передать их через этот второй параметр load. Как это делается, зависит от того, что это за данные, откуда они берутся и т. д., Но я обновлю решение, включив в него также пример передачи данных.

Jamie888

Сэр, если у меня есть несколько ящиков с их собственным уникальным идентификатором, как я должен правильно разместить данные для каждого из них? Должен ли я использовать цикл for?

F-ES Sitecore

Это зависит от точной разметки. Вы можете просто ссылаться на каждый идентификатор явно, или если вы можете посмотреть, то вы можете, или вы можете прикрепить атрибут "данные" ко всем входным данным, которые вы хотите обработать, и использовать селектор jquery для таргетинга всех входных данных с этим атрибутом данных. На самом деле все зависит от вашей конкретной ситуации.

Jamie888

Сэр, для @Html. Partial ("_myPartialView", new TestModel{ID=1, Name= " John"}),
является ли идентификатор, а также имя выводом из вызова функции? Если да, то могу ли я поместить идентификатор и имя динамически, как ID = model.ID?

F-ES Sitecore

Это просто жестко закодированные значения, которые я использовал для удобства, если бы у вас были эти данные в модели, вы бы сделали что-то более похожее

@Html. Partial ("_myPartialView", new TestModel{ID=Model.ID, имя=модель.Имя})

Jamie888

Спасибо. Другой вопрос, например, у меня есть 2 div(myDiv1 и myDiv2), где "1" и "2" - это уникальный идентификатор, который я присвоил каждому из myDiv, чтобы дифференцировать их. Контроллер, конечно, вернет 2 данных, один для myDiv1 и один для myDiv2(оба они исходят из одного и того же поля в базе данных, например FirstName). Нужно ли мне помещать вышеуказанные коды @Html. Partial.... внутри цикла foreach на моей html-странице?

F-ES Sitecore

Вероятно, вам придется обращаться с каждым div индивидуально. Таким образом, у вас будет два частичных представления

&ЛТ;див ИД=див1&ГТ;@HTML-код.Частичное( .. )&ЛТ;/дел&ГТ;
&ЛТ;див ИД=2 дивизионе&ГТ;@HTML-код.Частичное( .. )&ЛТ;/дел&ГТ;

Тогда ваш js выдаст a .нагрузки для div1 передачи данных для див1, то вообще .загрузка для div2 передача данных для div2. Таким образом, вы будете обрабатывать каждый div по очереди, а не делать все это за один вызов.

Jamie888

Сэр, у меня есть только одно частичное представление в моем html(например, myPartialView) в основном html. Затем, используя javascript, я верну все данные из контроллера с помощью кода:
$("#myPartialView"). html(данные);
Хитрая часть заключается в том, что внутри частичного представления html я буду циклировать модель.Data1. Dtolist использует цикл foreach для построения всех данных в соответствующие div (myDiv1 и myDiv2 в нашем случае здесь). Поэтому во время отображения на экране мой myPartialView будет иметь 2 отдельных поля(например, FirstName -> John and Sarah).
MyDiv1 и myDiv2 исходят из одного и того же тега div. Только с 1 и 2 являются уникальным идентификатором, который я использую, чтобы разделить оба типа:
< div id= "myDiv" + 1></div>а также < div id="myDiv" + 2></div>.

F-ES Sitecore

В этом случае partialview выполнит весь цикл и создаст div1, div2 и т. д. Вам все еще нужно что-то, чтобы загрузить частичное представление, так что вам, вероятно, все равно придется обернуть свое частичное представление в div

<div id=mypartial>
@HTML-код.Частично...
< / div>

Код в частичном представлении создаст divs, так что в конечном итоге вы получите html, например

<div id=mypartial>
&ЛТ;див ИД=див1 и GT;...&ЛТ;/дел&ГТ;
&ЛТ;див ИД=2 дивизионе и GT;...&ЛТ;/дел&ГТ;
< / div>

Таким образом, вы сделаете ".load" на "mypartial" div, и это воссоздаст внутренние divs.

Jamie888

Сэр, я попробовал ваше предложение выше, но я получаю ошибку о том, что " System.Web.Webpages.... не содержит определения для Partial....". я проверил свой web. config, но обнаружил, что не пропустил ни одного пространства имен, как это предлагает Интернет-решение, например:
добавить пространство имен="System.Web.Mvc.Html"

Мог ли я пропустить другое пространство имен или конфигурацию?

Jamie888

Как я могу сказать, что myDiv1-это Джон, а myDiv2-Сара?