Question

我想拿两张桌子并用结果填充gridview：

产品类

我希望将gridview按类别划分为子标题，而不是作为产品gridview中的数据字段...

类似的东西：

（类别：食物，衣服，住所）

FOOD

 Rice 10s Available <buy now>

 Beans 20s Available <buy now>

 Chicken 50s Available <buy now>

CLOTHING

 Cloak 30s Available <buy now>

 Helmet 45s Available <buy now>

 Sandals 10s Available <buy now>

SHELTER

 Tent 100s Available <buy now>

任何帮助将不胜感激！

Answer 1

您无法使用开箱即用的asp.net gridview。

您可以使用转发器并在转发器项目中嵌套gridview。中继器的类别。 .NET 3.0 +使用ListView

您可以购买商业控件，也许有一些免费的可以自定义这种行为。

安德鲁

Answer 2

您可能希望查看DevExpress网格控件，它不仅可以执行此操作，还允许用户手动将列拖到顶部，以他们认为合适的任何方式进行分类。您可以限制可以使用的列。

我不知道你是否可以在GridView中做到这一点（我认为你不能），但你绝对可以使用DeveExpress网格。

Answer 3

ListView将相当容易地完成此操作，因为它具有分组模板。类别的Repeater，包含项目的嵌套GridView也可以使用。

如果你在GridView上设置，它将需要一些hackery。您可以修改数据以放入分类行，将GridView子类化以添加新行，添加自定义控件以将标记注入GridView的HTML（我使用一个关闭当前行并添加新的colspanned行）或使用JQuery在客户端上。

子类化是“正确”的方式 - 并且可以重复使用 - 但它有点工作。修改数据相当容易，但它非常难看，并且取决于您如何绑定数据。 JQuery实际上可能是最简单的路线。在第1列中设置类别，在类别更改时创建新行，然后隐藏第1列。它也很好地降级，因为noscript将成为第1列中的类别。这没有经过测试，但它应该让你接近：

var lastCategory = '';
$('TR > TD:first').each(function() {
   var thisCategory = $(this).text().trim();
   if (thisCategory != lastCategory) {
      // new category - insert subheading row
      var thisRow = $(this).parent();
      var colspan = $('> TD', thisRow).length;
      thisRow.insertBefore(
          '<tr class="subheading">' +
              '<td colspan="' + colspan.toString() + '">' +
                thisCategory +
              '</td>' +
          '</tr>'
      );
      lastCategory = thisCategory;
   }
}).hide(); // hide 1st columns

Answer 4

我试图实现Mark的代码，并且必须稍微调整它以使其工作。对于将来遇到这篇文章的人来说，修改后的代码是：

var lastCategory = '';
$('tr').find('td:first').each(function() {
    var thisCategory = $(this).text().trim();
    if (thisCategory != lastCategory) {
        // new category - insert subheading row
        var thisRow = $(this).parent();
        var colspan = $('> td', thisRow).length;
        thisRow.before(
          '<tr class="subheading">' +
              '<td colspan="' + colspan.toString() + '">' +
                thisCategory +
              '</td>' +
          '</tr>'
        );
        lastCategory = thisCategory;
    }
}).hide();

我必须更改初始选择器以获取每个中的第一个单元格，并将insertBefore（）更改为before（），因为inserBefore（）用于jQuery对象而不是html内容。

如何将项目分组到ASP.NET gridview控件中的子标题？

4 个答案: