You can use $.select(); for fields in updating forms like changing names. On 05/23/2014 03:43 AM, Crístian Viana wrote:

A good usability practice is to leave the focus on the first editable field on a form. That way, the user can start typing immediately what they want without having to use the mouse to click on the input element.

Explicitely request focus to every form's first field. Some input elements did not have an ID; in those cases, the IDs were also added to the HTML code.

Signed-off-by: Crístian Viana <vianac@linux.vnet.ibm.com> --- ui/js/src/kimchi.guest_add_main.js | 1 + ui/js/src/kimchi.guest_edit_main.js | 1 + ui/js/src/kimchi.report_add_main.js | 1 + ui/js/src/kimchi.repository_add_main.js | 1 + ui/js/src/kimchi.repository_edit_main.js | 1 + ui/js/src/kimchi.storagepool_add_main.js | 1 + ui/js/src/kimchi.template_edit_main.js | 2 ++ ui/pages/guest-add.html.tmpl | 2 +- ui/pages/repository-add.html.tmpl | 2 +- 9 files changed, 10 insertions(+), 2 deletions(-)

diff --git a/ui/js/src/kimchi.guest_add_main.js b/ui/js/src/kimchi.guest_add_main.js index 2113099..0a4f5e6 100644 --- a/ui/js/src/kimchi.guest_add_main.js +++ b/ui/js/src/kimchi.guest_add_main.js @@ -77,6 +77,7 @@ kimchi.guest_add_main = function() {

$('#form-vm-add').on('submit', addGuest); $('#vm-doAdd').on('click', addGuest); + $('#guest-add-id-textbox').focus();

showTemplates(); }; diff --git a/ui/js/src/kimchi.guest_edit_main.js b/ui/js/src/kimchi.guest_edit_main.js index 0236e2d..3588dcc 100644 --- a/ui/js/src/kimchi.guest_edit_main.js +++ b/ui/js/src/kimchi.guest_edit_main.js @@ -225,4 +225,5 @@ kimchi.guest_edit_main = function() {

$(guestEditForm).on('submit', submitForm); $(saveButton).on('click', submitForm); + $('#guest-edit-id-textbox').focus(); }; diff --git a/ui/js/src/kimchi.report_add_main.js b/ui/js/src/kimchi.report_add_main.js index 8759c2b..f7f1b4b 100644 --- a/ui/js/src/kimchi.report_add_main.js +++ b/ui/js/src/kimchi.report_add_main.js @@ -43,4 +43,5 @@ kimchi.report_add_main = function() {

addReportForm.on('submit', submitForm); submitButton.on('click', submitForm); + nameTextbox.focus(); }; diff --git a/ui/js/src/kimchi.repository_add_main.js b/ui/js/src/kimchi.repository_add_main.js index 5dc84e5..4ee7a62 100644 --- a/ui/js/src/kimchi.repository_add_main.js +++ b/ui/js/src/kimchi.repository_add_main.js @@ -97,4 +97,5 @@ kimchi.repository_add_main = function() { };

$(addForm).on('submit', addRepository); + $('#repo_id').focus(); }; diff --git a/ui/js/src/kimchi.repository_edit_main.js b/ui/js/src/kimchi.repository_edit_main.js index 26d6c66..0b562ee 100644 --- a/ui/js/src/kimchi.repository_edit_main.js +++ b/ui/js/src/kimchi.repository_edit_main.js @@ -72,4 +72,5 @@ kimchi.repository_edit_main = function() {

$(editForm).on('submit', editRepository); $(saveButton).on('click', editRepository); + $('#repository-edit-name-textbox').focus(); }; diff --git a/ui/js/src/kimchi.storagepool_add_main.js b/ui/js/src/kimchi.storagepool_add_main.js index 86dbe7f..d37a37d 100644 --- a/ui/js/src/kimchi.storagepool_add_main.js +++ b/ui/js/src/kimchi.storagepool_add_main.js @@ -20,6 +20,7 @@ kimchi.storagepool_add_main = function() { kimchi.initStorageAddPage(); $('#form-pool-add').on('submit', kimchi.addPool); $('#pool-doAdd').on('click', kimchi.addPool); + $('#poolId').focus(); };

kimchi.initStorageAddPage = function() { diff --git a/ui/js/src/kimchi.template_edit_main.js b/ui/js/src/kimchi.template_edit_main.js index f0f4718..a0e9e28 100644 --- a/ui/js/src/kimchi.template_edit_main.js +++ b/ui/js/src/kimchi.template_edit_main.js @@ -177,4 +177,6 @@ kimchi.template_edit_main = function() { kimchi.message.error(err.responseJSON.reason); }); }); + + $('#template-edit-id-textbox').focus(); }; diff --git a/ui/pages/guest-add.html.tmpl b/ui/pages/guest-add.html.tmpl index 84a1994..e478b2e 100644 --- a/ui/pages/guest-add.html.tmpl +++ b/ui/pages/guest-add.html.tmpl @@ -37,7 +37,7 @@ <p class="text-help"> $_("The name used to identify the virtual machine. If omitted, a name will be chosen based on the template used.") </p> - <input type="text" class="text" style="width: 300px" name="name"> + <input type="text" class="text" style="width: 300px" name="name" id="guest-add-id-textbox"> </div> </section> <section class="form-section"> diff --git a/ui/pages/repository-add.html.tmpl b/ui/pages/repository-add.html.tmpl index 05b4de9..9a8a037 100644 --- a/ui/pages/repository-add.html.tmpl +++ b/ui/pages/repository-add.html.tmpl @@ -39,7 +39,7 @@ $_("Single word, unique identifier for the repository.") </p> <div class="textbox-wrapper"> - <input type="text" class="text" name="repo_id" /> + <input type="text" class="text" name="repo_id" id="repo_id" /> </div> </div> </div>