none
Selecionando Elementos no User Control utilizando Java Script (Expor Propriedades de CheckBox) RRS feed

  • Pergunta

  • Eu tenho um formulário web e  que contém um usercontrol e eu gostaria de ser capaz de acessar os elementos HTML dentro do usercontrol na página de formulário usando javascript.

    Estou usando VB.NET

    Eu tentei o seguinte:

    document.getElementById('<%= MeuCheckBox.clientid %>')

    Pesquisando Por aqui eu descobri

    A solução é expor os elementos, ou apenas as ClientIDs dos elementos que você precisa, através das propriedades do usercontrol. Então você pode usar os ClientIDs em JavaScript como você quer.

    A minha pergunta é: Como expor em VB.NET as propriedades dos elementos de um UserControl ?

    sábado, 28 de julho de 2012 11:52

Respostas

  • Pessoal conseguir chegar a uma solução:

    Dentro da Minha Pagina do UserControl "MeuUserControl.ascx" eu adicionei as propriedades ReadOnly para Alguns elementos e conseguir ver as suas propriedades na Pagina Mestre tbm conhecida como "Pagina Pai"

    * Codigo do User Control

        Public ReadOnly Property MeuCheckBoxProp() As System.Web.UI.WebControls.CheckBox
            Get
                Return MeuCheckBox
            End Get
        End Property

        Public ReadOnly Property MeuTextBoxProp() As System.Web.UI.WebControls.TextBox
            Get
                Return MeuTextBox
            End Get
        End Property

    * Codigo da Pagina Aspx

         MeuUserControl.MeuTextBox.Text

    ou

      MeuUserControl.MeuTextBox.Enable = False

    • Marcado como Resposta Amilton Costa quarta-feira, 8 de agosto de 2012 16:36
    quarta-feira, 8 de agosto de 2012 16:36

Todas as Respostas

  • Amilton. Não sei se vai te ajudar, mas fiz um exemplo assim, utilizando jquery jquery-1.4.1.min.js (O mesmo adicionado a solution pelo vs 2010):

    Espero que te ajude... Se for util, marque como tal.

    criei um usercontrol de nome PainelArquivos:

    <%@ Control Language="VB" AutoEventWireup="false" CodeFile="PainelArquivos.ascx.vb" Inherits="PainelArquivos" %>
    <div id="ppainelArquivosAnexos" style="display: block">    
        <table style="width: 100%">
            <tr>
                <td align="left" colspan="2">
                    <div style="overflow: auto; width: 100%; height: 250px;">
                        <table class="sofT" style="width: 100%">
                            <tbody id="Tbody1">
                                <asp:CheckBox ID="chkTesteUserControl" runat="server" Text="Este é apenas um teste de ckeckbox em usercontrol" />
                            </tbody>
                        </table>
                    </div>
                </td>
            </tr>
        </table>
    </div>

    criei uma pagina.aspx de nome Default.aspx: (Não coloquei muita coisa, mas coloquei o usercontrol na mesma)

    <%@ Page Language="VB" AutoEventWireup="false" CodeFile="Default.aspx.vb" Inherits="_Default" %>
    <%@ Register src="PainelArquivos.ascx" tagname="PainelArquivos" tagprefix="uc1" %>
    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
    <html xmlns="http://www.w3.org/1999/xhtml">
    <head runat="server">
        <title></title>
    </head>
    <body>
        <form id="form1" runat="server">
        <asp:ScriptManager ID="ScriptManager1" runat="server" AsyncPostBackTimeout="600"></asp:ScriptManager>
        <div>
            <uc1:PainelArquivos ID="PainelArquivos1" runat="server" />
        </div>
        <div>
            <asp:Button ID="btnSalvar" runat="server" Text="Salvar" onclick="btnSalvar_Click" />
        </div>
        <div>
            <asp:Button ID="btnSalvar2" runat="server" Text="Salvar2" onclick="btnSalvar2_Click" />
        </div>
        </form>
    </body>
    </html>

    Default.aspx.vb  (abaixo está um codigo "FindControlByType" que eu aproveitei de outro post, recomendo que o teste bem)
                      coloquei dois buttons na pagina, em um eu faço o checked=true do ckecbox, no outro, desabilito o checkbox;
     

    Partial Class _Default
        Inherits System.Web.UI.Page

        Protected Sub btnSalvar_Click(sender As Object, e As System.EventArgs) Handles btnSalvar.Click
            Dim CheckBoxPanel As Control = FindControlByType(GetType(CheckBox))
            If CheckBoxPanel IsNot Nothing Then
                ScriptManager.RegisterStartupScript(Me, Me.[GetType](), Guid.NewGuid().ToString(), ("try{top.$get(""" + CheckBoxPanel.ClientID & """).disabled = false; top.$get(""") + CheckBoxPanel.ClientID & """).checked = true;}catch(e){alert('erro');}", True)
            End If
        End Sub

        Protected Sub btnSalvar2_Click(sender As Object, e As System.EventArgs) Handles btnSalvar2.Click
            Dim CheckBoxPanel As Control = FindControlByType(GetType(CheckBox))
            If CheckBoxPanel IsNot Nothing Then

                ScriptManager.RegisterStartupScript(Me, Me.[GetType](), Guid.NewGuid().ToString(), "try{top.$get(""" + CheckBoxPanel.ClientID & """).disabled = true;}catch(e){alert('erro');}", True)
            End If
        End Sub

        ''' <summary>
        ''' encontra o primeiro objeto do tipo passado
        ''' </summary>
        ''' <param name="type">tipo à buscar</param>
        ''' <returns>objeto encontrado ou null caso não encontrado</returns>
        Private Function FindControlByType(type As Type) As Control
            Return FindControlByType(type, PainelArquivos1)
        End Function

        ''' <summary>
        ''' encontra o primeiro objeto do tipo passado
        ''' </summary>
        ''' <param name="type">tipo à buscar</param>
        ''' <param name="root">objeto à buscar</param>
        ''' <returns>objeto encontrado ou null caso não encontrado</returns>
        Private Function FindControlByType(type As Type, root As Control) As Control
            If root.GetType().Equals(type) Then
                Return root
            Else
                For Each obj As Control In root.Controls
                    Dim returnObj As Control = FindControlByType(type, obj)
                    If returnObj IsNot Nothing Then
                        Return returnObj
                    End If
                Next
            End If
            Return Nothing
        End Function
    End Class

    segunda-feira, 30 de julho de 2012 00:08
  • João boa noite, fiz o exemplo que vc me mandou mas não deu certo, o meu problema é que o HTML é totalmente carregado quando o javascript é executado. E quando isso acontece não existe qualquer elemento na página com o ClientID do usercontrol. e eu recebo nulo para o meu :

    document.getElementById('<%= MeuUserControl.MeuCheckBox.clientid %>')

    Sendo assim eu preciso expor o controle filho do meu checkbox para a pagina Pai, dessa forma eu consigo ver as propriedade desse controle.

    Pesquisando na Net tbm encontrei uma dica para  olhar em JQuery para que você possa obter o elemento desejado com um seletor simples mas não encontrei nada pratico. 

    terça-feira, 31 de julho de 2012 00:40
  • Pessoal conseguir chegar a uma solução:

    Dentro da Minha Pagina do UserControl "MeuUserControl.ascx" eu adicionei as propriedades ReadOnly para Alguns elementos e conseguir ver as suas propriedades na Pagina Mestre tbm conhecida como "Pagina Pai"

    * Codigo do User Control

        Public ReadOnly Property MeuCheckBoxProp() As System.Web.UI.WebControls.CheckBox
            Get
                Return MeuCheckBox
            End Get
        End Property

        Public ReadOnly Property MeuTextBoxProp() As System.Web.UI.WebControls.TextBox
            Get
                Return MeuTextBox
            End Get
        End Property

    * Codigo da Pagina Aspx

         MeuUserControl.MeuTextBox.Text

    ou

      MeuUserControl.MeuTextBox.Enable = False

    • Marcado como Resposta Amilton Costa quarta-feira, 8 de agosto de 2012 16:36
    quarta-feira, 8 de agosto de 2012 16:36