2009-06-10 1 views
1

그래, 도움이 필요해. 이것은 나의 첫 번째 질문이다.비정상적인 양식 필드 ID를 사용하여 Javascript에서 날짜 검증 - Salesforce.com 웹 대 케이스 통합

배경 : 저는 자선 프로젝트를 진행하고 있으며, 저의 일부분은 Salesforce.com으로 Web-To-Case 기능을 구축하는 것입니다. 세일즈 포스 닷컴 (Salesforce.com)은 당신이 알지 못한다면 소프트웨어를 자격이없는 비영리 단체에 무료로 제공합니다. 어쨌든 Salesforce.com의 Web-To-Case 기능은 제출 된 HTML 양식을 생성하여 Salesforce.com으로 데이터를 보내고 티켓을 생성합니다. 양식 요소의 ID는 Salesforce.com의 필드에 해당하는 것으로 보이는 숫자와 문자의 문자열입니다.

목표 : 날짜가 지정된 형식 (12/30/2009 12:00 PM)이 아닌 한 사용자가 입력 한 내용이 무엇이든 알 수 있으므로 특정 형식의 날짜 유효성 검사를 구축하려고했습니다. Salesforce.com에 포함시키지 마십시오.

문제점 : 온라인 스크립트 (javascript)를 찾고 내 필요에 맞게 수정했습니다. 문제 - 작동하지 않습니다. 브라우저 모서리에 약간의 오류가 발생하지만 16 행에서 양식이 통과하지 못합니다 (유효하지 않습니다) - "Expected") ' ".

첨부하고 싶습니다. 여기 코드는 ... 괜찮습니다. 일반적으로 관련 비트 만 잘라 내 겠지만 사람들이 "이 태그는 작동하지 않을 것입니다. 닫는 HTML 태그가 없습니다"라고 말하는 것이 두려워합니다. HTML 파일이이 포럼에 의해 해석 될 수 있습니다. 잘 ... 이상적이지는 않습니다. 좋아, 내가 탈출하는 방법을 알아 냈다고 생각하지만 탈출하기가 너무 많아서 대부분의 주석과 대부분의 참과 상관없는 것들을 잘라 냈다.

양식 필드 ID가 모두 얼마나 펑키 하는지를 알 수있다. - 내가 본 예제의 대부분은 간단한 폼 ID와 이름을 가졌습니다 ... 그래서 Javascript가 필드에서 ID/이름으로 숫자로 시작하는 문자열을 처리 할 수 ​​없는지 궁금했습니다.

내 정규 표현식이 위에서 지정한 날짜 형식에 가까운 것이면 다른 이유로 작동하지 않기 때문에 테스트 할 수 없으므로 궁금합니다. 나는 내가 원하는 것을 세상에서 찾을 수 없었기 때문에 내 자신의 정규 표현을 만들어야했다.

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> 
<html xmlns="http://www.w3.org/1999/xhtml"> 
<head> 
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" /> 
<title>Cambridge Cares About AIDS: Request an Asset</title> 
<link type="text/css" rel="stylesheet" href="styles.css" /> 

<SCRIPT LANGUAGE="JavaScript"> // Original JavaScript code by Chirp Internet: www.chirp.com.au // Please acknowledge use of this code by including this header. //Code modified to validate a date/time field by Shannon Davis, Company Name Removed. 

function checkDates(form) 
{ 
checkDate(form.00N80000003LGJ5); 
    checkDate(form.00N80000003LGNt); 
} 

function checkDate(field) 
{ 
    var allowBlank = false; 
var minYear = (new Date()).getFullYear(); 
var maxYear = 2100; 

var errorMsg = ""; 

// regular expression to match required date format 
re = /^(\d{1,2})\/(\d{1,2})\/(\d{4})\s(\d{1,2}):(\d{2})+\s([ap]m)+$/; 

if(field.value != '') { 
    if(regs = field.value.match(re)) { 
    if(regs[1] < 1 || regs[1] > 12) { 
     errorMsg = "Invalid value for day: " + regs[1]; 
    } else if(regs[2] < 1 || regs[2] > 31) { 
     errorMsg = "Invalid value for month: " + regs[2]; 
    } else if(regs[3] < minYear || regs[3] > maxYear) { 
     errorMsg = "Invalid value for year: " + regs[3] + " - must be between " + minYear + " and " + maxYear; 
    } 
    } else { 
    errorMsg = "Invalid date format: " + field.value; 
    } 
} else if(!allowBlank) { 
    errorMsg = "Empty date not allowed!"; 
} 

if(errorMsg != "") { 
    alert(errorMsg); 
    field.focus(); 
    return false; 
} 
return true; 
    } 
</SCRIPT> 

<META HTTP-EQUIV="Content-type" CONTENT="text/html; charset=UTF-8"> 
</head> 

<BODY> 

    <div id="container"> 
     <div id="top_photo"> 
     <img src="images/ccaa_banner.jpg" alt="banner" width="800" height="181" /> 
     </div> 

     <div id="left_colum" style="width: 200; height: 256"><a href="index.html"> 
         <img src="images/cca_logo.gif" alt="logo" border="0" width="178" height="84" /></a> 
        <p class="address">Cambridge Cares About AIDS<br />17 Sellers Street<br /> Cambridge, MA 02139<br />617.661.3040</p> 
       <br /> 

       </div> 
       <div id="right_colum"> 
         <div id="content"> 

<form id="form" name="form" action="https://www.salesforce.com/servlet/servlet.WebToCase?encoding=UTF-8" method="POST"> 

<input type=hidden name="orgid" value="00D80000000M3if"> 
<input type=hidden name="retURL" value="http://wilmwebtest/CCAA/thank_you.htm"> 

<table border=0> 

<tr><TD><label for="email">CCA Email:*</label></TD><td><input id="email" maxlength="80" name="email" size="40" type="text" /><br> </td></tr> 

<tr> 
<td><label for="subject">Subject:</label></td><td><input id="subject" maxlength="80" name="subject" size="40" type="text" /><br></td> 
</tr> 
<tr><td> 
<label for="description">Description*</label></td> 
<td> 
<textarea name="description" rows="4" cols="25"></textarea><br></td> 
</tr><tr> 
<input type="hidden" name="recordType" id="recordType" value="0012800000006ZWz"> 

<tr> <td colspan="2"> 
<p>Date Format: mm/dd/yyyy hh:mm am/pm<br>example: &quot;08/30/2009 12:00 am&quot;</td></tr> 
<tr><td>When Needed (Start):*</td> 
<td><input id="00N80000003LGJ5" name="00N80000003LGJ5" size="40" type="text" /></span><br></td></tr> 
<tr> 
<td> 
When Needed (End):<span class="dateInput">*</td> 
<TD> 

<input id="00N80000003LGNt" name="00N80000003LGNt" size="40" type="text" /></span><br></td> 
</tr> 
</table> 
<input type="hidden" id="external" name="external" value="1" /><br> 

<input type="submit" name="submit" value="Submit Asset Request" onClick="checkDates (this.form);" > 

</form> 

         </div> 
       </div> 
      <div id="clearit"> 
      </div> 
    </div> 
    </body> 
    </html> 

답변

2

checkDate 기능이 정확합니다. 문제는 checkDates 함수에 있습니다. Javascript는 숫자로 시작하는 변수를 좋아하지 않습니다. 변경 :

function checkDates(form) 
{ 
    checkDate(form.elements['00N80000003LGJ5']); 
    checkDate(form.elements['00N80000003LGNt']); 
} 

의도 한대로 작동해야합니다.

onclick="return checkDates(this.form)" 

그렇지 않으면, 형태에 상관없이 제출되지 않습니다 :

또한, 제출되는 양식을 취소 할 잘못된 날짜 위해서는, 당신은 당신의 제출 버튼의 OnClick가 속성을 변경해야합니다.

사이드 노트에서 언급 한 오류 메시지는 고전적인 'WTF?'처럼 들립니다. Internet Explorer 오류 메시지. 이전 버전보다 훨씬 나은 오류 메시지가있는 IE (IE8)의 최신 버전으로 업그레이드하거나 Firefox를 사용하는 것이 좋습니다. Firefox의 오류 콘솔은 Javascript (및 CSS) 오류를 추적 할 때 아무도 뒤지지 않습니다.

+0

두 번째는 IE 업그레이드 또는 FireFox 제안입니다. IE는 나쁜 자바 스크립트 오류보고에 대한 notorius입니다. 줄 번호는 의미가 없으며보고 할 오류 메시지가 하나 뿐인 것으로 보입니다.:-) –

+0

글쎄, 나는 그 메시지 대화 상자에 '이전'버튼이 있다는 것을 알았다. 그래도 라인 번호는 의미가 없으며 'Error : Object Expected'는 실제로 당신에게별로 알려주지 않습니다. – cmptrgeekken

+0

나는 너를 단지 안아줄 수 있었다! 시도해보기. 뒤로 - 효과가있었습니다! 이 사이트에서 정답으로 표시 할 수있는 방법이 있습니까? 뿐만 아니라 나는 행복하다, 그러나 당신은 실제로 굉장한 비영리 재단을 도왔다! –