如何从动态创建的可排序手风琴中获取标题文本?

时间:2014-11-24 17:28:22

标签: jquery html asp.net-mvc

我目前正在用手风琴动态创建表格,我在jquery中执行可排序操作以从其他表中删除信息。一切正常,但问题出在这里:我想为我的数据库使用动态创建的手风琴的标题文本,但我不知道如何获取这些信息。这是我的页面图片。

dynamic header text

这是我创建的表的html代码

<div id="codigosAgrupadores">
    <div id="catalog">
        @foreach (CodigoAgrupadorCuentas_CE c in Model.CodigosAgrupadores)
        {
            if (unchecked(double.Parse(c.CodigoAgrupador) == (int)double.Parse(c.CodigoAgrupador)))
            {
                <h3><a href="#">@c.CodigoAgrupador  -  @c.NombreCuenta</a></h3>
                <div>
                    <div class="subcatalog">
                        @foreach (CodigoAgrupadorCuentas_CE c2 in Model.CodigosAgrupadores)
                        {
                            if (double.Parse(c2.CodigoAgrupador) > double.Parse(c.CodigoAgrupador) && double.Parse(c2.CodigoAgrupador) < (double.Parse(c.CodigoAgrupador) + 1))
                            {
                                <h4><a href="#">@c2.CodigoAgrupador  -  @c2.NombreCuenta</a></h4>
                                <div>
                                    <div class="SpecificCatalog">
                                        <ol>
                                            <li class="placeholder">Add your items here</li>
                                        </ol>
                                    </div>
                                </div>
                            }
                        }
                    </div>
                    <div class="GeneralCatalog">
                        <ol>
                            <li class="placeholder">Add your items here</li>
                        </ol>
                    </div>
                </div>
            }
        }
    </div>
</div>

如何使用Jquery访问标题数据?这是我的一个带有stop函数的sortables的例子,我能够访问droppable元素信息,但是我想访问包含被删除元素的手风琴的头信息。

$(".GeneralCatalog").sortable({
    connectWith: ".SpecificCatalog, .listaCatalogosContenido", helper: "clone",
    appendTo: "body",

    stop: function (event, ui) {
        //console.log((this).sortable('toArray', { attribute: 'value' }));
        console.log(ui.item);
        console.log(ui.item.text());
    }
});

编辑:以下是我展示的图片特定部分的呈现HTML。

<script>
    $(function () {
        $("#catalog").accordion({ collapsible: true, active: false, autoHeight: false });
        $(".subcatalog").accordion({ collapsible: true, active: false, autoHeight: false });

        $(".SpecificCatalog").sortable({
            connectWith: ".listaCatalogosContenido, .GeneralCatalog", helper: "clone",
            appendTo: "body",

            stop: function (event, ui) {
                //console.log((this).sortable('toArray', { attribute: 'value' }));
                console.log(ui.item);
                console.log(ui.item.text());
            }

        });
        $(".listaCatalogosContenido").sortable({
            connectWith: ".SpecificCatalog, .GeneralCatalog", helper: "clone",
            appendTo: "body",

            stop: function (event, ui) {
                //console.log((this).sortable('toArray', { attribute: 'value' }));
                console.log(ui.item);
                console.log(".head h3");
                console.log(ui.item.text());
            }
        });
        $(".GeneralCatalog").sortable({
            connectWith: ".SpecificCatalog, .listaCatalogosContenido", helper: "clone",
            appendTo: "body",

            stop: function (event, ui) {
                //console.log((this).sortable('toArray', { attribute: 'value' }));
                console.log(ui.item);
                console.log(ui.item.text());
            }
        });
    });
</script>



<div id="wrapper">
<h2>LigarAGrupo</h2>
<div id="content">
    <div id="ListaCodigos">
        <h2 class="ui-widget-header">CodigoAgrupador</h2>
        <div id="codigosAgrupadores">
            <div id="catalog">
                <h3><a href="#">1  -  Caja</a></h3>
                <div>
                    <div class="subcatalog">
                        <h4><a href="#">1.1  -  Caja y efectivo</a></h4>
                        <div>
                            <div class="SpecificCatalog">
                                <ol>
                                    <li class="placeholder">Add your items here</li>
                                </ol>
                            </div>
                        </div>
                    </div>
                    <div class="GeneralCatalog">
                        <ol>
                            <li class="placeholder">Add your items here</li>
                        </ol>
                    </div>
                </div>

另外,这是我从F12获得的HTML - &gt;谷歌浏览器中的元素。

Elements

1 个答案:

答案 0 :(得分:1)

据我所知你发布的不是整个视图。但我认为这个jquery代码应该提醒您所需的所有值。

$("div#catalog h3 a").each(function(item)
{
    alert($(this).text());
});

不要忘记将此代码放在document.ready()函数中,以防万一。