How to change value in textbox with JQuery Ajax?

Question

I'm currently working on an ajax call that will update the value of a textbox:

<div id="PNIncrementDiv" style="position:absolute; left: 730px; top: 15px; width: 350px;" class="">

 <input id="TBIncrementTextBox"  class="textbox" type="text" style="position:absolute; top:25px; left: 75px; width: 60px; height: 40px;" runat="server"  />

</div>

My ajax function, which returns an integer, and Is tested to be returning the correct answer is below:

getIncrement: function (id) {
                $.ajax({

                    url: "<%=Session("BaseUri")%>" + '/handlers/DataEntry/SPC_InspectionInput.ashx',
                    type: 'GET',
                    data: { method: 'getIncrement', args: { IncrementId: id} },
                    success: function (data) {
                        console.log(data);
                        Inc_Num = data;
                        $('#TBIncrementTextBox').val(data.toString());//nothing happens!

                    },
                    error: function (a, b, c) {
                        alert(c);
                    }
                });

            }

However, when I try to change the value of the textbox, nothing happens. What am I doing wrong?

Are you sure the AJAX request is actually being made, and is successful? Check the console as you most likely have some errors which need to be diagnosed andfixed — Rory McCrossan
– Rory McCrossan, Commented Oct 9, 2017 at 14:46
The URL starts with " and finishes with ', but i think this is not a problem — Gaetano Piazzolla
– Gaetano Piazzolla, Commented Oct 9, 2017 at 14:49
@Gaetano It's two separate strings. The first is delimited with ", the second with '. It's confusing, but it's valid. I agree it should be changed though. There's no need to append the strings at all as the first value is coming from the server. — Rory McCrossan
– Rory McCrossan, Commented Oct 9, 2017 at 14:49
I just noticed your runat="server" attribute at the end of the element. That's the problem. If you check the HTML source in your browser you'll see that the id has been changed at runtime by ASP.Net. You need to retrieve the element using the ClientID property instead - or use a class. — Rory McCrossan
– Rory McCrossan, Commented Oct 9, 2017 at 14:53

Dharman · Accepted Answer · 2020-01-26 22:04:40Z

2

try to use value method

$('#TBIncrementTextBox')[0].value = data.toString()

getIncrement: function (id) {
            $.ajax({

                url: "<%=Session("BaseUri")%>" + '/handlers/DataEntry/SPC_InspectionInput.ashx',
                type: 'GET',
                data: { method: 'getIncrement', args: { IncrementId: id} },
                success: function (data) {
                    console.log(data);
                    Inc_Num = data;
                    $('#TBIncrementTextBox')[0].value = data.toString();//nothing happens!

                },
                error: function (a, b, c) {
                    alert(c);
                }
            });

        }

edited Jan 26, 2020 at 22:04

Dharman♦

33.9k27 gold badges106 silver badges157 bronze badges

answered Oct 9, 2017 at 14:50

Artur Brzozowski

3431 silver badge12 bronze badges

Sign up to request clarification or add additional context in comments.

3 Comments

Rory McCrossan Over a year ago

This will result in a syntax error as a jQuery object has no value property

Artur Brzozowski Over a year ago

thanks Rory I've just fixed it and tested. But the best would be to get working code to find out if there is anything else wrong

Rory McCrossan Over a year ago

At least you've fixed the error, but this is now logically identical. If the original didn't work, then there's no reason this would either.

Etienne Gros · Accepted Answer · 2017-10-09 14:58:57Z

0

Try targeting the input box using $('#PNIncrementDiv input').val(data.toString()); If that works, your ASP.NET script is most likely altering your target input's ID

answered Oct 9, 2017 at 14:58

Etienne Gros

421 gold badge1 silver badge3 bronze badges

Collectives™ on Stack Overflow

How to change value in textbox with JQuery Ajax?

2 Answers 2

3 Comments

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

3 Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Related