Go Premium for a chance to win a PS4. Enter to Win

x
  • Status: Solved
  • Priority: Medium
  • Security: Public
  • Views: 317
  • Last Modified:

hide a html table IF form text box value is null

please see the attached screen shot.  what i have is a dynamic site which pulls values into a text box.  it's integrated with opentext livelink web forms 9.7.2, which doesn't matter, we can generalize everything.

if a null value is detected within the PERSON text box, then i'd like the whole table hidden from view when the user clicks 'Remove Empty Fields'.

i've highlighted tables in orange on the screenshot.  i didn't highlight them all, but you get the idea.

the website loads and content will automatically populate the text boxes (just not all text boxes)
the website will have a button that the user clicks
this button will wipe all tables when a null value is detected within the PERSON text box

once wiped, the user has a nice clean form they can print > this form is used to approve high dollar projects.

so i have 13 tables which each contain a PERSON text box:

Reviewer1Table (text box _1_1_22_1_Name)
Reviewer2Table (text box _1_1_25_1_Name)
Reviewer3Table (text box _1_1_28_1_Name)
Reviewer4Table (text box _1_1_31_1_Name)
Reviewer5Table (text box _1_1_34_1_Name)
Manager1Table (text box _1_1_12_1_Name)
Manager2Table (text box _1_1_16_1_Name)
TechAssuranceTable (text box _1_1_20_1_Name)

etc. etc. etc

the logic i'm thinking when the button is pressed:

IF _1_1_22_1_Name = null THEN hide Reviewer1Table

i need this function to scan all 13 text boxes

i already have a submit button with a doSubmit function - i can't conflict the two buttons, right?
11-10-2010-12-29-00-PM.png
0
sknoll84
Asked:
sknoll84
  • 12
  • 10
1 Solution
 
CCSOFlagCommented:
try this:

function to put in your button tag:
onclick="RemoveEmptyFields();"


javascript:

function HideNullParentTable(myID)
{
  myElement = document.getElementById(myID);
  if (!myElement.value)
  {
    myParent = myElement.parentNode;
    while(myParent.nodeName!='table')
    {
      myParent = myParent.parentNode;
    }
    myParent.style.display = 'none';
  }
}

function RemoveEmptyFields()
{
  HideNullParentTable('_1_1_22_1_Name');
  HideNullParentTable('_1_1_25_1_Name');
  ... //need to do it for each one, I don't see a way to automatically cycle through these tags.
}
0
 
sknoll84Author Commented:
do i replace HideNullParentTable with my table name?
0
 
CCSOFlagCommented:
no that's a javascript funtion you ar ecalling.  the table is found my using the parentNode call of the text box id you have passed.
0
Industry Leaders: We Want Your Opinion!

We value your feedback.

Take our survey and automatically be enter to win anyone of the following:
Yeti Cooler, Amazon eGift Card, and Movie eGift Card!

 
sknoll84Author Commented:
so because the text box exists within a table, the table it exists within is called the parentnode?
0
 
CCSOFlagCommented:
it is eventually a parent node.  the first parent node would be the td, then tr, then table.  It cycles through until it finds the first parent table node.  
0
 
CCSOFlagCommented:
I'm heading out of the office in a bit and I have tomorrow off.  If I get time at home I'll respond, but no promises.  Sorry...
0
 
sknoll84Author Commented:
okay this is my javascript:


<script type="text/javascript" language="javascript">
function HideNullParentTable(myID)
{
 myElement = document.getElementById(myID);
 if (!myElement.value)
 {
   myParent = myElement.parentNode;
   while(myParent.nodeName!='table')
   {
     myParent = myParent.parentNode;
   }
   myParent.style.display = 'none';
 }
}

function RemoveEmptyFields()
{
 HideNullParentTable('_1_1_22_1_Name');
 HideNullParentTable('_1_1_25_1_Name');
 HideNullParentTable('_1_1_28_1_Name');
 HideNullParentTable('_1_1_31_1_Name');
 HideNullParentTable('_1_1_34_1_Name');
 HideNullParentTable('_1_1_12_1_Name');
 HideNullParentTable('_1_1_16_1_Name');
 HideNullParentTable('_1_1_20_1_Name');
 HideNullParentTable('_1_1_37_1_Name');
 HideNullParentTable('_1_1_42_1_Name');
 HideNullParentTable('_1_1_46_1_Name');
 HideNullParentTable('_1_1_50_1_Name');
 HideNullParentTable('_1_1_54_1_Name');
}
</script>


this is my button:

<input name="RemoveApprovers" type="button" value="Remove Extra Approvers" onclick="RemoveEmptyFields();">


no success.  any ideas?
0
 
sknoll84Author Commented:
here is a table that i'd like to hide > it contains text box _1_1_28_1_Name
i'm providing this so you get an idea of what's contained within the table i'd like to hide



<table id="Reviewer3Table"  style=""  width="700" border="0" cellspacing="1" cellpadding="1">
  <tr>
    <td width="170" class="style2"><div align="left"> Reviewer</div></td>
    <td width="300" class="style2"><div align="left"><SCRIPT LANGUAGE="JavaScript">
function chooseUser_1_1_28_1()
{
var            url;
var            w;
url = '/livelink/livelink.exe?func=user.SelectUserDlg&formname=myForm&fieldprefix=_1_1_28_1&title=Select%20User&DisplayUserName&NoGroups=FALSE';
url = url + '&NoGroupsSelectable=TRUE'
w = window.open(url,"","height=340,width=680,scrollbars=yes,resizable=yes,menubar=no,toolbar=yes,status=yes");
if ( w.focus )
{
w.focus();
}
}
function KeepFieldSet_1_1_28_1( nameField, savedValue )
{
if ( nameField.value != '' )
{
alert( "You can't enter text in by hand. Use the link to the right." );
nameField.value = savedValue;
}
else if ( markDirty != null )
{
markDirty();
}
if ( nameField.value == savedValue.value )
{
savedValue.value = nameField.value;
}
}
</SCRIPT>
<INPUT TYPE="HIDDEN" NAME="_1_1_28_1_ID" VALUE="[LL_FormTag_1_1_28_1 /]">
<INPUT TYPE="HIDDEN" NAME="_1_1_28_1_SavedName" VALUE="[LL_FormTag_1_1_28_1_SavedName /]">
<LABEL FOR="_1_1_28_1_Name"></LABEL>
<INPUT CLASS="valueEditable" TYPE="TEXT" NAME="_1_1_28_1_Name" ID="_1_1_28_1_Name" VALUE="[LL_FormTag_1_1_28_1_SavedName /]" ALT="Select User" SIZE="23" ONCHANGE="KeepFieldSet_1_1_28_1( this, this.form._1_1_28_1_SavedName.value )">
<IMG SRC="/img/guy_select.gif" ALT="Select User" BORDER="0"></div>
    </td>
    <td width="100" class="style2"><div align="left">
      <SELECT CLASS="selectMenu" disabled ID="_1_1_99_1" NAME="_1_1_99_1" ONCHANGE="markDirty();">
<OPTION VALUE="" ><None></OPTION>
<OPTION VALUE="Approve" >Approve</OPTION>
<OPTION VALUE="Reject" >Reject</OPTION>
</SELECT>
    </div></td>
    <td width="130" class="style2"><div align="left"><INPUT CLASS="valueEditable" DISABLED="disabled" TYPE="text" NAME="_1_1_89_1" TITLE="Reviewer 3 Date" ID="_1_1_89_1" VALUE="[LL_FormTag_1_1_89_1 /]" SIZE="11" MAXLENGTH="32" ONCHANGE="markDirty();"></div></td>
  </tr>
</table>
0
 
sknoll84Author Commented:
just bumping the question here.....

IF _1_1_22_1_Name = null THEN hide Reviewer1Table
IF _1_1_25_1_Name = null THEN hide Reviewer2Table
IF _1_1_28_1_Name = null THEN hide Reviewer3Table
IF _1_1_31_1_Name = null THEN hide Reviewer4Table
IF _1_1_34_1_Name = null THEN hide Reviewer5Table
IF _1_1_12_1_Name = null THEN hide Manager1Table
IF _1_1_16_1_Name = null THEN hide Manager2Table


i need to find empty text boxes and hide the table which the text box exists
0
 
CCSOFlagCommented:
Hey, sorry about not being able to help out yesterday...

So is anything happening when you push the button?
0
 
sknoll84Author Commented:
hey no worries, hope you enjoyed your day off!

nothing is happening when i push the button....

and in fact i would later like to talk about performing this function on page load - is that possible?

0
 
CCSOFlagCommented:
oops, sorry, change this line in the javascript:

while(myParent.nodeName!='TABLE')

javascript pulls the tag name as upper case.  :(  Sorry.
0
 
sknoll84Author Commented:
w00t! w00t!
0
 
sknoll84Author Commented:
you my friend are amazing.

so what if i wanted to do this onPageLoad?

think it would work?
0
 
CCSOFlagCommented:
yes, just add this to your body tag:

<body onload="RemoveEmptyFields()">
0
 
sknoll84Author Commented:
hmm that doesnt seem to work:

<BODY Class="pageBody" onload="RemoveEmptyFields()">
0
 
CCSOFlagCommented:
really?  Hmmm.  OK try to put this at the bottom of your page inside your body section.

<script type="text/javascript">
RemoveEmptyFields()
</script>

</body>
0
 
sknoll84Author Commented:
HAHAHAHA its working

okay, standby - i have to test within my environment


hey, where do you live?  you looking for an opportunity?
0
 
CCSOFlagCommented:
lol, opportunity for what?  I'm in Flagstaff, AZ...
0
 
sknoll84Author Commented:
i work for a very successful consulting firm in dallas texas -  your skills are needed

we are looking for a developer

what about contract work, you do any?
0
 
CCSOFlagCommented:
Heh, definitely not interested in relocating to Dallas.  I have a full time job, but I might be willing to contract out some work if relocating isn't required.
0
 
sknoll84Author Commented:
relocating would not be required - every now and then we have a project which calls for some minor development work - you seem perfect.  can you email me ?  i will not ask any technical questions - its strictly for any upcoming dev work that you may be interested in

stvnknoll [at] gmail

if i dont hear from ya, no hard feelings ;-)
ill quit hijacking this thread now.  off to test the solution in our qa environment
0

Featured Post

Concerto's Cloud Advisory Services

Want to avoid the missteps to gaining all the benefits of the cloud? Learn more about the different assessment options from our Cloud Advisory team.

  • 12
  • 10
Tackle projects and never again get stuck behind a technical roadblock.
Join Now