Question

I have multiple divs and each div has a textbox and a label. and I need to populate some text in a label when textbox is on .focus

script so far:

 $(function () {
   $('input:text').focus(function () {
     //how do I get the current label and populate with some text? and when clicking on a 
    //different textbox, I want to clear the previous label and just show the current
    //div's label with some data
 });
});

e.g.

<div>
    @Html.TextBoxFor(model => model.Title)
    <label>
    </label>
</div>
<div>
    @Html.TextBoxFor(model => model.Name)
    <label>
    </label>
</div>
<div>
    @Html.TextBoxFor(model => model.Address)
    <label>
    </label>
</div>

thx!

Answer 1

Working example made for you:

http://jsfiddle.net/KhQtx/

HTML:

<div>
    <input type="text" title="Tittle" value=""/>
    <label>
    </label>
</div>
<div>
    <input type="text" title="Name" value=""/>
    <label>
    </label>
</div>
<div>
    <input type="text" title="Address" value=""/>
    <label>
    </label>
</div>​

JS:

$('input:text').focus(function () {
   // clean label
   $('input:text').next('label').html("");

   // get input title
   var title = $(this).attr('title');            

   // add html to label from input title
   $(this).next('label').html(title);
});​