更新面板 textchanged 问题 asp.net c#

Question

After leaving the textbox, I want it to focus on the next object. Or I want the button to work when I click the button. In the problem I'm having right now, I'm having the problem in the gif after leaving the textbox.

---

default.aspx

<asp:UpdatePanel ID="UpdatePanel1" UpdateMode="Conditional" runat="server">
    <ContentTemplate>
        <div class="form-group row">
            <label class="col-lg-2 col-form-label">İşlem Tutarı</label>
            <div class="col-lg-4">
                <asp:TextBox ID="txtTutar" CssClass="form-control form-control-sm price" AutoPostBack="true" placeholder="0,00 ₺" runat="server" OnTextChanged="txtTutar_TextChanged"></asp:TextBox>
            </div>
        </div>
        <div class="form-group row">
            <label class="col-lg-2 col-form-label">Tahsil Edilen Tutar</label>
                <div class="col-lg-4">
                    <asp:UpdatePanel ID="UpdatePanel2" runat="server">
                        <ContentTemplate>
                            <asp:TextBox ID="txtTahsilEdilen" AutoPostBack="true" CssClass="money form-control form-control-sm price" placeholder="0,00 ₺" runat="server" OnTextChanged="txtTahsilEdilen_TextChanged"></asp:TextBox>
                        </ContentTemplate>
                    </asp:UpdatePanel>
                </div>
        </div>
    </ContentTemplate>
    <Triggers>
        <asp:AsyncPostBackTrigger ControlID="txtTutar" EventName="TextChanged" />
    </Triggers>
</asp:UpdatePanel>

---

default.asp.cs

protected void txtTutar_TextChanged(object sender, EventArgs e)
{
    txtTutar.Text = FormatMoney(decimal.Parse(txtTutar.Text));
    txtTahsilEdilen.Text = txtTutar.Text;
}

Answer 1

I would do one of several things. First up, with the post back occurring (text changed), then when you click on another control - you would in theory have to click two times.

So, either remove the text changed post-back, and format the number WHEN done. if you really want this to occur during typing, then

If you using the ajax control toolkit, there is a really nice number/currency formatter.

if not, then consider a jQuery plugin - it will remove the need for a post-back, and you do this client side. there is a REALLY nice JavaScript library here for this:

https://robinherbots.github.io/Inputmask/

The other easy way - probably the least effort?

use a ajax call based on text changed. That will allow you to run the code behind for the one text box, and now update panel post-back will NOT occur.

So you could code out the textbox like this:

        <br />

        <asp:TextBox ID="TextBox2" runat="server" onchange="fixnum(this)"
            ClientIDMode="Static"
            ></asp:TextBox>
         
        <script>
            function fixnum(c) {
                tBox = $(c)
                  $.ajax({
                      type: "POST",
                      data: JSON.stringify({ v: tBox.val() }),
                      contentType: "application/json;charset=utf-8",
                      dataType: "json",
                      async: true,
                      url: "WebForm4.aspx/curFormat",
                      success: function (MyReturn) {
                          tBox.val(MyReturn.d);
                      },
                      failure: function () {
                          tBox.val("")
                      }
                  });
              }
        </script>

And in the web page, we have:

 using System.Web.Services;

And then a public web method, say like this:

    [WebMethod]
    public static string curFormat(string v)
    {
        Debug.Print("web call");

       v = String.Format("{0:#,##0.00}", double.Parse(v));
        return v;
    } 

So, now when you type in a number, and hit tab - we don't do a post-back but do get to run the code behind stub. In fact, you probably could wind up as a result removing the whole need for the update panel.