CODEWITHSUNDEEP
jquerycsshtml
kirby
kirby

Reputation: 4041

How to put a div inside a textbox

Part of asking a question on SO is typing tags. When you type a tag and click it, a div goes into the textbox. (at least that's what i think is happening). How can i put a div inside a textbox like that? Currently I can only change the value of the textbox to the dropdown item using this:

JQUERY:

$('.item_display').click(function(){
$('#Result').css("display" , "none");
var item = $(this).text();

$('#userInput').val(item);
});

HTML:

<input type='text' id='userInput' autocomplete='off' /> 
<div id='Results'></div>  //this is the dropdown menu where .item_display appears

Upvotes: 3

Views: 4531

Answers (1)

Nick Bork
Nick Bork

Reputation: 4841

The plugin Chosen is a good example of how to do this. The idea is what appears to be a text box really isn't. A container DIV spans the width of your desired element. A textbox sits to the left and spans the width of your area. As you type and add elements, new divs appear to the left of the textbox pushing the textbox right and re-scaling the width. There probably are may implementations of this in various plugins but I've worked with Chosen,

http://harvesthq.github.com/chosen/

Upvotes: 5

Related Questions