1

My problem is: after my code call the server and it return with the alteration that i need, my mask disappear. (this occur only with the mask inside the update panel)

PS: I tryed link my html code with the data, but i was unable to do it.

so just to show the ideia:

<ScriptManager>
    <UpdatePanel>
    <ContentTemplate>
        <Table>
            <asp:TextBox runat="server" ID="txtCnpj" CssClass="cnpj_m" MaxLength="50"/>
        </Table>
    </ContentTemplate>
    </UpdatePanel>
</ScriptManager>

In my code-behind I just hide and show some items. (It's an ascx control) and my javascript is this:


$(function () {
    $(".data_m").mask("99/99/9999");
    $(".telefone_m").mask("9999-9999");
    $(".dddtelefone_m").mask("(999) 9999-9999");
    $(".ddd_m").mask("(999)");
    $(".cep_m").mask("99999-999");
    $(".cpf_m").mask("999.999.999-99");
    $(".cnpj_m").mask("99.999.999/9999-99");
});

I'm using jQuery 1.5.1.

And the plugin Masked Input Plugin from digitalBush

Anyone has any idea how i can solve this?

PS2: my mask WORKS when i start the page, only stop after i call the server.

EDIT:

this is how i tryed update after load.



$(".rbToggle").live('change',function () {
    //$("#txtCpf").mask("999.999.999-99");
    //$("#txtCnpj").mask("99.999.999/9999-99");
    // Edit, i'm using the code below, i put the top as sample, but i guess it may be kind hard to ppl see this sometimes.
    $("#%= txtCpf.ClientID %>").mask("999.999.999-99");
    $("#%= txtCnpj.ClientID %>").mask("99.999.999/9999-99");
});

EDIT2: i forgot mentioning that without updatepanel, the mask and javascript work is perfect

Michel Ayres
  • 5,891
  • 10
  • 63
  • 97
  • Can you open your site in ff and show us Console Error information to see what is the problem? Also install firebug – nemke Mar 21 '11 at 19:23
  • Hi nemke =) thanks for the comment. i have ff and firebug already, but thanks for the tip, i appreciate xD. fb does not show errors, only some alerts about css (jquery-ui-css). – Michel Ayres Mar 21 '11 at 19:31
  • Check this link http://stackoverflow.com/questions/301473/rebinding-events-in-jquery-after-ajax-update-updatepanel I had the similar problem and I recall that I solved it with live() jquery method – nemke Mar 21 '11 at 19:39
  • Thanks nemke, i'll check. PS: i also have one problem similar and solved it with live(), but i tryed (like i told in my edit) and it didn't work at all. – Michel Ayres Mar 21 '11 at 20:04
  • @Nymos - in your edit you do not have valid selectors `$("#")` is not valid. – Josiah Ruddell Mar 21 '11 at 21:56
  • @Josiah Ruddell, thanks for show me that, but i don't know why, i can't use < as tag, when i do, it simple vanish with my code... i remove the < before the % to show it. – Michel Ayres Mar 22 '11 at 12:05

2 Answers2

6

You need to activate the masks each time the content is re-rendered. So when the update panel reloads, activate the masks again.

You can do this through the pageLoaded javascript method, through a RegisterStartupScript, or by placing the activation javascript within the partial view.

For example:

var prm = Sys.WebForms.PageRequestManager.getInstance();
prm.add_pageLoaded(function(){
    // global partial postback complete
    // add masks here
});
Josiah Ruddell
  • 29,697
  • 8
  • 65
  • 67
  • Hi Josiah, Thanks for the answer. i have tryed it. i'll edit my question with my tentative. but was in javascript =X – Michel Ayres Mar 21 '11 at 19:27
  • PS: i'm taking a look in the link that u suggest =) – Michel Ayres Mar 21 '11 at 19:33
  • Josiah, i'm trying your code, but i got the follow error: "Sys is not defined". any tips ? i'm searching by myself too. but some good help as yours as always welcome =) **EDIT:** i use exactly your code, and inside the masks in my function.js page. – Michel Ayres Mar 21 '11 at 20:28
0

I have put my masking bind in pageLoad function

<script type="text/javascript">
 function pageLoad() {
     $('.decimal_right').inputmask('decimal', {
         rightalign: true,
         allowminus: false
     });
 }
</script>
Ashi
  • 409
  • 3
  • 12