Solved

Return to TAB on .php Form

Posted on 2013-06-12
18
512 Views
Last Modified: 2013-06-13
Hello

Please see the attached code for a simple form, it has the following fields:

Cabinet_Name
Cabinet_U_Height
Make
Model

The form works correct, the problem I have is that I want to use a handheld scanner for the input, which automatically insets a return, which submits the form.

I have looked at using JavaScript to change the event, but cannot get the code to work with the form.

Thank you

<?PHP
/*
Simfatic Forms Main Form processor script

This script does all the server side processing. 
(Displaying the form, processing form submissions,
displaying errors, making CAPTCHA image, and so on.) 

All pages (including the form page) are displayed using 
templates in the 'templ' sub folder. 

The overall structure is that of a list of modules. Depending on the 
arguments (POST/GET) passed to the script, the modules process in sequence. 

Please note that just appending  a header and footer to this script won't work.
To embed the form, use the 'Copy & Paste' code in the 'Take the Code' page. 
To extend the functionality, see 'Extension Modules' in the help.

*/

@ini_set("display_errors", 1);//the error handler is added later in FormProc
error_reporting(E_ALL & ~((defined('E_STRICT')?E_STRICT:0)|E_NOTICE));

require_once(dirname(__FILE__)."/includes/BC_Audit-lib.php");
$formproc_obj =  new SFM_FormProcessor('BC_Audit');
$formproc_obj->initTimeZone('default');
$formproc_obj->setFormID('a407bf43-6ad9-4502-b439-3a85797ff480');
$formproc_obj->setFormKey('b43c10ec-9b85-41a9-b56d-0f88794cfa74');
$formproc_obj->setLocale('en-GB','dd/MM/yyyy');
$formproc_obj->setEmailFormatHTML(true);
$formproc_obj->EnableLogging(false);
$formproc_obj->SetDebugMode(true);
$formproc_obj->setIsInstalled(true);
$formproc_obj->SetPrintPreviewPage(sfm_readfile(dirname(__FILE__)."/templ/BC_Audit_print_preview_file.txt"));
$formproc_obj->SetSingleBoxErrorDisplay(true);
$formproc_obj->setFormPage(0,sfm_readfile(dirname(__FILE__)."/templ/BC_Audit_form_page_0.txt"));
$formproc_obj->AddElementInfo('Cabinet_Name','text','');
$formproc_obj->AddElementInfo('Cabinet_U_Height','text','');
$formproc_obj->AddElementInfo('Make','text','');
$formproc_obj->AddElementInfo('Model','text','');
$formproc_obj->setIsInstalled(true);
$formproc_obj->setFormFileFolder('./formdata');
$formproc_obj->setFormDBLogin('mysql5.websitelive.net','BC_Audit','D5608D1A739C6C2AD564C73D02EE3A89','BC_Audit');
$formproc_obj->SetHiddenInputTrapVarName('t86c5cff731eb00b53f02');
$page_renderer =  new FM_FormPageDisplayModule();
$formproc_obj->addModule($page_renderer);

$admin_page =  new FM_AdminPageHandler();
$admin_page->SetPageTemplate(sfm_readfile(dirname(__FILE__)."/templ/BC_Audit_admin_page_templ.txt"));
$admin_page->SetLogin('BC_Audit','D5608D1A739C6C2AD564C73D02EE3A89');
$admin_page->SetLoginTemplate(sfm_readfile(dirname(__FILE__)."/templ/BC_Audit_admin_page_login.txt"));
$formproc_obj->addModule($admin_page);

$validator =  new FM_FormValidator();
$validator->addValidation("Cabinet_Name","required","Please fill in Cabinet_Name");
$validator->addValidation("Cabinet_U_Height","required","Please fill in Cabinet_U_Height");
$validator->addValidation("Cabinet_U_Height","numeric","The input for Cabinet_U_Height should be a valid numeric value");
$validator->addValidation("Make","required","Please fill in Make");
$validator->addValidation("Model","required","Please fill in Model");
$formproc_obj->addModule($validator);

$csv_maker =  new FM_FormDataCSVMaker(1024);
$csv_maker->AddCSVVariable(array('Cabinet_Name','Cabinet_U_Height','Make','Model'));
$formproc_obj->addModule($csv_maker);

$s_db_handler =  new FM_SimpleDB('BC_Audit');
$s_db_handler->AddField('Cabinet_Name','VARCHAR(50)');
$s_db_handler->AddField('Cabinet_U_Height','INT');
$s_db_handler->AddField('Make','VARCHAR(50)');
$s_db_handler->AddField('Model','VARCHAR(50)');
$formproc_obj->addModule($s_db_handler);

$tupage =  new FM_ThankYouPage(sfm_readfile(dirname(__FILE__)."/templ/BC_Audit_thank_u.txt"));
$formproc_obj->addModule($tupage);

$uniqueid_s =  new FM_ShortUniqueID('BC_Audit');
$formproc_obj->AddExtensionModule($uniqueid_s);
$page_renderer->SetFormValidator($validator);
$formproc_obj->ProcessForm();

?>

Open in new window

0
Comment
Question by:Washcare
[X]
Welcome to Experts Exchange

Add your voice to the tech community where 5M+ people just like you are talking about what matters.

  • Help others & share knowledge
  • Earn cash & points
  • Learn & ask questions
  • 8
  • 7
  • 2
  • +1
18 Comments
 
LVL 58

Expert Comment

by:Gary
ID: 39242906
Cannot see any FORM in the code but you would normally add

onkeypress="return event.keyCode != 13;"

to the form element then the form can only be submitted by clicking the submit button
0
 

Author Comment

by:Washcare
ID: 39242949
GaryC123

Thank you for your comment, am I right in thinking that this will effectively void the return? In which case the next input box will not be selected?

I have had a look at the other code files which  Simfatic Forms creates, and I am wondering if it this code which needs amend?

Thanks

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd">
<html xmlns='http://www.w3.org/1999/xhtml'>
   <head >
      <meta http-equiv='Content-Type' content='text/html; charset=utf-8'/>
      <title >Form Page: BC_Audit</title>
      <script src='scripts/gen_validatorv5.js' type='text/javascript'></script>
      <script src='scripts/sfm_moveable_popup.js' type='text/javascript'></script>
      <script src='scripts/sfm-png-fix.js' type='text/javascript'></script>
      <link rel='stylesheet' type='text/css' href='style/BC_Audit.css'/>
   </head>
   <body style='background-color:transparent'>
      <form id='BC_Audit' method='post' action='%sfm_self_script%' accept-charset='UTF-8'>
         <div id='BC_Audit_errorloc' class='error_strings' style='width:300px;text-align:left'>%sfm_error_display_loc%</div>
         <div id='BC_Audit_outer_div' style='width:300px;height:400px'>
            <div style='position:relative' id='BC_Audit_inner_div'>
               <input type='hidden' name='sfm_form_submitted' value='yes'/>
               <div id='Cabinet_Name_container'>
                  <input type='text' name='Cabinet_Name' id='Cabinet_Name' value='%Cabinet_Name%' size='20' class='sfm_textbox'/>
               </div>
               <div id='Cabinet_U_Height_container'>
                  <input type='text' name='Cabinet_U_Height' id='Cabinet_U_Height' value='%Cabinet_U_Height%' size='20' class='sfm_textbox'/>
               </div>
               <div id='Make_container'>
                  <input type='text' name='Make' id='Make' value='%Make%' size='20' class='sfm_textbox'/>
               </div>
               <div id='Model_container'>
                  <input type='text' name='Model' id='Model' value='%Model%' size='20' class='sfm_textbox'/>
               </div>
               <div id='Submit_container'>
                  <input type='image' name='Submit' id='BC_Audit_Submit_img' src='images/BC_Audit-Submit-0.png' alt='submit'/>
               </div>
            </div>
         </div>
      </form>
      <script type='text/javascript'>
// <![CDATA[
sfm_fix_png("BC_Audit_Submit_img","images/spacer.gif");
if(document.sfm_after_load != undefined){document.sfm_after_load();}

// ]]>
      </script>
      <script type='text/javascript'>
// <![CDATA[
var BC_AuditValidator = new Validator("BC_Audit");

BC_AuditValidator.EnableOnPageErrorDisplay();
BC_AuditValidator.SetMessageDisplayPos("right");

BC_AuditValidator.EnableMsgsTogether();
BC_AuditValidator.addValidation("Cabinet_Name","req","Please fill in Cabinet_Name");
BC_AuditValidator.addValidation("Cabinet_U_Height","req","Please fill in Cabinet_U_Height");
BC_AuditValidator.addValidation("Cabinet_U_Height","numeric","The input for Cabinet_U_Height should be a valid numeric value");
BC_AuditValidator.addValidation("Make","req","Please fill in Make");
BC_AuditValidator.addValidation("Model","req","Please fill in Model");

// ]]>
      </script>
   </body>
</html>

Open in new window

0
 
LVL 58

Expert Comment

by:Gary
ID: 39242967
Yes it will disable using the return key in a form.

In which case the next input box will not be selected?
??? The return key would not pass focus to the next input anyway.

You would add the keypress above to the form element (as in the code you posted above) - this has nothing to do with PHP.

I know nothing about scanners so this is based on pure programming logic.
Maybe there is a way to change the scanner to send a TAB command instead of the RETURN command

Edit
A quick google search says it is possible depending on the scanner - lots of people asking.
If not with your scanner then we could amend the keyup, put it into a function and if the return key is detected then throw a tab response to your page - but if you can change the scanner then that would the most simple way to do it.
0
Resolve Critical IT Incidents Fast

If your data, services or processes become compromised, your organization can suffer damage in just minutes and how fast you communicate during a major IT incident is everything. Learn how to immediately identify incidents & best practices to resolve them quickly and effectively.

 

Author Comment

by:Washcare
ID: 39242984
GaryC123

Thank you, I am trying to code around the problem (if possible) as I cannot change the scanner settings. I'm also not a programmer, hence the use of a program to create the form.

So can I disable the return input, and also have a piece of code which would pass the focus on to the next input?

Thanks
0
 
LVL 58

Expert Comment

by:Gary
ID: 39243042
Afraid I'm gonna have to resort to jQuery for this - if you're happy with that then
Add a reference to the jquery library in your head section e.g.
<script src="//ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js"></script>


Before your closing BODY tag add

<script>
$('input').keypress(function(e) {
      if (e.keyCode==13) {
            e.preventDefault()
            $(this).next('input').focus();
      }
})
</script>


If you're happy using jquery I'll leave it at that else I'll try coding a vanilla javascript version tomorrow.
0
 
LVL 110

Expert Comment

by:Ray Paseur
ID: 39243043
... disable the return input, and also have a piece of code which would pass the focus...
Probably. Can you please post a link to the page in question so we can see the JS and the HTML?  I'm pretty sure GaryC123 is on the right track.
0
 
LVL 58

Expert Comment

by:Gary
ID: 39243051
Was going to edit to say, with plain old javascript I couldn't get a proper index that worked in all browsers, that's why I went with jQuery which worked out of the box for the index (or at least to move focus forward)
0
 
LVL 75

Expert Comment

by:Michel Plungjan
ID: 39243397
Gary: please add a caveat with the // protocol less load of jquery that from file system you MUST add the http: or https:
0
 

Author Comment

by:Washcare
ID: 39243622
Sorry, I had to goto bed last night, please see below of the URL:BC_Audit Form
0
 

Author Comment

by:Washcare
ID: 39243655
GaryC123

I have managed to add your code, which disables the return key (on my PC, not been able to test with the scanner yet), but does not move to the next input field have I misunderstood your code?

 $(this).next('input').focus();

Thanks
0
 

Author Comment

by:Washcare
ID: 39243705
Can know confirm that the code also works with the scanner, but with the current input box remaining the focus and not moving onto the next?

Thanks
0
 
LVL 58

Expert Comment

by:Gary
ID: 39244507
@ mplungjan
Gary: please add a caveat with the // protocol less load of jquery that from file system you MUST add the http: or https:
What do you mean? That's a perfectly valid format.

Looking at the code now.
0
 
LVL 75

Expert Comment

by:Michel Plungjan
ID: 39244536
If you have
<script src="//ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js"></script>
the code is not loading if you test from file system.
It MUST be
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js"></script>
while you test from file system since it will become
<script src="file://ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js"></script>

and fail
0
 
LVL 58

Accepted Solution

by:
Gary earned 500 total points
ID: 39244590
Change the script block to

<script>
$('input').keypress(function(e) {
      if (e.keyCode==13) {
            e.preventDefault()
            $(this).parent().next('div').find('input').focus();
      }
})
</script>
Also add a div container to
<div><input type='text' name='t86c5cff731eb00b53f02' id='t86c5cff731eb00b53f02'/></div>

Still half asleep to think thru the logic yet.
0
 
LVL 58

Expert Comment

by:Gary
ID: 39244609
Why would he be running a php from the filesystem...?
0
 

Author Comment

by:Washcare
ID: 39244683
GaryC123

Thank you so much for all your help. The solution I have accepted works as requested for keyboard input on the PC and via the Scanner on the PC!

I will raise a new question with regards to getting the same idea to work on webpage running on my iphone.

Thank you
0
 

Author Closing Comment

by:Washcare
ID: 39244685
Thanks so much!
0
 
LVL 58

Expert Comment

by:Gary
ID: 39244704
Should work on the iPhone as is.
0

Featured Post

Resolve Critical IT Incidents Fast

If your data, services or processes become compromised, your organization can suffer damage in just minutes and how fast you communicate during a major IT incident is everything. Learn how to immediately identify incidents & best practices to resolve them quickly and effectively.

Question has a verified solution.

If you are experiencing a similar issue, please ask a related question

Suggested Solutions

Title # Comments Views Activity
can i read my emails on lamp ftp 4 71
PHP Web Development 6 71
Windows 10, 64 bit WAMP - won't start 9 31
Change background images after 5 seconds. 12 48
This article discusses how to create an extensible mechanism for linked drop downs.
This article discusses how to implement server side field validation and display customized error messages to the client.
Learn the basics of strings in Python: declaration, operations, indices, and slicing. Strings are declared with quotations; for example: s = "string": Strings are immutable.: Strings may be concatenated or multiplied using the addition and multiplic…
Learn the basics of lists in Python. Lists, as their name suggests, are a means for ordering and storing values. : Lists are declared using brackets; for example: t = [1, 2, 3]: Lists may contain a mix of data types; for example: t = ['string', 1, T…

752 members asked questions and received personalized solutions in the past 7 days.

Join the community of 500,000 technology professionals and ask your questions.

Join & Ask a Question