2008-10-07 22 views
5

tengo unas pocas cosas CheckBoxList en una página:¿Dónde se almacenan los valores de DataValueField para CheckBoxList?

<asp:checkboxlist runat="server" id="Locations" datasourceid="LocationsDatasource" 
    datatextfield="CountryName" datavaluefield="CountryCode" /> 

me gustaría colocar a través de los elementos de casilla de verificación en el cliente utilizando Javascript y agarrar el valor de cada casilla de verificación está activada, pero los valores no parecen ser disponible en el lado del cliente. La salida HTML es el siguiente:

<table id="ctl00_Content_Locations" class="SearchFilterCheckboxlist" cellspacing="0" cellpadding="0" border="0" style="width:235px;border-collapse:collapse;"> 
<tr> 
    <td><input id="ctl00_Content_Locations_0" type="checkbox" name="ctl00$Content$Locations$0" /><label for="ctl00_Content_Locations_0">Democratic Republic of the Congo</label></td> 
</tr><tr> 
    <td><input id="ctl00_Content_Locations_1" type="checkbox" name="ctl00$Content$Locations$1" /><label for="ctl00_Content_Locations_1">Central African Republic</label></td> 
</tr><tr> 
    <td><input id="ctl00_Content_Locations_2" type="checkbox" name="ctl00$Content$Locations$2" /><label for="ctl00_Content_Locations_2">Congo</label></td> 
</tr><tr> 
    <td><input id="ctl00_Content_Locations_3" type="checkbox" name="ctl00$Content$Locations$3" /><label for="ctl00_Content_Locations_3">Cameroon</label></td> 
</tr><tr> 
    <td><input id="ctl00_Content_Locations_4" type="checkbox" name="ctl00$Content$Locations$4" /><label for="ctl00_Content_Locations_4">Gabon</label></td> 
</tr><tr> 
    <td><input id="ctl00_Content_Locations_5" type="checkbox" name="ctl00$Content$Locations$5" /><label for="ctl00_Content_Locations_5">Equatorial Guinea</label></td> 
</tr> 

Los valores ("CD", "CG", "ga", etc.) se pueden encontrar en ninguna parte. ¿Dónde están? ¿Es posible acceder a ellos en el cliente, o tengo que construir esta lista de casilla de verificación usando un repetidor o algo así?

Respuesta

2

Almacenado en ViewState, no puede acceder a ellos en el cliente sin some hacking.

+0

Gracias. Supongo que solo tendré que crear la lista de casilla de verificación con un repetidor. –

-1

He buscado esto antes y puede que tengas poca suerte. Creo que recuerdo haber visto que no hay un elemento de la lista de casilla de verificación para JavaScript, por lo que no lo entiendo. Tendrás que buscar elementos en la página que tengan el tipo de casilla de verificación y probar para ver qué grupo (creo que es la propiedad) a la que pertenece también.

Voy a buscar mi código y ver si puedo encontrar lo que hice ...


Por supuesto, no puedo encontrar lo que hice.

¿Por qué lo haces en el lado del cliente en javascript? ¿Por qué no haces algo de AJAX y controlas todo lo del lado del servidor?

+0

FYI: Java y JavaScript no son lo mismo, son idiomas diferentes completos. –

+0

Esto no es una respuesta, sino una opinión. Debería ser removido. – Fandango68

2

Para evitar la piratería de la lista pulsando sólo tiene que utilizar un repetidor como tal:

<asp:Repeater ID="rptItems" runat="server" DataSourceID="odsDataSource"> 
<ItemTemplate> 
<input id="iptCheckBox" type="checkbox" runat="server" value='<%# Eval("Key") %>'><%# Eval("Value") %></input> 
</ItemTemplate> 
</asp:Repeater> 
6
<body> 
    <form id="form1" runat="server"> 
      <div> 
       <asp:CheckBoxList ID="CheckBoxList1" runat="server" DataTextField="tx" DataValueField="vl"> 
       </asp:CheckBoxList> 
      </div> 
      <input id="Button1" type="button" value="button" onclick="return Button1_onclick()" /> 
    </form> 
</body> 
<script type="text/javascript"> 

function Button1_onclick() 
{ 
var itemarr = document.getElementById("CheckBoxList1").getElementsByTagName("span"); 
var itemlen = itemarr.length; 
    for(i = 0; i <itemlen;i++) 
    { 
      alert(itemarr[i].getAttribute("dvalue")); 
    } 
return false; 
} 


</script> 

Código

protected void Page_Load(object sender, EventArgs e) 
{ 
    if (!IsPostBack) 
    { 
     DataTable dt = new DataTable(); 
     dt.Columns.Add("tx"); 
     dt.Columns.Add("vl"); 
     DataRow dr = dt.NewRow(); 
     dr[0] = "asdas"; 
     dr[1] = "1"; 
     dt.Rows.Add(dr); 
     dr = dt.NewRow(); 
     dr[0] = "456456"; 
     dr[1] = "2"; 
     dt.Rows.Add(dr); 
     dr = dt.NewRow(); 
     dr[0] = "yjryut"; 
     dr[1] = "3"; 
     dt.Rows.Add(dr); 
     dr = dt.NewRow(); 
     dr[0] = "yjrfdgdfgyut"; 
     dr[1] = "3"; 
     dt.Rows.Add(dr); 
     dr = dt.NewRow(); 
     dr[0] = "34534"; 
     dr[1] = "3"; 
     dt.Rows.Add(dr); 
     CheckBoxList1.DataSource = dt; 
     CheckBoxList1.DataBind(); 
     foreach (ListItem li in CheckBoxList1.Items) 
     { 
      li.Attributes.Add("dvalue", li.Value); 
     } 
    } 
} 
0

Swapna, Su respuesta funciona en absoluto. Así que con el fin de comprobar si la casilla de verificación en el ASP.Net CheckBoxList se comprueba y se acumulará entonces la lista como una cadena delimitada por comas, que puede hacer como

C# de código subyacente

ChkboxList1.DataSource = dsData; 
ChkboxList1.DataTextField = "your-display-column-name"; 
ChkboxList1.DataValueField = "your-identifier-column-name"; 
ChkboxList1.DataBind(); 

foreach (ListItem li in ChkboxList1.Items) 
{ 
    li.Attributes.Add("DataValue", li.Value); 
} 

Luego, en javascript hacer

var selValues = ""; 
var ChkboxList1Ctl = document.getElementById("ChkboxList1"); 
var ChkboxList1Arr = null; 
var ChkboxList1Attr= null; 

if (ChkboxList1Ctl != null) 
{ 
    ChkboxList1Arr = ChkboxList1Ctl.getElementsByTagName("INPUT"); 
    ChkboxList1Attr = ChkboxList1Ctl.getElementByTagName("span"); 
} 
if (ChkboxList1Arr != null) 
{ 
    for (var i = 0; i < ChkboxList1Arr.length; i++) 
    { 
     if (ChkboxList1Arr[i].checked) 
      selValues += ChkboxList1Attr[i].getAttribute("DataValue") + ","; 
    } 
    if (selValues.length > 0) 
     selValues = selValues.substr(0, selValues.length - 1); 
} 
2

tenía que hacer algo realmente desagradable con el fin de conseguir que esto funcione ..

 <asp:Repeater ID="rptItems" runat="server"> 
      <ItemTemplate> 
       <input ID="iptCheckBox" type="checkbox" runat="server" value='<%# Eval("your_data_value") %>' /> 
       <label ID="iptLabel" runat="server"><%# Eval("your_data_field") %></label> 
       <br /> 
      </ItemTemplate> 
     </asp:Repeater> 

Codebehind:

Private Sub rptItems_ItemDataBound(ByVal sender As Object, ByVal e As System.Web.UI.WebControls.RepeaterItemEventArgs) Handles rptItems.ItemDataBound 
    Dim checkBox As HtmlInputCheckBox = DirectCast(e.Item.FindControl("iptCheckBox"), HtmlInputCheckBox) 
    Dim label As HtmlControl = DirectCast(e.Item.FindControl("iptLabel"), HtmlControl) 

    label.Attributes.Add("for", checkBox.ClientID) 
End Sub 
15

fin tengo la respuesta que he estado buscando!

El control asp.net CheckboxList hace de hecho representa el atributo de valor en HTML - ¡ha estado trabajando para mí en un sitio de producción durante más de un año!(SIEMPRE tenemos EnableViewState desactivado para todos nuestros sitios y todavía funciona, sin ningún tipo de ajustes o hacks)

Sin embargo, de repente, dejó de funcionar un día, y nuestras casillas CheckboxList ya no estaban representando su atributo de valor en HTML! WTF dices? ¡Nosotros también! Nos tomó un tiempo resolver esto, pero como había estado funcionando antes, sabíamos que tenía que haber una razón. La razón fue un cambio accidental en nuestra web.config!

<pages controlRenderingCompatibilityVersion="3.5"> 

Eliminamos este atributo de la sección de configuración de páginas y eso fue suficiente.

¿Por qué es esto así? Reflexionamos el código para el control CheckBoxList y encontramos esto en el método RenderItem:

if (this.RenderingCompatibility >= VersionUtil.Framework40) 
{ 
    this._controlToRepeat.InputAttributes.Add("value", item.Value); 
} 

hermanos y hermanas dev Queridísimos no se desespere! ¡TODAS las respuestas que busqué aquí en Stackexchange y el resto de la web dieron información errónea! A partir de .Net 4.0 asp.net hace que el atributo de valor de las casillas de verificación de un CheckBoxList:

<input type="checkbox" value="myvalue1" id="someid" /> 

Tal vez no sea útil en la práctica, Microsoft le dio la posibilidad de añadir un "controlRenderingCompatibilityVersion" a su web.config para convertir este off configurando una versión inferior a 4, que para nuestros propósitos es completamente innecesaria y de hecho nociva, ya que el código javascript se basó en el atributo de valor ...

Estábamos obteniendo chk.val() igual a "on" para todas nuestras casillas de verificación, que es lo que originalmente nos alertó sobre este problema en primer lugar (usando jquery.val() que obtiene el valor de la casilla de verificación. Se activa "activado" el valor de una casilla de verificación que está marcada ... Aprende algo cosa todos los días).

+0

NO pida a las personas que voten/acepten su respuesta. [Meta post sobre cómo marcar estos comentarios] (http://meta.stackexchange.com/questions/167155/comments-asking-for-upvotes) –

+2

Sé que esta es una pregunta muy antigua, pero se ha guardado el pelo en mi cabeza. Me he estado arrancando los pelos por 4 horas debido a esto. Gracias a este pequeño cambio todo funciona. ¡ESTA ES LA MEJOR RESPUESTA PARA ESTA PREGUNTA! – Misiu

+1

¿La eliminación del atributo controlRenderingCompatibilityVersion tiene algún efecto secundario en otros componentes .NET? –

0

La eliminación de <pages controlRenderingCompatibilityVersion="3.5"> provocó un problema en algún código anterior en el que estaba trabajando. Me estaba poniendo this error. Una vez que obtuve ese error, me di cuenta de que era demasiado arriesgado para un cambio.

Para solucionar este problema, que terminó extendiéndose CheckBoxList y reemplazando el método Render añadir un atributo adicional que contiene el valor a cada elemento de la lista:

public class CheckBoxListExt : CheckBoxList 
{ 
    protected override void Render(HtmlTextWriter writer) 
    { 
     foreach (ListItem item in this.Items) 
     { 
      item.Attributes.Add("data-value", item.Value); 
     } 

     base.Render(writer); 
    } 
} 

Esto hará que el atributo data-value en el span etiqueta externa.

0
Easy Way I Do It. 

//First create query directly From Database that contains hidden field code format (i do it in stored procedure) 

SELECT Id,Name + '<input id="hf_Id" name="hf_Id" value="'+convert(nvarchar(100),Id)+'" type="hidden">' as Name FROM User 

//Then bind checkbox list as normally(i bind it from dataview). 

cbl.DataSource = dv; 
cbl.DataTextField = "Name"; 
cbl.DataValueField = "Id"; 
cbl.DataBind(); 

//Then finally it represent code as follow. 

<table id="cbl_Position" border="0"> 
<tbody> 
<tr> 
<td> 
<input id="cbl_0" name="cbl$0" type="checkbox"> 
<label for="cbl_0"> 
ABC 
<input id="hf_Id" name="hf_Id" value="1" type="hidden"> 
</label> 
</td> 
</tr> 
</table> 

This way you can get DataValueField as inside hiddenfield and also can get it value from client side using javascript. 
Cuestiones relacionadas