Как вы jquery # теги и динамически установить div ID в виде списка

Question

Привет всем, я хотел динамически установить и идентификатор jquery, и идентификатор списка просмотра динамически. Я просмотрел Интернет без каких-либо хороших примеров.

    <script>
        $(function () {
    // I need to set the #accLstViewInner to #accLstViewInner + itemID
            $("#accLstViewInner").accordion({
                collapsible: true, active: false
            });
        });
    </script>

и установить

     <asp:ListView ID="lstAccordionViewInner" Runat="server" >
        <LayoutTemplate>
            // set the div below to #accLstViewInner + itemID as well
            <div id="accLstViewInner">

Есть ли хорошие ссылки на ресурсы или идеи?

Спасибо

Answer 1

В упомянутом вами коде нет такой вещи, как динамически. Обычной практикой было бы иметь два списка (или повторителя) для генерации кода или для вывода результата из вашего объекта непосредственно в ваш селектор или переменную js.

Я предполагаю, что вы кормите, если из-за кода с чем-то вроде

lstAccordionViewInner.DataSource = someListObject;
lstAccordionViewInner.DataBind();

В качестве примера

class someList
{
    public int Id { get; set; }
    public string Name { get; set; }
}

// and an example instance, should be put in a property if you want to access it from your aspx-code
var someListObject = new List<someList>()
{
    new someList() {Id = 1, Name = "#accLstViewInner"},
    new someList() {Id = 2, Name = "#accLstViewInner"},
    new someList() {Id = 3, Name = "#accLstViewInner"},
    new someList() {Id = 4, Name = "#accLstViewInner"},
    new someList() {Id = 5, Name = "#accLstViewInner"}
};

string jqueryResult = someListObject.Aggregate(string.Empty, (current, item) => current + string.Concat(item.Name, "_", item.Id, item == someListObject.Last() ? string.Empty : ", "));
// #accLstViewInner_1, #accLstViewInner_2, #accLstViewInner_3, #accLstViewInner_4, #accLstViewInner_5

Этот результат вы можете использовать непосредственно в вашем селекторе jQuery

$('<%=someListObject.Aggregate(string.Empty, (current, item) => current + string.Concat(item.Name, "_", item.Id, item == someListObject.Last() ? string.Empty : ", "));%>').accordion({
    collapsible: true, active: false
});

Когда страница отображается, это станет

$('#accLstViewInner_1, #accLstViewInner_2, #accLstViewInner_3, #accLstViewInner_4, #accLstViewInner_5').accordion({
    collapsible: true, active: false
});

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

$("[id^=accLstViewInner]").accordion({
    collapsible: true, active: false
});

Для обработки списка...

 <asp:ListView ID="lstAccordionViewInner" Runat="server" >
    <LayoutTemplate>
        // set the div below to #accLstViewInner + itemID as well
        <div id='accLstViewInner_<%#Eval("Id") %>' />'>
        // or possibly
        <div id='accLstViewInner_<%#DataBinder.Eval(Container.DataItem, "Id")%>' />'>
        // ...
        <div id='accLstViewInner_<% DataBinder.Eval(Container.DataItem("Id"))%>' />'>