Ajax ToggleButtonExtender图像不显示

Question

我正在使用AjaxToggleButtonExtender

<asp:CheckBox ID="CheckBox1" runat="server" />
  <asp:ToggleButtonExtender ID="ToggleButtonExtender1" runat="server" TargetControlID="CheckBox1" UncheckedImageUrl="~/assets/img/icon-img-up.png" ImageHeight="10" ImageWidth="40" CheckedImageUrl="~/assets/img/icon-img-down.png">
  </asp:ToggleButtonExtender>

购买已选中和未选中图像不显示。我怎么解决这个问题 ？

Answer 1

使用ImageHeight和ImageWidth调整图像大小时，并不是整个图像的大小调整，而是只有部分图像由togglebuttonextender根据您输入的大小进行查看。

Answer 2

当您使用ToggleButtonExtender时，您可能需要调整容器控件的大小以适应，否则图像可能不可见。

例如，包含复选框的<td>通常采用使复选框可见的大小，但ToggleButtonExtender使用客户端代码渲染图像，并且可能不考虑包含元素的约束。我们遇到了相同的可见性问题，部分或全部图像缺失。

我们使用包含div来解决它，设置为足够的大小以允许看到图像：

<td>
    <div style="width: 30px">
        <asp:CheckBox runat="server" ID="chkBooked" />
        <asp:ToggleButtonExtender ID="togbutBooked" 
            TargetControlID="chkBooked"
            UncheckedImageUrl="~/Images/toggle_off_small.png"
            CheckedImageUrl="~/Images/toggle_on_small.png">
        </asp:ToggleButtonExtender>
    </div>
</td>