Обновление выпадающего списка из кода с использованием Javascript / JQuery

Question

Обновление выпадающего списка из кода с использованием Javascript / JQuery

0

У меня есть приложение с двумя разделами.

В верхней части находится dropdownlist список, в котором отображаются все члены database с использованием метода кода, который вызывается при page load.

В нижней части есть сетка, в которой вы можете add/delete/edit элементы с помощью JQuery. Изменение этого раздела, очевидно, не перестраивает выпадающий список в верхнем разделе.

Я хочу запустить некоторый код в методе успеха JQuery который updates/rebuilds dropdownlist список, чтобы отразить новое изменение члена. Я хотел бы по возможности использовать тот же код за методом, который попадает в db на page_load чтобы populate выпадающий список.

Это возможно? Если да, то как я могу это сделать?

Любая помощь будет принята с благодарностью.

[Запрошенный код]
.aspx файл

<asp:DropDownList ID="director" runat="server"></asp:DropDownList> 
 jQuery success() fired on add/delete/update member grid.

.aspx.cs (код позади)

private void LoadDirectorOptions(int deptId)  
{
            var memberRepo = new MemberRepository();  
            List<Member> members = memberRepo.GetMembers(deptId);

            director.DataSource = members;
            director.DataTextField = "FullName";
            director.DataValueField = "Id";
            director.DataBind();
            director.Items.Insert(0, new ListItem("<Please Select>", "0")); 

}

Baxter 25 сен. 2013, в 15:45

Источник

Теги:

c#

jquery

asp.net

drop-down-menu

code-behind

3 ответа

1

Если вы хотите обновить раскрывающийся список без обновления всей страницы, вам необходимо обернуть их внутри UpdatePanel. Когда сетка в нижней части будет изменена, обновите UpdatePanel, чтобы она перепроверила выпадающий список. Чтобы принудительно обновить UpdatePanel в Javascript, вы можете использовать метод GetPostBackEventReference, чтобы принудительно выполнить обратную передачу:

<%= Page.ClientScript.GetPostBackEventReference(updatePanelID, "")%>

nmat 25 сен. 2013, в 11:17

0

Могу ли я обновить панель обновления из Javascript / JQuery? Если так, как бы я поступил так?
Baxter 25 сен. 2013, в 13:37
0

@nmat Жаль, что я не могу понизить вас даже за предложение обновить панель. Пожалуйста, перейдите по предложенной мной ссылке и изучите настоящий ajax.
idlehands23 25 сен. 2013, в 13:37
0

@Baxter Да, вы можете принудительно выполнить обратную передачу в javascript, а затем повторно связать выпадающий список при загрузке страницы. Смотрите обновленный ответ. Если вы хотите больше подробностей, вам нужно предоставить соответствующий код вашего приложения
nmat 25 сен. 2013, в 13:41
0

@ idlehands23 UpdatePanel совместим с циклом страниц ASP, поэтому он может повторно использовать тот же код из метода Page_Load, не выполняя полную обратную передачу в традиционном смысле.
nmat 25 сен. 2013, в 13:42

Показать ещё 2 комментария

1

Должен использовать ajax в вашем вызове метода вызова для вызова. http://api.jquery.com/jQuery.ajax/

idlehands23 25 сен. 2013, в 11:04

0

Я думал, что контроль может быть решением. Я просто не уверен, как использовать его, чтобы перестроить элемент управления страницы с помощью метода кода позади. Вы можете остановиться на этом?
Baxter 25 сен. 2013, в 13:53

Ещё вопросы

Могу ли я обновить панель обновления из Javascript / JQuery? Если так, как бы я поступил так?
@nmat Жаль, что я не могу понизить вас даже за предложение обновить панель. Пожалуйста, перейдите по предложенной мной ссылке и изучите настоящий ajax.
@Baxter Да, вы можете принудительно выполнить обратную передачу в javascript, а затем повторно связать выпадающий список при загрузке страницы. Смотрите обновленный ответ. Если вы хотите больше подробностей, вам нужно предоставить соответствующий код вашего приложения
@ idlehands23 UpdatePanel совместим с циклом страниц ASP, поэтому он может повторно использовать тот же код из метода Page_Load, не выполняя полную обратную передачу в традиционном смысле.
Я думал, что контроль может быть решением. Я просто не уверен, как использовать его, чтобы перестроить элемент управления страницы с помощью метода кода позади. Вы можете остановиться на этом?

user123456 · Accepted Answer · 2013-09-25T13-23-00.000Z

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

вниз. например:

  $.ajax({
      // Updating the grid here and retrun all the members : it will be saved in the response
      type: "Get",
      url: url,
      data: data,
      dataType: dataType,
      success: success(data)
    });

    function success(data)
    {
      //here you can get the resposne from the server
      // Iterate through data and add option elements
      $(".members").append("<option value=? text=?/>");

    }

Скорее всего, ваши данные должны быть JSON котором есть все члены в таблице базы данных членов вашего сервера. то вы можете добавить класс CSS (участников) в раскрывающийся список и использовать селектор JQuery для выбора раскрывающегося списка.

Надеюсь, это полезно.

Это именно то, что я искал. Спасибо.