5

我正在制作一个配置页面,它将类别树拆分为 3 列以便于浏览,例如:

**Column 1**            **Column 2**             **Column3**  
   Category1               Category3                Category5
    *SubCategory1*         Category4                  *SubCategory5*
   Category2                 *SubCategory4*           *SubCategory6*
     *SubCategory2*        etc.
     *SubCategory3*  

我正在使用 jsp、jquery 和 struts2。我要做的是配置显示类别/子类别的顺序。现在我展示了这样的结构,我可以将它们从一列拖到另一列,对列的类别进行排序并对子类别进行排序,使用 jquery 并直接修改 HTML,但我不知道如何获取修改结构的数据以将其保存在我的数据库中。

4

2 回答 2

5

我最近不得不在我的个人项目上做类似的事情,但从未真正使用过我正在编写的功能,但这是我使用的代码:

function refactor() {
    var array = jQuery.makeArray($('ul#remapped > li:not(.target)'));
    var mappedArray = jQuery.map(array, function(i) {
        var merged = $(i).find('ul.merge > li:not(.target) > span');
        return {
            column: $(i).children('span').text(),
            merged: jQuery.map(jQuery.makeArray(merged), function(mi) { return { column: mi.innerText }; })
        };
    });

    var xml = '<columns>';
    jQuery.each(mappedArray, function(index, item) {
        xml += '\n\t<column>';
        xml += '\n\t\t<name>' + item.column + '</name>';
        if (item.merged.length > 0) {
            xml += '\n\t\t\t<merged>';
            jQuery.each(item.merged, function(mindex, mitem) {
                xml += '\n\t\t\t\t<name>' + mitem.column + '</name>';
            });
            xml += '\n\t\t\t</merged>';
        }
        xml += '\n\t</column>';
    });
    xml += '\n</columns>';

    $('div#result').load('/Tools/Csv/Refactor', { mapping: xml });
}

基本上,用户会使用 UI 随意拖放来创建他们想要的结构。然后,他们单击执行此方法的按钮。

$('ul#remapped') 查询是包含新结构的元素(在我的代码中),然后我再次根据我的 DOM 结构进行了一些额外的查询,以从 DOM 中提取我需要的值并生成一个 XML 字符串,然后将其发布到服务器。

我确定这不是所需要的,但我希望它足够接近,您可以根据需要对其进行修改。

于 2008-12-23T17:50:47.927 回答
0

我假设结构通过拖放进行了修改。您可以在每次结构发生更改时进行 ajax 调用,并更新您拥有的 CategorySucategories 表中的数据。我不知道你的数据库结构,所以我也做了一个假设。

于 2008-12-23T17:40:23.237 回答