Ontextchanged called several times - autopostback

Question

I’ve got, like, 50 Textboxes with this guy:

<asp:TextBox ID="txt_DetImovel0" runat="server"  AutoPostBack="true" OnTextChanged="txt_DetImovel0_TextChanged"></asp:TextBox>
<asp:TextBox ID="txt_DetImovel1" runat="server"  AutoPostBack="true" OnTextChanged="txt_DetImovel0_TextChanged"></asp:TextBox>
<asp:TextBox ID="txt_DetImovel2" runat="server"  AutoPostBack="true" OnTextChanged="txt_DetImovel0_TextChanged"></asp:TextBox>

I have a javascript function that changes the Textbox value when it selects a color (Color Picker)

The problem is that in debug mode I realize that this function "txt_DetImovel0_TextChanged" is being called one for each field! same as the . js is only changing 1 field. (I put an Alert('test'); and it only really appears once, but when I am debugging I see that it is called several times.

Doubts:

Is there any way I know or monitor who is triggering this function? whereas in debug mode I only see the actions of code Behind.

How to do for only the field that has the value modified by . js actually call this function.?

NOTE: I found that when I have autopostback=true it will really send to each field, even if I only changed the value of 1 field!! This is a . NET BUG ?

the image below shows what cadas textbox does, it is the color selector, every time you change the color it gets the value.

---

Complement of codes to facilitate understanding. There is a step that it mounts some JS to be triggered as soon as it changes the value of Textbox:

txt.Append(@"<script type=text/javascript>");
txt.Append("Corescolhe(" + txt_DetImovel0.ClientID + ");");
txt.Append("Corescolhe(" + txt_DetImovel1.ClientID + ");");
txt.Append("Corescolhe(" + txt_DetImovel2.ClientID + ");");
txt.Append("Corescolhe(" + txt_DetImovel3.ClientID + ");");
txt.Append("Corescolhe(" + txt_DetImovel4.ClientID + ");");
txt.Append("Corescolhe(" + txt_DetImovel5.ClientID + ");");
txt.Append("Corescolhe(" + txt_DetImovel6.ClientID + ");");
txt.Append("Corescolhe(" + txt_DetImovel7.ClientID + ");");
txt.Append("Corescolhe(" + txt_DetImovel8.ClientID + ");");
txt.Append("Corescolhe(" + txt_DetImovel9.ClientID + ");");
txt.Append("</script>");

and the JS

function Corescolhe(elemento) {
    $(elemento).spectrum({
        showPaletteOnly: false,
        className: "full-spectrum",
        showInitial: true,
        chooseText: "OK",
        cancelText: "cancelar",
        showPalette: true,
        preferredFormat: "hex",
        localStorageKey: "spectrum.demo",
        move: function (color) {
            updateBorders(color);
        },
        hide: function (color) {
            updateBorders(color);
            //  alert('irá mudar');
            $(elemento).val(color);
        }
};

But the problem is that the JS really changes only the Textobox X but all Textbox trigger autopostBack at the same time, if I am debugging, I see that the function txt_DetImovel0_TextChanged is called once for each component and not for which it was just changed the value!

Answer 1

In Webforms, you have a form with several controls.

When you set the autopostback on one of the controls, it means that the entire form will be posted when one of the assimilated events occurs in the control.

This is not a bug, it is the default behavior of Webforms.

In your case, I suggest removing autopostback and events from all text boxes and adding a button at the end of the form to save. By clicking this button, all the form fields will be sent, but at once only.