【发布时间】:2019-08-12 16:45:27
【问题描述】:
我一直在努力完成这项工作,我有一个 ListView,它有 2 个按钮,基本上是图像的“接受”和“拒绝”,这些按钮是由 Listview 本身生成的,所以我无法分配 id .我不能使用命令参数,因为它们是 html 按钮,我也不能使用链接按钮,因为它们发送回发导致页面刷新,不能使用 Asp 按钮,因为里面有一个 FA 图标(我知道我可以下载一个库但是我不确定),所以问题是我如何才能做到,当使用单击一个按钮时,另一个按钮变为灰色,当我单击最后一个按钮时,我循环遍历列表视图并检索所有“接受“图片?
列表查看代码:
<asp:ListView ID="listadoImg" runat="server" Visible="true" OnItemDataBound="listadoImg_DataBound" >
<ItemTemplate>
<div class="col-12 col-md-6">
<div class="card">
<asp:Image ID="Image1" runat="server" ImageUrl='<%# Eval("imagen") %>' CssClass="card-img-top" />
<div class="card-body">
<div class="row">
<div class="col-7 text-right ">
<asp:Label ID="Label13" Text='<%# string.Concat("SKU: ",Eval("sku"))%>' runat="server"
CssClass="" Font-Size="Small" /><br />
<asp:Label ID="Label17" Font-Size="Small" Text='<%# Eval("marca").ToString() + " " + Eval("descripcion").ToString()%>' runat="server" CssClass="labelImagenes" /><br />
<asp:Label ID="Label15" Font-Size="Small" Text='<%# string.Concat("Precio Normal: ",Eval("precioNormal"))%>'
runat="server" CssClass="labelImagenes" /><br />
<asp:Label ID="lblPrecioOferta" Font-Size="Small" Text='<%# string.Concat("Precio Oferta: ",Eval("precioPublicacion"))%>'
runat="server" CssClass="labelImagenes" />
</div>
<%--<div class="col-5 text-left mt-3">
<p><i class="fa fa-check fa-2x ico-verde"></i> <span>Aprobar </span></p>
<p><i class="fa fa-ban fa-2x mt-1 ico-rojo"></i> <span>Rechazar </span></p>
</div>--%>
<div class="col-5 text-left mt-3">
<button type="button" id="btnAceptado1" class="btn btn-light" style="position: relative; display: inline-block; left: 5%; font-size: 18px; top: 3%; padding: 0px; background-color: transparent; margin-top: -10px; border: 1px solid transparent"
aria-label="Left Align" onclick="CambiarAceptado1()" >
<i class="fa fa-check fa-2x ico-verde"></i>
<span>Aprobar </span>
</button>
<button type="button" id="btnAceptado2" class="btn btn-light" style="position: relative; display: none; left: 5%; font-size: 18px; top: 3%; padding: 0px; background-color: transparent; margin-top: -10px; border: 1px solid transparent"
aria-label="Left Align" onclick="CambiarAceptado2()" >
<i class="fa fa-check fa-2x ico-plomo"></i>
<span>Aprobar </span>
</button>
<br />
<button type="button" id="btnRechazado1" class="btn btn-light" style="position: relative; display: inline-block; left: 5%; top: 3%; padding: 0px; font-size: 18px; background-color: transparent; border: 1px solid transparent"
aria-label="Left Align" onclick="CambiarRechazado1()">
<i class="fa fa-ban fa-2x mt-1 ico-rojo"></i>
Rechazar
</button>
<button id="btnRechazado2" type="button" class="btn btn-light" style="position: relative; display: none; left: 5%; top: 3%; padding: 0px; font-size: 18px; background-color: transparent; border: 1px solid transparent"
aria-label="Left Align" onclick="CambiarRechazado2()" >
<i class="fa fa-ban fa-2x mt-1 ico-plomo"></i>
Rechazar
</button>
</div>
</div>
</div>
</div>
</div>
</ItemTemplate>
</asp:ListView>
到目前为止,我已经能够制作类似于一行的东西,当它像这样为空白时它会消失:
protected void listadoImg_DataBound(object sender, ListViewItemEventArgs e)
{
Label lblPrecioOfe;
if (e.Item.ItemType == ListViewItemType.DataItem)
{
lblPrecioOfe = (Label)e.Item.FindControl("lblPrecioOferta");
System.Data.DataRowView rowView = e.Item.DataItem as System.Data.DataRowView;
string precioPub = rowView["precioPublicacion"].ToString();
if (precioPub == "")
{
lblPrecioOfe.Text = "";
}
}
}
图像如下所示:
目前我可以使它与目前在按钮中使用的 JavaScript 一起工作,但仅适用于列表中的第一个对象。
使用的JS是这样的:
function CambiarAceptado1() {
document.getElementById('btnAceptado1').style.display = 'inline-block';
document.getElementById('btnAceptado2').style.display = 'none';
document.getElementById('btnRechazado1').style.display = 'none';
document.getElementById('btnRechazado2').style.display = 'inline-block';
}
function CambiarAceptado2() {
document.getElementById('btnAceptado1').style.display = 'inline-block';
document.getElementById('btnAceptado2').style.display = 'none';
document.getElementById('btnRechazado1').style.display = 'none';
document.getElementById('btnRechazado2').style.display = 'inline-block';
}
function CambiarRechazado1() {
document.getElementById('btnAceptado1').style.display = 'none';
document.getElementById('btnAceptado2').style.display = 'inline-block';
document.getElementById('btnRechazado1').style.display = 'inline-block';
document.getElementById('btnRechazado2').style.display = 'none';
}
function CambiarRechazado2() {
document.getElementById('btnAceptado1').style.display = 'none';
document.getElementById('btnAceptado2').style.display = 'inline-block';
document.getElementById('btnRechazado1').style.display = 'inline-block';
document.getElementById('btnRechazado2').style.display = 'none';
}
【问题讨论】:
-
如果你想在 asp.net 按钮中添加一个图标,你应该可以使用
你好 ton> 然后用它来调用你的回发。如果您想防止回发时页面闪烁,也可以查看更新面板。 -
带有页面 web 方法的 Jquery Ajax 是另一种选择
-
已经解决了,在此先感谢,我将在完成代码后立即发布解决方案,ty @Drewskis
标签: c# html listview button visual-studio-2017