Home/ Questions/Q 8223841
In Process

The Archive Base Latest Questions

Editorial Team
  • 0
Asked: 2026-06-07T14:51:15+00:00

I have a form(HTML) in which I want to navigate through the elements using

  • 0

I have a form(HTML) in which I want to navigate through the elements using Enter Key (Enter Key should act like Tab). To achieve this functionality I have used the PlusAsTab library. Also I need autocomplete feature on one of the textbox. For AutoComplete Feature I am using TypeAhead from Twitter Bootstrap.

So I am using PlusAsTab and Twitter Bootstrap Together.
Now the PlusAsTab Navigation using the Enter Key is working fine with elements other then those associated with TypeAhead. For the Elements associated with TypeAhead I need to press the Enter twice to navigate. I tried to debug but not successful. I am quite new to Javascript hence not able to debug it properly.

Please find the code in JSFiddle.

I have attached the code here too for convenience

<!DOCTYPE html>
<html lang="en">
<head>
<title>Trial</title>
 <link href="http://twitter.github.com/bootstrap/assets/css/bootstrap.css" rel="stylesheet">
</head>

<body>

<div class="plus-as-tab form-inline" id="transtable">
<select class="span1" autofocus="autofocus"><option>Dr</option><option>Cr</option></select>
<select class="span4">
    <option>SelectAccount</option>
    <option>GodAccount</option>
    <option>SundryCreditors</option>
    <option>SundryDebtors</option>
    <option>Capital</option>
    <option>Cash</option>
    <option>Sales</option>
</select>
 <input type="text" class="span4" placeholder="Narration" style="margin: 0 auto;" data-provide="typeahead" data-items="4" data-source='["ChequeNo : ","Account No : ","No : ","On Canara Bank : " ]'>

<div class="input-prepend">
    <span class="add-on">Rs</span><input class="span3" size="12" type="text" onchange="nextrow(this)" onkeypress="return allowonlynum(event)">
</div>
    </div>

    <script src="http://code.jquery.com/jquery-latest.js"></script>
<script src="http://joelpurra.github.com/plusastab/lib/emulatetab/src/emulatetab.joelpurra.js"></script>
<script src="http://joelpurra.github.com/plusastab/src/plusastab.joelpurra.js"></script>
    <script src="https://raw.github.com/twitter/bootstrap/master/js/bootstrap-typeahead.js"></script>
    </body>
</html>
​

Please help me to debug this problem further.

Share

Leave an answer

You must login to add an answer.

Need An Account,

1 Answer

  1. Editorial Team

    With the help of my Friend I have temporarily solved this problem. In the PlusAsTab library I have added one more call to focus the next element, ie., it will try to focus on the next element twice. I know this is not the right solution but it is solving my problem.

    • 0