2014-04-08 5 views
-1

mvc에서 마스터 레이아웃을 사용하고 버튼 클릭시 양식을 확인하려고하지만 창로드 및 jquery 기능이 작동하지 않고 유효성을 검사하는 면도기 뷰를 만들었습니다. 하지 버튼 클릭에 일을하고 난 그래서 모든 솔루션로드 이벤트가 jQuery에서 작동하지 않습니다.

function ExportPatientDetailServiceConfig() { 
    $("#frmExportServiceConfiguration").validate({ 
     submitHandler: function (form) { 
      var frmData = $('#frmExportServiceConfiguration').serializeArray(); 
       $.post('/Admin/ExportServiceConfiguration', frmData, function (data) { 
        var result = unescape(data); 
        if (result == "success") { 
         alert('Xml Saved successfully!'); 
        } 
       }); 
      } 
     }); 
} 

을 제안 해주십시오 별도의 파일에 내 jQuery를 유지하려는 그나마 내 HTML은, 그것은 무슨 일이 일어나고 있는지 정확히 말하기 어렵다

<fieldset> 
    <legend align="center">Patient Extended Details Service Configuration</legend> 
    @using (Html.BeginForm("PatientExtendedDetailServiceConfiguration", "Admin", FormMethod.Post, new { id = "frmExportServiceConfiguration" })) 
    { 
     <table width="100%"> 
      <tbody> 
       <tr> 
        <td> 
         Generate Report at : 
        </td> 
        <td> 
         <select id="ddlHr" name="ddlHr" style="width: 18%"> 
          <option id="selectHR">HH</option> 
          @{ 
           for (int i = 1; i <= 24; i++) 
           { 
            string ddlHr = "optHr" + i; 
            <option id="@ddlHr">@i</option> 
           } 
          } 
          </select>&nbsp;&nbsp;<span>:</span>&nbsp; 
          <select id="ddlminute" name="ddlminute" style="width: 18%"> 
           <option id="selectMM">mm</option> 
           @{ 
            for (int i = 1; i <= 60; i++) 
            { 
             string ddlMM = "optMM" + i; 
             <option id="@ddlMM">@i</option> 
            } 
           } 
          </select> 
         </td> 
        </tr> 
        <tr> 
         <td style="width: 175px; vertical-align: top"> 
          <h2> 
           Clinics :</h2> 
         </td> 
         <td> 
          <label> 
           <input id="chkAllActiveClinics" name="chkSelectClinic" type="radio" tabindex="3" /><span>All 
            Active</span></label> 
          <label> 
           <input id="chkActiveClinics" checked="checked" name="chkSelectClinic" type="radio" 
            tabindex="3" /><span>I want to choose Clinics </span> 
          </label> 
         </td> 
        </tr> 
        <tr> 
         <td> 
         </td> 
         <td> 
          <div class="selector"> 
           <ul> 
            @{ 
             int count = 1; 
             foreach (TheJoint.Models.Clinic c in (IList<TheJoint.Models.Clinic>)ViewData["Clinic_List"]) 
             { 
              string checkBoxName = "cCheckbox" + @count; 
              string spancheckBox = "spCheckbox" + @count; 
              <li> 
               <input id="@checkBoxName" name="ActiveClinic" type="checkbox" tabindex="@count" value="@c.id" /> 
               <span id="@spancheckBox" >@c.name</span> 
              </li> 
              count = count + 1; 
             } 
            } 
           </ul> 
          </div> 
       </tr> 
       <tr> 
        <td> 
         <h2> 
          FTP : 
         </h2> 
        </td> 
       </tr> 
       <tr> 
        <td> 
         Host : 
        </td> 
        <td> 
         <input type="text" id="txtFTPServerAddress" name="txtServerAddress" /> 
        </td> 
       </tr> 
       <tr> 
        <td> 
         Username : 
        </td> 
        <td> 
         <input type="text" id="txtFTPUserId" name="txtUserId" style="width: 200px" /> 
        </td> 
       </tr> 
       <tr> 
        <td> 
         Password : 
        </td> 
        <td> 
         <input type="text" id="txtFTPPassword" name="txtPassword" style="width: 200px" /> 
        </td> 
       </tr> 
       <tr> 
        <td> 
         Port : 
        </td> 
        <td> 
         <input type="text" id="txtFTPPortNo" name="txtFTPPortNo" value="21" style="width: 75px" /> 
        </td> 
       </tr> 
       <tr> 
        <td colspan="2"> 
         <input type="button" id="btnCancel" name="btnCancel" value="Cancel" /> 
         <input type="button" id="btnExport" name="btnExport" value="Save" onclick="ExportPatientDetailServiceConfig();" /> 
         @*<input type="submit" id="btnSaveXml" name="btnSaveXml" value="Save" onclick="ExportPatientDetailServiceConfig();" />*@ 
        </td> 
       </tr> 
       </tbody> 
      </table> 
      <div id="test"> 
      </div> 
     } 
</fieldset> 
+0

왜 유효성 검증 플러그인을 함수 안에 넣었습니까? 단추를 클릭 할 때 유효성 검사를 실제로 실행하지 않는 것처럼 보입니다. 버튼을 클릭하면 * 플러그인을 적용하는 것입니다. jQuery Validate 플러그인 웹 사이트의 예제는이 작업을 수행하지 않습니다. – David

+0

jquery 함수를 시도한 이유는 어떤 이벤트도 발생하지 않기 때문에 함수에 넣어 두었습니다. – iProgrammer

+0

이 문은 실제로 많은 의미를 가지지 않기 때문에 언어 장벽이있는 것으로 보입니다. 기본적으로,'.validate()'호출은 페이지가 처음로드 될 때하고 싶은 플러그인을 초기화합니다. 양식 제출시가 아닙니다.자바 스크립트 코드가 목표로하는 마크 업 앞에 있다면 jQuery 함수로 감싸서 문서의로드 이벤트를 기다려야한다. $ (function() {// 여기에서 플러그인 초기화}), ' – David

답변

0

당신 때문에 문맥에서 코드를 게시했습니다. 일반적으로 다음 원칙을 따르기를 원합니다.

  1. 항상 닫는 본문 태그 바로 전에 스크립트를 넣으십시오. JavaScript가 브라우저 렌더링을 차단하므로 페이지로드 속도가 더 빨라질뿐만 아니라 실제로 페이지에 실제로 렌더링되지 않은 요소에 연결하는 것과 같은 일반적인 문제가 자동으로 제거됩니다.

  2. 다른 모든 스크립트보다 먼저 jQuery 및 기타 핵심 라이브러리를 참조해야합니다. 페이지 JavaScript를 사용하는 경우 이러한 참조를 페이지의 head 요소에 넣어 JavaScript가 실행되기 전에로드되었는지 확인해야합니다. 그러나 다시 말하자면, 닫는 body 태그 바로 앞에 모든 자바 스크립트를 이동하는 것이 좋습니다.이 경우 jQuery 및 기타 핵심 라이브러리가 , 사용자 정의 JavaScript으로 참조됩니다.

  3. 종속성에주의하십시오. Validate와 같은 jQuery 플러그인을 사용하는 경우 jQuery 을 먼저으로 참조한 다음 해당 플러그인 스크립트를 참조해야합니다. 일반적으로 종속성이 의존하는 스크립트보다 먼저 종속성이 참조되도록 JavaScript를 정렬하십시오.

  4. 브라우저에서 개발자 콘솔을 항상 확인하십시오. Chrome은 IE의 툴셋이 버전 11에서 크게 개선되었지만 개발자 도구 중 가장 좋은 세트 중 하나입니다. Firefox에서는 애드온 인 Firebug를 다운로드하십시오. 브라우저 개발자 도구에는 콘솔보다 더 많은 기능이 있지만 콘솔에는 JavaScript 오류와 같은 정보가 표시됩니다. 오류는 때로는 둔감 할 수 있습니다.이 경우 StackOverflow에 특정 오류를 가져 와서 도움을 요청할 수 있습니다 (그러나 게시하기 전에 먼저 기존 질문을 검색하는 것을 잊지 마십시오). $(document).ready과 같은 것이 작동하지 않는 경우 달러로 환산됩니다. 페이지에 오류가 있습니다. 이 오류를 수정하여 문제를 해결할 수 있습니다.

마지막으로, 사물 등의 $(document).ready$(window).load jQuery를 기능 것을 기억. 따라서 이러한 것들을 호출하기 전에 jQuery가 참조되는지 확인해야합니다.

관련 문제