Insert Input Box Using .innerHTML property of jQuery

Question

I am using jQuery for the first time. I've been searching a lot but have not gotten the answer.

I want to insert an input Type at id="star" and with value="score Star" but I'm not able to do that. Score returns the numeric value. I think the problem is in the value attribute, but I don't know where. Thanks In Advance.

Here's the code:

<script type="text/javascript">
            $(function() {
                $('#click').raty({
                    click: function(score) {
                        document.getElementById('star').innerHTML="<input type='text' name='type' value='"score+ "' Star >";
                        //alert( 'score: ' + score);

                        }
                    });
                });
</script>



          <label>Deal Type:</label>
         <div id="click"></div><span  id="star"></span></div>

value='"score+ "' <--- you miss a '+'

Pablo Martinez
– Pablo Martinez

2012-12-13 18:14:12 +00:00
Commented Dec 13, 2012 at 18:14 — Pablo Martinez
– Pablo Martinez, Commented Dec 13, 2012 at 18:14

anuj arora · Accepted Answer · 2012-12-13 18:15:57Z

2

You're not writing the code correctly

.innerHTML="<input type='text' name='type' value='"score+ "' Star >";

It should be

.innerHTML="<input type='text' name='type' value='"+score+" Star' >";

answered Dec 13, 2012 at 18:15

anuj arora

83112 silver badges22 bronze badges

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

Comments

Adam Rackis · Accepted Answer · 2012-12-13 18:13:39Z

2

You're not concatenating the string, or quoting the value correctly

.innerHTML="<input type='text' name='type' value='"score+ "' Star >";

should be

.innerHTML="<input type='text' name='type' value='" + score + " Star' >";

answered Dec 13, 2012 at 18:13

Adam Rackis

83.5k57 gold badges281 silver badges402 bronze badges

1 Comment

Adam Rackis Over a year ago

@Asad - yeah, I got that in there while you were writing the comment

Talha Akbar · Accepted Answer · 2012-12-13 18:16:15Z

1

<script type="text/javascript">
            $(function() {
                $('#click').raty({
                    click: function(score) {
                        document.getElementById('star').innerHTML="<input type='text' name='type' value='"+score+ " Star'>";
                        //alert( 'score: ' + score);

                        }
                    });
                });
</script>



          <label>Deal Type:</label>
         <div id="click"></div><span  id="star"></span></div>

answered Dec 13, 2012 at 18:16

Talha Akbar

10.1k7 gold badges42 silver badges62 bronze badges

Comments

user1726343 · Accepted Answer · 2012-12-13 18:17:07Z

0

A better approach is to actually create an input DOM object and append it:

$('#star').append($('<input/>').attr({
    type: "text",
    name: "type",
    value: score + " Star"
}));

answered Dec 13, 2012 at 18:17

user1726343

Collectives™ on Stack Overflow

Insert Input Box Using .innerHTML property of jQuery

4 Answers 4

Comments

1 Comment

Comments

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

4 Answers 4

Comments

1 Comment

Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Related