jQuery - How to add event to control after DOM loading?

Asked

Viewed 53 times

2

I need to add a virtual keyboard after a validation in the codebehind. The control is invisible until this validation is true.

When I add the virtual keyboard with the control already visible on the screen, it works 100%. After validation is not working.

The scripts used are:

<link href="../../css/jquery-ui.css" rel="stylesheet" />
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.8/jquery.min.js"></script>
<script src="http://code.jquery.com/ui/1.10.3/jquery-ui.min.js"></script>   
<link href="../../css/keyboard.css" rel="stylesheet"/>
<script src="../../js/jquery.keyboard.js"></script>    
<link href="../../keyboard/demo.css" rel="stylesheet"/>
<script src="../../keyboard/demo.js"></script>
<script src="http://mottie.github.com/Jatt/js/jquery.jatt.min.js"></script> 
<script src="../../keyboard/jquery.chili-2.2.js"></script> 
<script src="../../keyboard/recipes.js"></script>

The control that is receiving the virtual keyboard is:

<asp:TextBox ID="txtEmailCliente" runat="server"></asp:TextBox>

The code that makes the virtual keyboard appear in the control is in the demo.js file and the code follows below:

    jQuery(function ($) {
    var configAlpha = {
        display: {
            'bksp': '\u2190',
            'accept': 'Concluido',
            'default': 'ABC',
            'shift': '\u21d1',
            'meta1': '.?123',
            'meta2': '#+='
        },
        layout: 'custom',
        customLayout: {
            'default': [
                'q w e r t y u i o p {bksp}',
                'a s d f g h j k l {enter}',
                '{s} z x c v b n m , . {s}',
                '{meta1} {space} {meta1} {accept}'
            ],
            'shift': [
                'Q W E R T Y U I O P {bksp}',
                'A S D F G H J K L {enter}',
                '{s} Z X C V B N M ! ? {s}',
                '{meta1} {space} {meta1} {accept}'
            ],
            'meta1': [
                '1 2 3 4 5 6 7 8 9 0 {bksp}',
                '- / : ; ( ) \u20ac & @ {enter}',
                '{meta2} . , ? ! \' " {meta2}',
                '{default} {space} {default} {accept}'
            ],
            'meta2': [
                '[ ] { } # % ^ * + = {bksp}',
                '_ \\ | ~ < > $ \u00a3 \u00a5 {enter}',
                '{meta1} . , ? ! \' " {meta1}',
                '{default} {space} {default} {accept}'
            ]
        }
    };      

    $('#txtEmailCliente').keyboard(configAlpha);    
});

Someone could tell me how to do it so that after clicking a certain button, do a validation and give txtEmailClient.Visible = true this virtual keyboard appears?

I’d have to bind the event to control somehow, someone knows how?

2 answers

0

You can perform this server-side validation through for example a button.

<input id="foo" runat="server" type="button" onserverclick="ex_OnClick" />

from the server side you would then create the method:

protected void ex_OnClick(object sender, EventArgs e)
{
//validacao e em seguida o seu txtEmailCliente.Visible = true

}
  • Lucas, the problem isn’t how to do the validation, it’s quiet. What I want to do is add the virtual keyboard to the control after this validation. It would have to be something via jQuery I think.

  • Your textbox is being rotated also on the server side, so it can also be manipulated there and arrow it to visible, in my view the only thing missing would be to put the Visible tag in your textbox to start by default as not visible: <Asp:Textbox ID="txtEmailCliente" runat="server" Visible="false"></Asp:Textbox>

  • Lucas, you don’t understand my problem, anyway, thank you.

0

found the solution to my problem. When there was a partial post in AJAX PANEL, the code below was losing the CSS classes.

$('#txtEmailCliente').keyboard(configAlpha); 

I made a change so that the DOM does not lose the CSS property of the control as below:

$(document).on('focus', '#txtEmailCliente', {}, function (e) {
    $(e.currentTarget).keyboard(configAlpha)
})

That way, even if you post the form, when you receive the Focus, the control will display the virtual keyboard.

I hope I could have helped with my doubt, but I had to research and put the solution for you.

Browser other questions tagged

You are not signed in. Login or sign up in order to post.