Pages

Tuesday, 28 May 2013

Scroll to down in textarea with jQuery and Javascript


Below is the sample code to scroll down to the textarea using jquery  and javascript :


Code to scroll to down in textarea with jQuery and javascript  :
//using jquery
 var textArea = $('#textarea');
 textArea.scrollTop( textArea[0].scrollHeight - textArea.height()   );

//using javascript
var textarea = document.getElementById('textarea');
textarea.scrollTop = textarea.scrollHeight;


Click to jsfiddle with the example.

Note*: this example is tested on Google Chrome.

If you found this post useful.Please comment and Share. Thanks :)

Tuesday, 14 May 2013

Enter key event in jQuery

To capture key press event in jQuery we can have key press event and then we can get code of key which is pressed.

Below are few key codes
Enter : 13
Esc    : 27
Space: 32
Tab    : 9

check here for all key codes

Below example will handle the enter and esc key press event  using jquery :


$('#textarea').keyup(function(event){

//use event.which in firefox
var keycode = (event.keyCode ? event.keyCode : event.which);

        alert("Key code for pressed key "+keycode);

       //enter pressed
if(keycode == '13'){
//perform enter key press operation on textarea
}
       //esc pressed
        if(keycode == '27'){
//perform esc key press operation on textarea
}
});

Click to see demo in jsfiddle.


If you found this post useful please comment and share, Thanks :)

Sunday, 12 May 2013

Get value of selected option of Select Box in jQuery


Goal : This tutorial will explain how to get the value of selected elements id,value and text of select box using jquery with example:


Below is the html code :

<select id="jqueryVersions" >
    <option>Select jquery version</option>
    <option id="id_1" value="value_1">Jqurey 1.9.1</option>
    <option id="id_2" value="value_2">Jqurey 1.8.1</option>
    <option id="id_3" value="value_3">Jqurey 1.7.1</option>
    <option id="id_4" value="value_4">Jqurey 1.6.1</option>
</select>    

Below is the jquery code to get the selected options value,text and id :

$("#jqueryVersions").change(function(){

        var selectedOption = $("#jqueryVersions :selected");
    
        var selectedText   = selectedOption.text());
        var selectedId       = selectedOption.attr("id");
        var selectedValue = selectedOption.val();
});


Click on this link to check demo

If you find this tutorial userful. please comment share this post. Thanks :)