عرض قائمة العناصر مع العدد في ASP.NET

بالتأكيد، يمكنك عرض قائمة من عناصر ViewBag وعرض عددها بجانب كل عنصر في HTML. هناك عدة طرق لتحقيق ذلك، ولكن لنقم بشرح طريقة باستخدام الـ Razor syntax في ASP.NET.

في البداية، يجب أن تتأكد من أن لديك قائمة من العناصر في ViewBag بالشكل التالي:

csharpCopy code
ViewBag.country_list = new List
{
    new CountryViewModel { Name = "United Arab Emirates", Count = 8 },
    new CountryViewModel { Name = "Angola", Count = 4 },
    new CountryViewModel { Name = "Argentina", Count = 7 },
    new CountryViewModel { Name = "Austria", Count = 0 },
    new CountryViewModel { Name = "Belgium", Count = 11 }
};

ثم يمكنك عرض هذه القائمة في HTML باستخدام الـ Razor syntax بالشكل التالي:

htmlCopy code
@foreach (var country in ViewBag.country_list)
{
    <div>
        @country.Name (@country.Count)
    div>
}

وبهذا، سيتم عرض كل عنصر من القائمة مع عدده بجانبه في الشكل المطلوب.

وإذا كان لديك تفاصيل إضافية حول الشكل الذي ترغب في عرض البيانات فيه، يمكنك تعديل الـ HTML لتلبية احتياجاتك بشكل أفضل. على سبيل المثال، يمكنك استخدام عناصر القائمة ul و li بدلاً من div كما في المثال التالي:

htmlCopy code
<ul>
    @foreach (var country in ViewBag.country_list)
    {
        <li>@country.Name (@country.Count)li>
    }
ul>

هذا سيعرض العناصر في قائمة مرتبة بشكل أفضل. وبهذا، يمكنك عرض القائمة مع عدد العناصر بجانب كل عنصر كما ترغب.

بالطبع، يمكننا تطوير المقال ليشمل شرحًا أعمق للكود وبعض الإرشادات الإضافية. دعني أكمل المقال لك:

عند العمل في تطبيق ASP.NET، قد تحتاج في بعض الأحيان إلى عرض قائمة من العناصر مع عددها بجانب كل عنصر. وفي هذا المقال، سنرى كيفية تحقيق هذا باستخدام تقنية ViewBag وRazor syntax في ASP.NET.

في البداية، يجب عليك التأكد من أن لديك قائمة من العناصر المطلوب عرضها مع العدد المقابل لكل عنصر. يمكن تخزين هذه القائمة في ViewBag، كما هو موضح في الشيفرة التالية:

csharpCopy code
ViewBag.country_list = new List
{
    new CountryViewModel { Name = "United Arab Emirates", Count = 8 },
    new CountryViewModel { Name = "Angola", Count = 4 },
    new CountryViewModel { Name = "Argentina", Count = 7 },
    new CountryViewModel { Name = "Austria", Count = 0 },
    new CountryViewModel { Name = "Belgium", Count = 11 }
};

حيث يتم استخدام CountryViewModel لتمثيل كل عنصر في القائمة، وهو يتضمن خصائص Name وCount لاسم البلد وعدد العناصر على التوالي.

بعد ذلك، يمكن عرض هذه القائمة في HTML باستخدام الـ Razor syntax بسهولة. يمكن استخدام بنية التكرار foreach للتعامل مع كل عنصر في القائمة وعرضه في الشكل المطلوب، كما يلي:

htmlCopy code
<ul>
    @foreach (var country in ViewBag.country_list)
    {
        <li>@country.Name (@country.Count)li>
    }
ul>

وبهذا، سيتم عرض كل عنصر من القائمة مع عدد العناصر بجانبه في شكل القائمة المرغوب.

لاحظ أنه يمكن تخصيص الـ HTML بحسب الحاجة، فمثلاً يمكن استخدام div بدلاً من ul و li، أو تطبيق أي تنسيق آخر يناسب تصميمك.

وبهذا نكون قد استكملنا توضيح كيفية عرض قائمة من العناصر مع عددها بجانب كل عنصر في تطبيق ASP.NET باستخدام ViewBag وRazor syntax.