jueves, 27 de junio de 2013

JQuery con RadioButtonList

Lo primero es crear una pagina en ASPX, agregaremos un RadioButtonList y un boton que capturara el val con un pequeño JavaScript del lado del cliente. En codigo de diseño de la pagina aspx añadiremos el siguiente codigo

<asp:RadioButtonList ID="RadioButtonList1runat="serverRepeatDirection="Horizontal">
            <asp:ListItem Value="1">UNO</asp:ListItem>
            <asp:ListItem Value="2">DOS</asp:ListItem>
</asp:RadioButtonList>
<input id="Button2type="buttonvalue="buttononclick='Valor()' />

Luego con el siguiente script obtendremos el value del RadioButtonList seleccionado. No olvides de agregar la libreria Jquery.

<script>
             function Valor()
            {
                alert('a');
                alert(String($('#<%=RadioButtonList1.ClientID %> input:checked').val()));
                alert($('#<%= RadioButtonList1.ClientID %>').find('input:checked').val());
                alert($('#<%=RadioButtonList1.ClientID %> input[type=radio]:checked').val());
                alert($('#<%=RadioButtonList1.ClientID %> input[type=radio]:checked').val());
                var ad=$('input[name=RadioButtonList1]:checked').val();
                alert(ad);
            }  
</script>


Bloquear pantalla con JQUERY y ASP NET

Creamos el div que bloqueara la pantalla al hacer click sobre el boton servidor

<div id='Recarga' style="display:none;background-color:Gray;color:White; position:absolute;  width:100%;height:100%;z-index:10000; margin:0px; filter:alpha(opacity=60);-moz-opacity:.60;opacity:.60">
            <center>
                <table width='100%' height='100%' >
                    <tr>
                        <td valign="middle" align="center"><div style="font-size:20pt; font-weight:bold; font-family:Verdana; color:White">Espere un momento por favor...</div></td>
                    </tr>
                </table>
            </center>
 </div>

La tabla contenido del formulario:

<TABLE id="Table1" height="500" cellSpacing="1" cellPadding="1" width="790" border="0">
 <TR>
   <TD>COLUMNA 1
   </TD>
   <TD>COLUMNA 2
   </TD>
 </TR>
</TABLE>
<asp:Button id="btn_generar" runat="server" Text="Generar"></asp:Button>

El script que mostrara el div bloqueador, y ocultara la tabla:

           $(function(){
    $("[id$='btn_generar'],[id$='imb_imprimir']").click(function()
                    {
                        $('#Table1').hide();
                        $('#Recarga').show();
                    });  
                   
            });

Programando en el botón servidor "btn_generar" doble click sobre el mismo

System.Threading.Thread.Sleep(2000);

Esto hará que el botón tarde 2 segundos en responder, solo es para ver mejor el ejemplo.