0

こんにちは皆さん、jquery id と listview div id の両方を動的に設定したかったのですが、良い例がなくてもインターネットを調べました。

    <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">

リソースやアイデアへの良いリンクはありますか?

ありがとう

4

1 に答える 1

0

あなたが言及したコードには動的なものはありません。一般的な方法は、2 つのリストビュー (またはリピーター) を使用してコードを生成するか、セレクターまたは 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"))%>' />'>
于 2013-11-15T23:30:56.873 に答える