title: How to change cursor position in textarea, when language is changed?
body: <p>I have a <code>textarea</code> which can take both English and Arabic language.</p>
  
  <p>The English language starts from left to right. So, the cursor should begin in the left.</p>
  
  <p>The Arabic language starts from the right. So the cursor should begin in the right.</p>
  
  <p>How can I change the position of the cursor when the user changes his language? If his language is English the cursor should be on the left and vice-versa. </p>
  
  <p>The user can change his language using <code>ALT + SHIFT</code> in the keyboard. </p>
  
  <p>I have tried this, but it didn't give me any result.</p>
  
  <pre><code>&lt;textarea class="form-control description arabic" id="txt_desc" name="txt_desc" 
            placeholder="Description"&gt;&lt;/textarea&gt;
  
  .arabic{text-align:right;}
  
  &lt;script type="text/javascript"&gt;
      jQuery(document).ready(function($) {
          var reverseFunc = function() {
              $('textarea').each(function() {
                  if($(this).hasClass('arabic')) {
                      // do the invert magic...
                      var val = $(this).val();
                      var newVal = val.charAt(val.length-1) + substr(0, val.length-1);
                      $(this).val(val);
                  }
              });
          }
  
          $('textarea').bind('keyup', reverseFunc);
      });
  &lt;/script&gt;
  </code></pre>
  
  <p>using shiftkey:</p>
  
  <pre><code>var x = document.getElementById("txt_desc");
      if (event.shiftKey) {
          document.getElementById('txt_desc').style.direction="rtl";
      }else{
           document.getElementById('txt_desc').style.direction="ltr";
      }
  </code></pre>