I have a form with multiple fields and I want the option of the user to insert a comment in the value of the field.
Example:
<form>
<input type='text' id='campo'>
<input type='hidden' id='comentario'>
<submit>
</form>
What I want to do is that by right-clicking on input[id=campo] it shows a balloon to place a text and that text will stay in value of my input[id=comentario] field.
Can anyone give me an example of how to do this?
I made small modifications to the JsFiddle of the commented response.
HTML:
<div class="content">
<input type="text" placeholder="Clique aqui com o botão direito para comentar" />
<div id="comentario" style="display:none">
<form>
<textarea></textarea>
<button type="submit">Enviar</button>
</form>
</div>
</div>
JavaScript:
$("div.content").oncontextmenu = function() {return false;};
$('input[type=text]').mousedown(function(e){
e.preventDefault();
if( e.button == 2 ) {
$('#comentario').show();
}
return false;
});