CODEWITHSUNDEEP
javascriptphpjqueryhtml
Varuni N R
Varuni N R

Reputation: 802

value from span to input

I have value that is displayed in span tag. If i want to post the value i have to assign that value to an input. So this is the code i have written to assign value to input and trying to post that value. But when i alert the assigned value its showing as 

[object Object]

Pls check the code and correct me.

var value = $("#spanElement").text();
var lower=$("#inputElement").val(value);
alert(lower);

and i tried this also

var value = $("#spanElement").text();
var lower=$("#inputElement").val(value);
alert(lower);

Both the above code shows

[object Object]

Because of this i am not able to post values.

Upvotes: 5

Views: 4691

Answers (6)

Viral Solani
Viral Solani

Reputation: 840

You are getting 'Object Object' because lower is an object if you want to get the text you need to perform below actions.

var value = $("#spanElement").text();
var lower=$("#inputElement").val(value);
alert(lower.val());

Or 

var value = $("#spanElement").text();
var lower=$("#inputElement").val(value);
alert(lower.val());

Hope it helps !

Upvotes: 1

brk
brk

Reputation: 50291

This is because it will return a jQuery object . If you want to see the same text which is in the input you can either use .val() like answered previously or use like this

var value = $("#spanElement").text();
var lower=$("#inputElement").val(value);
alert($("#spanElement").prop('innerHTML'));

WORKING DEMO

Upvotes: 1

Amit Rajput
Amit Rajput

Reputation: 2059

Just do in this way..

var span_text = $("#spanElement").text(); //get span text
$("#inputElement").val(span_text); //set span text to input value
var input_value = $("#inputElement").val(); //get input value
alert(input_value); //alert input value

Hope this will help

Upvotes: 1

liusy182
liusy182

Reputation: 205

"lower" is an object. if you want to see the text inside, you need to call lower.val(). e.g.

var value = $("#spanElement").text();
var lower=$("#inputElement").val(value);
alert(lower.val());

Upvotes: 2

Pupil
Pupil

Reputation: 23958

jQuery supports chaining objects return.

So, whenever you do an operation on an object (except some like .val() getter, it returns object of that selector element.

So, you can do much more operations in a single statement.

In your statement,

var lower=$("#inputElement").val(value);
alert(lower);,

It is returning the object of element #lower.

You can add more operations to it.

For example:

var lower=$("#inputElement").val(value).css('color', 'red');

You want only plain value.

So, rather you should do this:

var value = $("#spanElement").text();
$("#inputElement").val(value);
var lower=$("#inputElement").val();
alert(lower);

Upvotes: 1

void
void

Reputation: 36703

That is because the value setter function on an input return the jQuery object of that input element only, it allows you to chain the event.

Try this

var value = $("#spanElement").text();
var lower=$("#inputElement").val(value);
alert(lower.val());

Read more about it here http://api.jquery.com/val/#val-value

Upvotes: 4

Related Questions