✅ Привязка данных в ASP.NET - Шаги для создания привязки данных в ASP.NET

Введение в привязку данных в ASP.Net

Введение в привязку данных в ASP.Net

Аналогичным образом ASP.Net также поддерживает концепцию привязки данных. С помощью привязки данных вы можете привязать любой серверный элемент управления к различным свойствам, выражениям, коллекциям или даже методам. Существует также гибкость выбора источника данных, который может быть базой данных, статическим файлом, перечислением или любым другим источником. Таким образом, ASP.Net Data Binding предоставляет простой и удобный способ создания связи между серверным элементом управления и данными приложения.

Концепции привязки данных в ASP.Net

Базовая концепция связывания данных в ASP.Net может быть очень хорошо проиллюстрирована на следующем рисунке.

Давайте разберемся в терминологии, используемой в изображении.

Binding Source - переменная данных приложения, которая содержит бизнес-данные.
Binding Target - серверный элемент управления или элемент пользовательского интерфейса, к которому привязаны данные.
Объект зависимости - объект, связанный с целью привязки.
Свойство зависимости - свойство или атрибут объекта зависимости, с которым связаны данные.
Исходный объект - объект, который содержит бизнес-данные.
Исходное свойство - свойство или атрибут исходного объекта, значение которого является фактическими данными.

Итак, если вы хотите связать свойство text элемента управления вводом в пользовательском интерфейсе с именем сотрудника, то TextBox является объектом Target / Dependency Object. Текст является целевым свойством. Сотрудник является бизнес-объектом, а имя является собственностью.

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

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

При односторонней привязке к источнику любые изменения в данных элемента пользовательского интерфейса обновляются в бизнес-объекте, но не наоборот. Это полезно в сценариях, когда данные рассчитываются на основе данных других пользователей и требуют частой переоценки.

Что такое привязка данных?

Прежде чем мы продолжим, давайте сначала поймем концепцию привязки данных в целом. Привязка данных - это процесс соединения пользовательского интерфейса приложения с бизнес-данными. Теперь вы можете задаться вопросом, что это то же самое, что отображать бизнес-данные в пользовательском интерфейсе. Нет это не так. Что делать, если данные изменены? Обновляется ли он автоматически в пользовательском интерфейсе?
Таким образом, когда привязка данных выполнена правильно, элементы пользовательского интерфейса автоматически отражают изменения в бизнес-данных. Представьте, что ваши элементы пользовательского интерфейса постоянно следят за назначенной им переменной / набором данных. Как только в данных происходят какие-либо изменения, элементы пользовательского интерфейса должны соответствующим образом отразить это изменение.
Прекрасный пример этого феномена - калькулятор в наших смартфонах. Они предназначены для получения результата, как только пользователь введет любое значение. Обратите внимание на скриншот ниже, как результаты производятся и отображаются в режиме реального времени. Без необходимости давать команду «равных».

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

Как создать привязку данных в ASP.Net?

Ниже приведен простой пример демонстрации привязки данных в ASP.Net. Мы создали бы простое приложение WPF с тремя элементами управления (текстовый блок, ползунок и индикатор выполнения) в пользовательском интерфейсе. Значение двух элементов управления будет привязано к данным в третьем элементе управления.

Шаг 1: Откройте Visual Studio и создайте новый проект.

Шаг 2. Выберите приложение WPF (.Net Framework) в окне мастера создания нового проекта.

Шаг 3: Настройте основные детали и нажмите « Создать» .

Шаг 4: Это создает приложение Shell WPF . Теперь вставьте TextBlock, Slider и элемент управления ProgressBar в пользовательский интерфейс. Мы свяжем значение TextBlock и ProgressBar со значением элемента управления Slider.

Шаг 5: Теперь добавьте код, подчеркнутый на рисунке, чтобы связать свойство Text TextBlock.

Text="(Binding Value, ElementName=slider)"

Аналогично, для свойства Value объекта ProgressBar.

Value="(Binding Value, ElementName=slider)"

Это связывает свойства со свойством Value ползунка.

Шаг 6: Запустите приложение. Вы увидите, что ползунок теперь обновляет значения текстового блока и индикатора выполнения. Переместите ползунок, чтобы увидеть это в действии.

Давайте разберемся в терминологии, использованной в примере.

Binding Source - элемент управления Slider в пользовательском интерфейсе.
Binding Target - TextBlock и ProgressBar
Dependency Object - объекты TextBlock и ProgressBar созданы.
Свойство зависимости - свойство Text объекта TextBlock и свойство Value объекта ProgressBar.
Исходный объект - объект Slider, созданный с помощью x: Name = ”slider”.
Свойство Source - свойство Value ползунка.

Шаг 7: F- код должен быть таким, как показано ниже:

xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation" xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml" xmlns:d="http://schemas.microsoft.com/expression/blend/2008" xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006" xmlns:local="clr-namespace:DataBindingInASP.Net" mc:Ignorable="d" Title="MainWindow"> Text="(Binding Value, ElementName=slider)" /> Width="250"/> Value="(Binding Value, ElementName=slider)"/> xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation" xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml" xmlns:d="http://schemas.microsoft.com/expression/blend/2008" xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006" xmlns:local="clr-namespace:DataBindingInASP.Net" mc:Ignorable="d" Title="MainWindow"> Text="(Binding Value, ElementName=slider)" /> Width="250"/> Value="(Binding Value, ElementName=slider)"/> xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation" xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml" xmlns:d="http://schemas.microsoft.com/expression/blend/2008" xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006" xmlns:local="clr-namespace:DataBindingInASP.Net" mc:Ignorable="d" Title="MainWindow"> Text="(Binding Value, ElementName=slider)" /> Width="250"/> Value="(Binding Value, ElementName=slider)"/> xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation" xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml" xmlns:d="http://schemas.microsoft.com/expression/blend/2008" xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006" xmlns:local="clr-namespace:DataBindingInASP.Net" mc:Ignorable="d" Title="MainWindow"> Text="(Binding Value, ElementName=slider)" /> Width="250"/> Value="(Binding Value, ElementName=slider)"/>

Вывод

Мы изучили основную концепцию привязки данных и то, как она реализована в ASP.Net. Это очень простой пример привязки данных в ASP.Net, и тема выходит далеко за рамки этого. Настоятельно рекомендуется больше исследовать, писать больше кода, больше экспериментировать с различными источниками данных. Это очень помогло бы получить полное понимание и контроль над предметом.

Привязка данных в ASP.NET - Шаги для создания привязки данных в ASP.NET