[Webinar] Streamline your web hosting managementRegister Today

x
?
Solved

Custom web form isn't displaying "submit" button properly

Posted on 2009-05-16
6
Medium Priority
?
478 Views
Last Modified: 2013-12-25
Hi Experts.  I am using SysAidCSS for a ticket management system and they offer the html code to put a self service portal on your website.  I submitted a ticket with them because the submit button isn't working.  They haven't been real quick to fix issues like this before so I thought I would post the code on here and see what the real experts could find.  

Thanks for your help.

>>When I do a preview on my website using the code below, I get this error

line 105
char 6
document.frm.title.value is null or not an object
<html>
<head>
<META http-equiv="Content-Type" content="text/html; charset=utf-8"/>
<link href="css/master.css" rel="stylesheet" type="text/css"/>
</head>
<body>
 
<style type="text/css">
 
</style>
 
<script>
 
var changes = false;
 
function setChange(){
     changes = true;
     var obj=document.getElementById('OKBtn');
     var obj1=document.getElementById('ApplyBtn');
     var body=document.getElementById('OKBtn_body');
     var body1=document.getElementById('ApplyBtn_body');
}
 
var global_value;
 
function checkChange(val) {
     if (global_value.length!=val.length) {
       setChange();
       return;
     }
     for(i=0;i< global_value.length;i++) {
       if(global_value.charAt(i) != val.charAt(i)) {
         setChange();
       }
     }
}
 
function ValidateFrm(){
     if (document.frm.problem_type.value=="none") {
       alert("Please select a category.");
       document.frm.problem_type.focus();
       return false;
     }
     if (document.frm.subcategory.value=="none") {
       alert("Please select a sub-category.");
       document.frm.subcategory.focus();
       return false;
     }
     if (document.frm.title.value.replace(/^\s*/, "").replace(/\s*$/, "").length==0) {
       alert("Please select a title.");
       document.frm.title.focus();
       return false;
     }
     if (document.frm.desc.value.replace(/^\s*/, "").replace(/\s*$/, "").length==0 ) {
       alert("Please enter a description");
       document.frm.desc.focus();
       return false;
     }
     return true;
}
 
function ExecuteOK(){
    if (! ValidateFrm())
      return;
    document.frm.OK.value = "OK";
    document.frm.submit();
}
 
function gotoPage(pageID) {
}
</script>
<table>
 
<form action="http://mysite.sysaidcss.com:80/webformsubmit?pageEncoding=utf-8" method="post" name="frm">
<input type="hidden" name="accountID" value="company" />
<input type="hidden" name="formID" value="-64684988:1212e5692ef:-7feb" />
<input type="hidden" name="reRoute" value="0"> <input type="hidden" name="parentPageName" value="WebFormHTML.jsp?idx=0" >
<input type="hidden" name="paneMessage" value="">
<input type="hidden" name="paneType" value="">
<input type="hidden" name="paneBtnArrayButtons" value="">
<input type="hidden" name="panePreSubmitFunc" value="">
<input type="hidden" name="paneTextRow" value=""><input type="hidden" name="centerPopup" value=""/><script src="http://mysite.sysaidcss.com:80/calendar2.js" type="text/javascript" language="javascript"></script>
<script type="text/javascript" language="javascript" src="http://mysite.sysaidcss.com:80/webformsubmit?getJS=YES&accountID=company&formID=-64684988:1212e5692ef:-7feb" >
</script>
  <tr><td colspan="2">&nbsp;</td></tr>  <tr>    <td class="Form_Ctrl_Label" >&nbsp;&nbsp;&nbsp;&nbsp;First Name</td><td>&nbsp;&nbsp;<input name="firstName" type="text" onFocus="global_value=this.value" onChange="setChange();" onKeyUp="checkChange(this.value)" value="" size="40" maxlength="40"></td>
  </tr>  <tr><td colspan="2">&nbsp;</td></tr>  <tr>    <td class="Form_Ctrl_Label" >&nbsp;&nbsp;&nbsp;&nbsp;Last Name</td><td>&nbsp;&nbsp;<input name="lastName" type="text" onFocus="global_value=this.value" onChange="setChange();" onKeyUp="checkChange(this.value)" value="" size="50" maxlength="50"></td>
  </tr>  <tr><td colspan="2">&nbsp;</td></tr>  <tr>    <td class="Form_Ctrl_Label" >&nbsp;&nbsp;&nbsp;&nbsp;Email</td><td>&nbsp;&nbsp;<input name="email" type="text" onFocus="global_value=this.value" onChange="setChange();" onKeyUp="checkChange(this.value)" value="" size="50" maxlength="64"></td>
  </tr>  <tr><td colspan="2">&nbsp;</td></tr>  <tr>    <td class="Form_Ctrl_Label" >&nbsp;&nbsp;&nbsp;&nbsp;Phone</td><td>&nbsp;&nbsp;<input name="phone" type="text" onFocus="global_value=this.value" onChange="setChange();" onKeyUp="checkChange(this.value)" value="" size="32" maxlength="32"></td>
  </tr>  <tr><td colspan="2">&nbsp;</td></tr>  <tr>    <td class="Form_Ctrl_Label" >&nbsp;&nbsp;&nbsp;&nbsp;Priority</td><td class="Form_Ctrl_Label"><select name="selectPriority" onChange="setChange();" >
  <option value="-1"  >Please select a priority.</option>
  <option value="0"  selected  >Default value</option>
<option value="1"  >Highest</option>
<option value="2"  >Very High</option>
<option value="3"  >High</option>
<option value="4"  >Normal</option>
<option value="5"  >Low</option>
</select>
</td>  </tr>  <tr><td colspan="2">&nbsp;</td></tr>  <tr>    <td class="Form_Ctrl_Label" >&nbsp;&nbsp;&nbsp;&nbsp;Category</td><td class="Form_Ctrl_Label"><select  name="problem_type"  onChange="setChange();updateSubCategory();">  <option value="none">Please select a category.</option><option value="Inquiry" >Inquiry</option><option value="Support" >Support</option></select>&nbsp;<select name="subcategory" onChange="setChange();subCatChage();">  <option value="none">Please select a sub-category.</option></select>&nbsp;<input type="hidden" name="thirdLevelCategory" value="">
<input type="hidden" name="autoDescriptionTemplate" value="N">
</td>  </tr>  <tr><td colspan="2">&nbsp;</td></tr>  <tr>    <td class="Form_Ctrl_Label" >&nbsp;&nbsp;&nbsp;&nbsp;Description</td><td class="Form_Ctrl_Fields FieldBox"><textarea name="desc" cols="120" rows="5" id="desc" onchange="setChangeDesc(this);setChange(this);" onKeyUp="checkChangeDesc(this.value,this);checkChange(this.value,this);" onFocus="global_value=this.value" ></textarea>
</td>  </tr>  <tr>    <td colspan="2">&nbsp;</td>  </tr>  <tr >    <td colspan="1">&nbsp;      <table  class="Button3Parts" tabIndex="0" onclick="ExecuteOK();"><tbody class="Purple"><tr class=" - state - "><td class="ButtonFirst">&nbsp;</td><td class="ButtonLabel"><span>Submit</span></td><td class="ButtonLast">&nbsp;</td></tr></tbody></table>           <input name="OK" type="hidden" value =""></td>  </tr>  <tr>    <td colspan="2">&nbsp;<br><p>&nbsp;&nbsp;&nbsp;&nbsp;Powered by SysAid <a href="http://www.ilient.com">Help Desk Software</a>.</p>  </td></tr>
</form>
 
</table>
</body>
</html>

Open in new window

0
Comment
Question by:samiam41
  • 3
  • 2
6 Comments
 
LVL 2

Expert Comment

by:joesoef
ID: 24404924
Hi there,

The form is missing one input, which is title. I guess this one is placed before first name. However, we need to know what format is required. Is it free text, or predefined options?

Looks like you have to wait :-)
0
 
LVL 14

Expert Comment

by:shobinsun
ID: 24405039
Hi,

In your code, there is a checking of 'title' value. But in the form there is no title name for checking. So no need to check that value .

The code below works fine for me.

Hope this will help you.

Regards
<html>
<head>
<META http-equiv="Content-Type" content="text/html; charset=utf-8"/>
<link href="css/master.css" rel="stylesheet" type="text/css"/>
</head>
<body>
 
<style type="text/css">
 
</style>
 
<script>
 
var changes = false;
 
function setChange(){
     changes = true;
     var obj=document.getElementById('OKBtn');
     var obj1=document.getElementById('ApplyBtn');
     var body=document.getElementById('OKBtn_body');
     var body1=document.getElementById('ApplyBtn_body');
}
 
var global_value;
 
function checkChange(val) {
     if (global_value.length!=val.length) {
       setChange();
       return;
     }
     for(i=0;i< global_value.length;i++) {
       if(global_value.charAt(i) != val.charAt(i)) {
         setChange();
       }
     }
}
 
function ValidateFrm(){
     if (document.frm.problem_type.value=="none") {
       alert("Please select a category.");
       document.frm.problem_type.focus();
       return false;
     }
     if (document.frm.subcategory.value=="none") {
       alert("Please select a sub-category.");
       document.frm.subcategory.focus();
       return false;
     }
     if (document.frm.desc.value.replace(/^\s*/, "").replace(/\s*$/, "").length==0 ) {
       alert("Please enter a description");
       document.frm.desc.focus();
       return false;
     }
     return true;
}
 
function ExecuteOK(){
    if (! ValidateFrm())
      return;
    document.frm.OK.value = "OK";
    document.frm.submit();
}
 
function gotoPage(pageID) {
}
</script>
<table>
 
<form action="http://mysite.sysaidcss.com:80/webformsubmit?pageEncoding=utf-8" method="post" name="frm">
<input type="hidden" name="accountID" value="company" />
<input type="hidden" name="formID" value="-64684988:1212e5692ef:-7feb" />
<input type="hidden" name="reRoute" value="0"> <input type="hidden" name="parentPageName" value="WebFormHTML.jsp?idx=0" >
<input type="hidden" name="paneMessage" value="">
<input type="hidden" name="paneType" value="">
<input type="hidden" name="paneBtnArrayButtons" value="">
<input type="hidden" name="panePreSubmitFunc" value="">
<input type="hidden" name="paneTextRow" value=""><input type="hidden" name="centerPopup" value=""/><script src="http://mysite.sysaidcss.com:80/calendar2.js" type="text/javascript" language="javascript"></script>
<script type="text/javascript" language="javascript" src="http://mysite.sysaidcss.com:80/webformsubmit?getJS=YES&accountID=company&formID=-64684988:1212e5692ef:-7feb" >
</script>
  <tr><td colspan="2"> </td></tr>  <tr>    <td class="Form_Ctrl_Label" >    First Name</td><td>  <input name="firstName" type="text" onFocus="global_value=this.value" onChange="setChange();" onKeyUp="checkChange(this.value)" value="" size="40" maxlength="40"></td>
  </tr>  <tr><td colspan="2"> </td></tr>  <tr>    <td class="Form_Ctrl_Label" >    Last Name</td><td>  <input name="lastName" type="text" onFocus="global_value=this.value" onChange="setChange();" onKeyUp="checkChange(this.value)" value="" size="50" maxlength="50"></td>
  </tr>  <tr><td colspan="2"> </td></tr>  <tr>    <td class="Form_Ctrl_Label" >    Email</td><td>  <input name="email" type="text" onFocus="global_value=this.value" onChange="setChange();" onKeyUp="checkChange(this.value)" value="" size="50" maxlength="64"></td>
  </tr>  <tr><td colspan="2"> </td></tr>  <tr>    <td class="Form_Ctrl_Label" >    Phone</td><td>  <input name="phone" type="text" onFocus="global_value=this.value" onChange="setChange();" onKeyUp="checkChange(this.value)" value="" size="32" maxlength="32"></td>
  </tr>  <tr><td colspan="2"> </td></tr>  <tr>    <td class="Form_Ctrl_Label" >    Priority</td><td class="Form_Ctrl_Label"><select name="selectPriority" onChange="setChange();" >
  <option value="-1"  >Please select a priority.</option>
  <option value="0"  selected  >Default value</option>
<option value="1"  >Highest</option>
<option value="2"  >Very High</option>
<option value="3"  >High</option>
<option value="4"  >Normal</option>
<option value="5"  >Low</option>
</select>
</td>  </tr>  <tr><td colspan="2"> </td></tr>  <tr>    <td class="Form_Ctrl_Label" >    Category</td><td class="Form_Ctrl_Label"><select  name="problem_type"  onChange="setChange();updateSubCategory();">  <option value="none">Please select a category.</option><option value="Inquiry" >Inquiry</option><option value="Support" >Support</option></select> <select name="subcategory" onChange="setChange();subCatChage();">  <option value="none">Please select a sub-category.</option></select> <input type="hidden" name="thirdLevelCategory" value="">
<input type="hidden" name="autoDescriptionTemplate" value="N">
</td>  </tr>  <tr><td colspan="2"> </td></tr>  <tr>    <td class="Form_Ctrl_Label" >    Description</td><td class="Form_Ctrl_Fields FieldBox"><textarea name="desc" cols="120" rows="5" id="desc" onchange="setChangeDesc(this);setChange(this);" onKeyUp="checkChangeDesc(this.value,this);checkChange(this.value,this);" onFocus="global_value=this.value" ></textarea>
</td>  </tr>  <tr>    <td colspan="2"> </td>  </tr>  <tr >    <td colspan="1">       <table  class="Button3Parts" tabIndex="0" onclick="ExecuteOK();"><tbody class="Purple"><tr class=" - state - "><td class="ButtonFirst"> </td><td class="ButtonLabel"><span><input type='submit' name='submit' value='Submit'></span></td><td class="ButtonLast"> </td></tr></tbody></table>           <input name="OK" type="hidden" value =""></td>  </tr>  <tr>    <td colspan="2"> <br><p>    Powered by SysAid <a href="http://www.ilient.com">Help Desk Software</a>.</p>  </td></tr>
</form>
 
</table>
</body>
</html>

Open in new window

0
 
LVL 9

Author Comment

by:samiam41
ID: 24406544
Thanks for the responses.  I have no idea where I would put a "title" in....  Great catch on what was missing.  I am sure that you guys knew what to look for as I spent 30 minutes pretending to know what I was doing.  

@joesoef > I apologize but I am not sure how to respond.  I am generating the code from Homestead and copying/pasting it.  Where could I find this info out?
0
The new generation of project management tools

With monday.com’s project management tool, you can see what everyone on your team is working in a single glance. Its intuitive dashboards are customizable, so you can create systems that work for you.

 
LVL 2

Accepted Solution

by:
joesoef earned 2000 total points
ID: 24410314
samiam41,

Sorry, maybe my comment was misunderstood, my mistake.

This one is confusing, I guess: "However, we need to know what format is required. Is it free text, or predefined options?".

So, let me retry to explain it :-)

Since this is a form validation script, and one of the "to be checked" input is missing, THEN we could:
1. remove some function from the validation script (like shobinsun suggested) OR
2. add the missing input into the form (my suggestion).

In my suggestion, the problem is we don't know what input is required. We could not put just simple text or "pull down" options. Because the form is going to be submitted to another system / subsystem.

We need to know how the next process accepting the data. We could not know from the code, we need to ask those SysAidCSS guys.

PS: you could try shobinsun solution, it's a quick fix worth trying. If it does not work, then the missing input is mandatory. Just do it like plan A: solution 1, plan B: solution 2

Phew, I hope I explained better this time :-)
0
 
LVL 9

Author Comment

by:samiam41
ID: 24442498
I'm not sure what suggestion shobinsun made so I didn't try it.

I am moving on to Spiceworks and their helpdesk software as I just find SysAid CSS a pain in the butt.  I have spent way too much time trying to figure out how to use the CSS software instead of bringing in customers.  

I appreciate your suggestions but am awarding points and closing this ticket out.  Thanks again for your time and patience.
0
 
LVL 9

Author Closing Comment

by:samiam41
ID: 31582306
Thanks joesoef for your help and explanation.  I seriously was lost on this and after your explanation, I knew more about the problem.  I can't say I fixed it as I am finished with CSS and on to SW.  Hopefully you will be willing to assist with that app if the need arises.

Regards,
Aaron
0

Featured Post

Never miss a deadline with monday.com

The revolutionary project management tool is here!   Plan visually with a single glance and make sure your projects get done.

Question has a verified solution.

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

The first step to building an amazing About page is to figure out what you want the page to say about your company. You then must grab the attention of the reader, boast a bit, tell a story and let others brag about you. With a little bit of thought…
The Super Bowl is just days away. Millions of advertising dollars will be spent in just a few hours to drive people to websites around the globe. Optimizing your site in anticipation of a big event like this (and the traffic surges that follow) will…
This tutorial will teach you the core code needed to finalize the addition of a watermark to your image. The viewer will use a small PHP class to learn and create a watermark.
This video shows how to quickly and easily deploy an email signature for all users in Office 365 and prevent it from being added to replies and forwards. (the resulting signature is applied on the server level in Exchange Online) The email signat…
Suggested Courses

591 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