How do I add text inside of an input field using jQuery?

Question

This should be easy, but nothing seems to work. I have a jQuery function that contains two parameters. The first parameter (pageID) is supposed to be inserted into a hidden field. It works correctly. I want the second parameter to be inserted into an html input field. That is, I want to see the contents of the parameter 'pageName' inside the form field as if I had just typed it in myself. Here is the code:

function insertIntoHiddenField(pageID,pageName)
{
    $('input[name=page_id]').val(pageID);
    $('input[name=page_name]').val(pageName);
}

When I look at the source code, I find that the value attribute in the input tag contains the value from the parameter 'pageName'. But, the input field itself is empty. I want to see that value in the input field. What am I doing wrong?

By the way, I also tried (without success) the following:

$('input[name=page_name]').text(pageName);
$('input[name=page_name]').innerhtml(pageName);
$('input[name=page_name]').append(pageName);

Can you post a demo to reproduce this problem? Because your code looks like it should work, so I strongly suspect that something else is happening. — David Thomas
– David Thomas, Commented Mar 18, 2012 at 7:57

Starx · Accepted Answer · 2012-03-18 08:00:24Z

2

Give an id to the hidden element. Just to be on the safe side and use .val()

$('#page_name').val('newtext');
$('#page_id').val('newtext');

Demo

However, your method works perfectly for me. Check here

edited Mar 18, 2012 at 8:00

answered Mar 18, 2012 at 7:54

Starx

79.3k50 gold badges187 silver badges266 bronze badges

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

4 Comments

Blender Over a year ago

That's not really the safe side. That's the only side ;)

Royi Namir Over a year ago

and how this answers his question ?

Starx Over a year ago

@RoyiNamir, It provides an alternative to his how to add text question and tell him that his method are also working at the same time.

John Anderson Over a year ago

Thanks! Using an id instead of the name attribute made it work. Not sure why, but it works!

gayavat · Accepted Answer · 2012-03-18 08:02:06Z

0

Check your input html is valid, this example works.

<input name="page_name" type="text" value="">

$("input[name=page_name]").val() == "" // true
$("input[name=page_name]").val("a")
$("input[name=page_name]").val() == "a" // true

answered Mar 18, 2012 at 8:02

gayavat

19.5k11 gold badges49 silver badges60 bronze badges

Collectives™ on Stack Overflow

How do I add text inside of an input field using jQuery?

2 Answers 2

Demo

4 Comments

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

4 Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Related