Solved

Web validation on tabbed tables using javascript

Posted on 2003-12-12
9
455 Views
Last Modified: 2013-12-18

There must be a simple answer to this..!

I am trying to validate a form using Javascript.  The form has a tabbed table and on three of the tabs are fields that need to be validated.  If I am on tab a then it validates field a.  If I am on tab b it validates field b and so on.  However if I am in tab a it cannot find field b and an error message is generated (field is not an object message).

Generate HTML for all fields is enabled and the source shows all fields.

Any ideas?  One thought is having computed fields outside the tabbed table whose values pull in from field a, b etc.  But this seems daft - having to have two fields for each field I want to validate and I am not sure it would work anyway?

0
Comment
Question by:StuartCalam
9 Comments
 
LVL 19

Expert Comment

by:madheeswar
ID: 9927002
write a function and palce it in JSheader.

Then call that function in ur OnClick event of ut buttons.
0
 
LVL 19

Expert Comment

by:madheeswar
ID: 9927022
In JSHeader:
function f1(){
if(document.forms[0].name_x.value=="" ){
alert("Please enter your Name.")
document.forms[0].req1name_x.focus();
return false;
}
}

'============

and in Button onclick event,
f1()
0
 

Author Comment

by:StuartCalam
ID: 9927045
this is what I have

My button onclick event has the following...

if (Validation()) {
      document.forms[0].submit()
}


with the function in the JS Header...

function Validation() {

if (document.forms[0].AccountName.options[0].selected) {
alert("Please enter the Account this complaint is originating from");
document.forms[0].AccountName.focus();
return false;
}


The error message occurs when I am on a tab where the field AccountName is not displayed.
0
Master Your Team's Linux and Cloud Stack!

The average business loses $13.5M per year to ineffective training (per 1,000 employees). Keep ahead of the competition and combine in-person quality with online cost and flexibility by training with Linux Academy.

 
LVL 19

Expert Comment

by:madheeswar
ID: 9927103
is it a keyword field?
then use this:
document.forms.fieldname.options[document.forms.fieldname.selectedIndex].text

else

u can use mine as it is.
0
 
LVL 24

Assisted Solution

by:HemanthaKumar
HemanthaKumar earned 75 total points
ID: 9927933
The culprit in your code is

document.forms[0].AccountName.focus();

When the field is not visible you cannot use that method.. Either check to make sure that the field is available before you focus

so the script would become

if (document.forms[0].AccountName.type != "hidden") {document.forms[0].AccountName.focus();}


~Hemanth
0
 
LVL 31

Accepted Solution

by:
qwaletee earned 25 total points
ID: 9928781
Tabbed tabls are actually implemented as separate pages for each tab.  Each time you click a tab, data is submitted, and a new page loads.  The fields from the "inactive" tabs are still sent as hidden fields,so the data is not lost from click to click.

The problem is that you assume that to fix the error, the user will be able to just go right to the offending field and correct the problem.  Instead you need to be sensitive to which tab is active, and either jump to te field if available, or tell the user to switch tabs first. It would be possible, but quite difficult, to actually switch the tabs yourself, place the cursor in the field, and prompt the user, so I would just prompt he user with a slightly different prompt ex[plaining that the field is required, and the user needs to switch to "tab A" and fill it out.

A much nicer implementation would use DHTML to have al tabs present at the same time, with some visible and some hidden, as the Notes client does it.  Too bad.

Anyway, here's your code, which is similar to Hemantha's....

function Validation() {

if (document.forms[0].AccountName.options[0].selected) {
  if (document.forms[0].AccountName.type = "hidden") {
    alert("Please enter the Account this complaint is originating from. You can find the Account field on TAB A.");
  } else {
    document.forms[0].AccountName.focus();}
    alert("Please enter the Account this complaint is originating from");
  }
  return false;
}
0
 
LVL 14

Expert Comment

by:p_partha
ID: 9929159
Most of the tabbed table concept is built on the funda that each tab is enclosed between div tag and works by making manipulating the display style.


So ideally if you have given id's to each of the tab just have somethig like this:

document.getElementById("<tabid>").style.display='block'
document.forms[0].AccountName.focus()


Before setting the focus to the field in another tab, make that tab display style to block and then set the focus.

Probably it might not be relevant to you also

Partha
0
 

Author Comment

by:StuartCalam
ID: 9948627
On the tab I am getting the following (the line surrounded by the **'s is the line generating the error)...

Error : Object doesn't support this action

Javascript:
if (document.forms[0].cCreator.options[0].selected) {
**  if (document.forms[0].cCreator.type = "hidden") { **
    alert("Please enter the Account contact for this Complaint. You can find the Account field on the General Tab.");
  }
      else {
      alert("Please enter the Account contact for this Complaint");
      document.forms[0].cCreator.focus();
  }
  return false;
}

HTML:
<SELECT NAME="cCreator" onChange="_doClick('$Refresh', this, '_self', '#_RefreshKW_cCreator')">
<OPTION>
<OPTION>steven leung</SELECT>





Or, not on the tab I am getting the following (again the line surrounded by the **'s is the line generating the error)

Error:
'document.forms.cCreator.options.0' is not an object

Javascript:
**if (document.forms[0].cCreator.options[0].selected) {**
  if (document.forms[0].cCreator.type = "hidden") {
    alert("Please enter the Account contact for this Complaint. You can find the Account field on the General Tab.");
  }
      else {
      alert("Please enter the Account contact for this Complaint");
      document.forms[0].cCreator.focus();
  }
  return false;
}

HTML:
<INPUT NAME="cCreator" TYPE=hidden VALUE="">


As far as I can tell this is how I should be doing it?
0
 

Author Comment

by:StuartCalam
ID: 9949380
Hi all.
Managed to get it working by doing the hidden check first like so....

if (document.forms[0].cCreator.type == "hidden")
 {
   if (document.forms[0].cCreator.value == "") {
    alert("Please enter the Account contact for this Complaint. You can find the Account Contact field on the General Tab.");
    document.forms[0].AccountName.focus();
    return false;
    }
  }
  else
  {
      if (document.forms[0].cCreator.options[0].selected) {
    alert("Please enter the Account contact for this Complaint. ");
    document.forms[0].cCreator.focus();
    return false;
  }
  }

Thanks for your help
0

Featured Post

Netscaler Common Configuration How To guides

If you use NetScaler you will want to see these guides. The NetScaler How To Guides show administrators how to get NetScaler up and configured by providing instructions for common scenarios and some not so common ones.

Question has a verified solution.

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

Suggested Solutions

Title # Comments Views Activity
All incoming messages are coming as read 3 39
Migrating from Lotus Notes to Office 365 2 138
LotusScript: Merge Data to Word File 22 92
Counting documents in a Domino View 3 84
This is an old article, please see an updated version of this article, located here: http://www.experts-exchange.com/articles/23619/Notes-8-5x-Windows-7-Notes-info-and-tips.html
Lack of Storage capacity is a common problem that exists in every field of life. Here we are taking the case of Lotus Notes Emails, as we all know that we are totally depend on e-communication i.e. Emails. This article is fully dedicated to resolvin…
This Micro Tutorial hows how you can integrate  Mac OSX to a Windows Active Directory Domain. Apple has made it easy to allow users to bind their macs to a windows domain with relative ease. The following video show how to bind OSX Mavericks to …
Nobody understands Phishing better than an anti-spam company. That’s why we are providing Phishing Awareness Training to our customers. According to a report by Verizon, only 3% of targeted users report malicious emails to management. With compan…

809 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