asp.net mvc читання ViewBag загальний список за допомогою javascript

Я працюю з asp.net mvc4, як я можу читати дані з ViewBag, мій ViewBag є загальний список, я хотів би отримати доступ до даних (viewbag) з javascript.

Я передаю загальний список від контролера до перегляду, цей список допомагає мені завантажувати dropdownlist тут працює добре. Крім завантаження dropdownlist мені потрібно отримати доступ до деяких загальних даних списку, так що коли значення dropdownlist оновить текстове поле з даними зі списку

0
показати деякий код, будь ласка
додано Автор Shyju, джерело
показати деякий код, будь ласка
додано Автор Shyju, джерело
@raranibar Не могли б Ви дати будь-який відгук про мою відповідь, будь ласка? Я думаю, що це те, що ви шукали. Якщо це не так, залиште коментар, і я працюватиму над ним
додано Автор Andre Calil, джерело
@raranibar Не могли б Ви дати будь-який відгук про мою відповідь, будь ласка? Я думаю, що це те, що ви шукали. Якщо це не так, залиште коментар, і я працюватиму над ним
додано Автор Andre Calil, джерело
привіт Shyju, я намагаюся зробити це, коли значення DropDownList значення зміни загальний список копіюється в текстове поле
додано Автор raranibar, джерело
Shyju, це мій код var myList = '@ Html.Raw (ViewBag.Coberturas як Список )'; сповіщення (myList.cdo_descripcion); повідомлення від сповіщення "значення не визначено"
додано Автор raranibar, джерело

8 Відповіді

Технічно ви ViewBag - це словник, який може містити загальний список. Він доступний лише тоді, коли ваша сторінка спочатку відтворюється. Таким чином, ви не маєте доступу до нього безпосередньо з JavaScript. Але те, що ви можете зробити, це отримати список з вашого ViewBag, серіалізувати його як JSON в Razor і deserialize його в JavaScript.

public ActionResult Index(){
    //make this whatever list you want
    ViewBag.MyList = new ArrayList();
}

Це встановлює ключ у словнику ViewBag, що дорівнює списку за вашим вибором. Тепер нам потрібно його серіалізувати, щоб отримати доступ до нього у JavaScript.

var jsonList = '@Html.Raw(Json.Convert(ViewBag.MyList))'
var jsList = JSON.parse(jsonList);

Це велика робота, щоб просто отримати список, не кажучи вже про те, що роблять залежності в View for Newtonsoft.Json або будь-якому серіалізаторі, який ви використовуєте, а також, якщо пам'ять служить, це не дуже ефективно. Чому б не зробити запит, щоб отримати потрібні дані з API-контролера, який подбає про серіалізацію для вас, що призведе до більш швидкого початкового завантаження сторінки?

Редагувати: Я думаю, що ви шукаєте це . Вам не потрібно використовувати JavaScript для досягнення того, чого ви просите. Використовуйте потужність MVC.

3
додано

Технічно ви ViewBag - це словник, який може містити загальний список. Він доступний лише тоді, коли ваша сторінка спочатку відтворюється. Таким чином, ви не маєте доступу до нього безпосередньо з JavaScript. Але те, що ви можете зробити, це отримати список з вашого ViewBag, серіалізувати його як JSON в Razor і deserialize його в JavaScript.

public ActionResult Index(){
    //make this whatever list you want
    ViewBag.MyList = new ArrayList();
}

Це встановлює ключ у словнику ViewBag, що дорівнює списку за вашим вибором. Тепер нам потрібно його серіалізувати, щоб отримати доступ до нього у JavaScript.

var jsonList = '@Html.Raw(Json.Convert(ViewBag.MyList))'
var jsList = JSON.parse(jsonList);

Це велика робота, щоб просто отримати список, не кажучи вже про те, що роблять залежності в View for Newtonsoft.Json або будь-якому серіалізаторі, який ви використовуєте, а також, якщо пам'ять служить, це не дуже ефективно. Чому б не зробити запит, щоб отримати потрібні дані з API-контролера, який подбає про серіалізацію для вас, що призведе до більш швидкого початкового завантаження сторінки?

Редагувати: Я думаю, що ви шукаєте це . Вам не потрібно використовувати JavaScript для досягнення того, чого ви просите. Використовуйте потужність MVC.

3
додано

Один з найпростіших способів передачі даних назад і вперед від вашого коду ASP.NET до вашого JS-шару полягає в тому, щоб серіалізувати ваші об'єкти, а потім перетворювати серіалізацію у перегляд як об'єкт JS. Ось приклад:

// helper extension method
public static string ToJSON(this object o)
{
    var oSerializer = new System.Web.Script.Serialization.JavaScriptSerializer();
    return oSerializer.Serialize(o);
}

Всередині контролера:

Viewbag.Foo = myObj.ToJSON();

Потім, у вашому перегляді, ви просто випльовуєте серіалізовані об'яви як літеральні JavaScript:

var json = @Html.Raw(Viewbag.Foo);//mix of Razor and JS here! 

Коли ви запускаєте його, якщо ви переглядаєте джерело, ви побачите щось подібне в цьому розділі перегляду:

var json = {"prop1":true, "arrayItems":[{ "prop1": "dog" }, { "prop": "car" }]}
1
додано

Один з найпростіших способів передачі даних назад і вперед від вашого коду ASP.NET до вашого JS-шару полягає в тому, щоб серіалізувати ваші об'єкти, а потім перетворювати серіалізацію у перегляд як об'єкт JS. Ось приклад:

// helper extension method
public static string ToJSON(this object o)
{
    var oSerializer = new System.Web.Script.Serialization.JavaScriptSerializer();
    return oSerializer.Serialize(o);
}

Всередині контролера:

Viewbag.Foo = myObj.ToJSON();

Потім, у вашому перегляді, ви просто випльовуєте серіалізовані об'яви як літеральні JavaScript:

var json = @Html.Raw(Viewbag.Foo);//mix of Razor and JS here! 

Коли ви запускаєте його, якщо ви переглядаєте джерело, ви побачите щось подібне в цьому розділі перегляду:

var json = {"prop1":true, "arrayItems":[{ "prop1": "dog" }, { "prop": "car" }]}
1
додано

ЗАСТЕРЕЖЕННЯ

Це надзвичайно просте, просте і не елегантне рішення. Однак це працює =)

Розглянемо цей клас:

public class Something
{
    public int Id { get; set; }
    public string PropA { get; set; }
    public string PropB { get; set; }
}

І цей код на вашій дії:

List list = new List() { 
  new Something(){ Id = 1, PropA = "1-A", PropB = "1-B "}
  , new Something(){ Id = 2, PropA = "2-A", PropB = "2-B "}
};

ViewBag.Things = list;

Нарешті, вигляд:


<input type="text" id="selectedPropB" readonly />
<div style="display: none;">
    @foreach (Something item in ViewBag.Things)
    { 
        @item.PropB
    }
</div>
<script type="text/javascript">
    $(function() {
        $('#theSelect').on('change', function() {
            var id = $(this).val();

            $('#selectedPropB').val($('#propb-'+id).html());
        });
    });
</script>

Примітки:

  • Мені краще скористатися viewmodel замість ViewBag , тому що причини. Так чи інакше, це залежить від вас
  • Я впевнений, що ви можете знайти кращі рішення, якщо ви працюєте з нокаутом і так далі. У всякому разі, як я вже сказав, це працює
0
додано
@raranibar Вибач, не зрозумів. Ви хочете сказати, що це буде важко реалізувати?
додано Автор Andre Calil, джерело
@raranibar Добре, радий допомогти
додано Автор Andre Calil, джерело
Андре Каллі, спасибі за вашу відповідь я досліджую і працюю з їхніми даними, але проект, який я роблю, багато коштує його реалізації
додано Автор raranibar, джерело
Andre Calil, я використовую для завантаження dropdownlist функцію, яка повертає мені дані з бази даних і налаштовувати відповідно до сценарію, який ви надіслали, і займає багато часу, щоб вирішити мою проблему, коли відбувається зміна випадаючого списку на виклик функції ( контролер) .ajax для оновлення textobox, я ціную ваше занепокоєння, я буду використовувати ваше рішення в інших проектах.
додано Автор raranibar, джерело

ЗАСТЕРЕЖЕННЯ

Це надзвичайно просте, просте і не елегантне рішення. Однак це працює =)

Розглянемо цей клас:

public class Something
{
    public int Id { get; set; }
    public string PropA { get; set; }
    public string PropB { get; set; }
}

І цей код на вашій дії:

List list = new List() { 
  new Something(){ Id = 1, PropA = "1-A", PropB = "1-B "}
  , new Something(){ Id = 2, PropA = "2-A", PropB = "2-B "}
};

ViewBag.Things = list;

Нарешті, вигляд:


<input type="text" id="selectedPropB" readonly />
<div style="display: none;">
    @foreach (Something item in ViewBag.Things)
    { 
        @item.PropB
    }
</div>
<script type="text/javascript">
    $(function() {
        $('#theSelect').on('change', function() {
            var id = $(this).val();

            $('#selectedPropB').val($('#propb-'+id).html());
        });
    });
</script>

Примітки:

  • Мені краще скористатися viewmodel замість ViewBag , тому що причини. Так чи інакше, це залежить від вас
  • Я впевнений, що ви можете знайти кращі рішення, якщо ви працюєте з нокаутом і так далі. У всякому разі, як я вже сказав, це працює
0
додано
@raranibar Вибач, не зрозумів. Ви хочете сказати, що це буде важко реалізувати?
додано Автор Andre Calil, джерело
@raranibar Добре, радий допомогти
додано Автор Andre Calil, джерело
Андре Каллі, спасибі за вашу відповідь я досліджую і працюю з їхніми даними, але проект, який я роблю, багато коштує його реалізації
додано Автор raranibar, джерело
Andre Calil, я використовую для завантаження dropdownlist функцію, яка повертає мені дані з бази даних і налаштовувати відповідно до сценарію, який ви надіслали, і займає багато часу, щоб вирішити мою проблему, коли відбувається зміна випадаючого списку на виклик функції ( контролер) .ajax для оновлення textobox, я ціную ваше занепокоєння, я буду використовувати ваше рішення в інших проектах.
додано Автор raranibar, джерело
<script type="text/javascript">
     var jsList= @Html.Raw(Json.Encode(@ViewBag.GenericList));
</script>
0
додано
<script type="text/javascript">
     var jsList= @Html.Raw(Json.Encode(@ViewBag.GenericList));
</script>
0
додано
var chat = new Chat();
var chat = new Chat();
642 учасників

Обсуждение вопросов по C# / .NET / .NET Core / .NET Standard / Azure Сообщества-организаторы: — @itkpi — @dncuug

ІТ КПІ - JavaScript
ІТ КПІ - JavaScript
504 учасників

співтовариство javascript розробників в Telegram