patternjavascriptMinor
Basic form validation
Viewed 0 times
formvalidationbasic
Problem
Question + Desired Outcome
The code below works currently, however I'm not convinced the utilisation of an
Desired Outcome: When a response is submitted on FormB, validate data on FormA to ensure entries have been at least some input on each field.
Background
We're using a support ticketing system within our organisation which thus far is working pretty well. One minor niggle however is that the 'View Ticket' page separates "Important Ticket Variables" (assigned technician, ticket category etc.) - from the "Reply to Ticket" form. Two forms, one page. Validation for both forms happens post-submit on the next page, again each is separate from the other.
In theory, that method makes sense. However, as they are two separate forms, what this often means is that people are able to bypass often-critical data from the "important ticket variables", and just add a reply. An element of human-training exists here but as ever, a programmatic change will satisfy the need for consistency.
Save for rewriting the whole process to resolve this issue, I've looked at putting in a fairly simple JS "overlay" on the view ticket page, so that when they submit a "Reply to ticket" - it does a quick verification to make sure all the 'Important Ticket Variables' have some form of entry. It's a quick fix but comes with some (for me) interesting challenges.
Languages
The main application is written in PHP, using MySQL, complemented with jQuery v1.3.2.
Constant
"Important ticket variables" always have a name= of
Not all
The code below works currently, however I'm not convinced the utilisation of an
Array to iterate through numerous non-existent form fields is anywhere near efficient enough for my liking. Can this process be improved to effectively eliminate the first step in the Suggested Solution?Desired Outcome: When a response is submitted on FormB, validate data on FormA to ensure entries have been at least some input on each field.
Background
We're using a support ticketing system within our organisation which thus far is working pretty well. One minor niggle however is that the 'View Ticket' page separates "Important Ticket Variables" (assigned technician, ticket category etc.) - from the "Reply to Ticket" form. Two forms, one page. Validation for both forms happens post-submit on the next page, again each is separate from the other.
In theory, that method makes sense. However, as they are two separate forms, what this often means is that people are able to bypass often-critical data from the "important ticket variables", and just add a reply. An element of human-training exists here but as ever, a programmatic change will satisfy the need for consistency.
Save for rewriting the whole process to resolve this issue, I've looked at putting in a fairly simple JS "overlay" on the view ticket page, so that when they submit a "Reply to ticket" - it does a quick verification to make sure all the 'Important Ticket Variables' have some form of entry. It's a quick fix but comes with some (for me) interesting challenges.
Languages
The main application is written in PHP, using MySQL, complemented with jQuery v1.3.2.
Constant
"Important ticket variables" always have a name= of
ticket_fields[customXX], where XX is basically the id in the database, which at present means we're at an upper limit of around 60 at the moment, obviously this may increase in time as more ticket_fields are created!Not all
ticket_fields are used on every ticket, some tiSolution
I managed to get around a generic array by pulling out the numbers from the name= attribute on each form field with the following:
This makes it much friendlier, so rather than numArray having a ridiculous level of integers to iterate through, it gets exactly the right values from the form fields themselves every time. Also allows it to scale infinitely.
// Pulls numbers from submitted "ticket_fields" which are stored in the name= attribute.
// Used to iterate through the dynamically generated "ticket_fields"
var numArray = new Array();
$(':input[name^="ticket_fields"]').each(function(){
fieldId = $(this).attr('name').replace(/\D/g, "");
if ($.inArray(fieldId,numArray) > -1) { } else { numArray.push(fieldId); }
});This makes it much friendlier, so rather than numArray having a ridiculous level of integers to iterate through, it gets exactly the right values from the form fields themselves every time. Also allows it to scale infinitely.
Code Snippets
// Pulls numbers from submitted "ticket_fields" which are stored in the name= attribute.
// Used to iterate through the dynamically generated "ticket_fields"
var numArray = new Array();
$(':input[name^="ticket_fields"]').each(function(){
fieldId = $(this).attr('name').replace(/\D/g, "");
if ($.inArray(fieldId,numArray) > -1) { } else { numArray.push(fieldId); }
});Context
StackExchange Code Review Q#673, answer score: 3
Revisions (0)
No revisions yet.