如何在 CommandField 中旋转图像

Question

所以我有这些行，

我的 .aspx 页面中每一行都有一个命令字段。

<asp:CommandField ControlStyle-BackColor="White" ItemStyle-BackColor="White"     SelectImageUrl="~/Styles/img/arrow_state_blue_right.png"
                                            ShowSelectButton="true" ButtonType="Image" ItemStyle-Width="3px"></asp:CommandField>

如您所见，命令字段使用的按钮类型是图像。图像是您在图片中每个命令字段中看到的蓝色小箭头。

我希望当用户单击命令字段时箭头通过动画旋转。所以我写了一点javascript函数：

function rotateArrow() {
  document.getElementById("#arrow").style.WebkitTransitionDuration = "1s";
  document.getElementById("#arrow").style.webkitTransform = 'rotate(40deg)';
}

当箭头是图像字段时，此函数工作得很好。也就是说，如果我将箭头更改为：

<asp:Image ImageURL=".....

但我不希望箭头成为 asp.NET 图像字段，我希望它们成为命令字段中的按钮。

有办法吗？我如何告诉 JavaScript 旋转命令字段的箭头图像属性？我找不到任何相关信息，所以我开始认为这根本不受支持。我能想到的唯一解决方法并不意味着我会失去命令字段功能，我可以简单地更新后面代码中的 selectImageURL 属性，但那样我就没有动画了。

Answer 1

如果其他人正在努力访问命令字段或类似内容中的属性，这里有一个解决方案。隐藏字段中的图像是一个 ImageButton。这是我的 .aspx 文件中带有命令字段的网格视图：

<asp:GridView ID="gvColumnsViewSettings" runat="server" Width="90%"  OnRowDataBound="gvColumnsViewSettings_RowDataBound" AutoGenerateColumns="false" GridLines="None" ShowHeader="false" ShowFooter="false" OnSelectedIndexChanged="gvColumnsViewSettings_SelectedIndexChanged" DataKeyNames="ColumnOrder">
    <Columns>
    <asp:CommandField ControlStyle-BackColor="White" ItemStyle-BackColor="White" SelectImageUrl="~/Styles/img/arrow_state_blue_right.png" ShowSelectButton="true" ButtonType="Image" ItemStyle-Width="3px"></asp:CommandField>
...

注意当 gridview 索引改变时，它如何调用函数 gvColumnsViewSettings_SelectedIndexChanged。

现在在我后面的代码中的 SelectedIndexChanged 函数中：

ImageButton arrow = null;
if(selectedRow.Cells != null && selectedRow.Cells.Count > 0 && selectedRow.Cells[0].Controls != null && selectedRow.Cells[0].Controls.Count > 0)
    arrow = (ImageButton)selectedRow.Cells[0].Controls[0];

现在您的命令字段中有了箭头图像属性！

如何在 CommandField 中旋转图像

How do you rotate the image in a CommandField

.net

asp.net

commandfield