簡單的Javascript函數不工作.ascx文件

Question

我想在我的asp.net和vb.net應用程序中的.ascx文件中工作一個簡單的JavaScript函數。我在asp面板標籤中包含了下面的html代碼。

    <div class="inline" > 

        <asp:CheckBox ID="tick" runat="server" Text="Please tick the box to confirm the above information are correct" Checked="false" CssClass="small" onchange="EnableSubmit()" /> 
       </div> 

，並在.ascx文件

<script type="text/javascript"> 
function EnableSubmit() { 

    if (document.getElementById("tick").checked == true) { 


     document.getElementById("uxSubmit").enabled = true; 
    } 
    else { 
     document.getElementById("uxSubmit").enabled = false; 
    } 


} 

你可以從我試圖包含一個複選框代碼中看到下面的JavaScript代碼。用戶必須勾選複選框才能使提交按鈕處於活動狀態。但該功能不起作用。每當我勾選複選框時，屏幕前方會出現一個白色框（如popoup）。

我已經嘗試了這個鏈接給出的答案，但以這種方式我的整個形式變得無形。 How to use javascript in .ascx pages

我很感謝您的建議和幫助。

謝謝

在.ascx文件的完整代碼給出。請到讓我知道如果你需要更多的信息。

<%@ Control Language="VB" AutoEventWireup="false" CodeFile="CandidateRegistration3.ascx.vb" 
Inherits="_controls_CandidateRegistration3" %> 

<asp:CustomValidator ID="uxProfileCVValReq" runat="server" EnableViewState="false" 
ErrorMessage="You create a 'Personal Profile' or upload a Word Compatible or PDF 'Curriculum Vitae'." 
ValidationGroup="candidateregistration" Display="None" /> 

<div style="margin-bottom: 20px;"> 
<asp:Panel ID="panUpload" runat="server"> 
    <asp:CustomValidator ID="CustomValidator1" runat="server" EnableViewState="false" 
     ErrorMessage="You must upload a Word Compatible or PDF 'Curriculum Vitae'." Display="None" 
     ValidationGroup="CVUpload" /> 
    <p>Your registration form will be populated from the details contained in your CV or application form, please upload now.</p> 
    <asp:FileUpload ID="txtFilePath" runat="server" CssClass="" ValidationGroup="CVUpload" /> 

    <asp:HiddenField ID="hdDocId" runat="server" /> 
</asp:Panel> 
<asp:Panel ID="panForm" runat="server" Visible="false"> 

    <table class="table table-bordered"> 

     <tr> 
      <td><label>Email Address</label></td> 
      <td> 
       <asp:TextBox ID="uxEmail" runat="server" CssClass="" MaxLength="100" 
        EnableViewState="False" /> 

      </td> 
     </tr> 
     <tr> 
      <td><label>Password</label></td> 
      <td> 
       <asp:TextBox ID="uxPassword" runat="server" CssClass="" MaxLength="20" 
        EnableViewState="False" TextMode="Password" /> 
      </td> 
     </tr> 
     <tr> 
      <td><label>Confirm Password </label></td> 
      <td> 
       <asp:TextBox ID="uxPasswordConfirm" runat="server" CssClass="" TextMode="Password" /> 
      </td> 
     </tr> 
    </table> 

    <asp:CustomValidator ID="uxCVFileTypeReq" runat="server" EnableViewState="false" 
     ErrorMessage="You must upload a Word Compatible or PDF 'Curriculum Vitae'." Display="None" 
     ValidationGroup="CVUpload" /> 
    <asp:HiddenField ID="uxCVID" runat="server" EnableViewState="false" /> 

    <p>To complete your registration please click Next.</p> 

    <div class="inline" > 

     <asp:CheckBox ID="tick" runat="server" Text="Please tick the box to confirm the above information are correct" Checked="false" CssClass="small" onchange="EnableSubmit()" /> 

    </div> 

</asp:Panel> 
</div> 

    <p class=""> 
     <asp:LinkButton runat="server" ID="uxSubmit" Text="Next" OnClick="SaveClick" CausesValidation="true" ValidationGroup="candidateregistration" CssClass="button2" Enabled="false" /> 

     <a href="#" onclick="parent.$.colorbox.close()" class="button2">Cancel</a> 
     <asp:LinkButton runat="server" ID="uxUpload" Text="Upload" CssClass="button2" CausesValidation="true" ValidationGroup="CVUpload" /> </p> 


<script type="text/javascript"> 
    function EnableSubmit() { 

     if (document.getElementById("tick").checked == true) { 


       document.getElementById("uxSubmit").enabled = true; 
      } 
     else { 
      document.getElementById("uxSubmit").enabled = false; 
      } 


     } 
</script> 

理解這個問題更好的，我講的，看看我的網頁直播請到以下鏈接。 http://t.c.mypeoplebiz.com/sagepay-careers/2935-commercial-litigator-solicitor-1-3-years-pqe.aspx

然後單擊立即應用按鈕。

將出現一個彈出窗口。請給出一個電子郵件地址進行註冊。 （不用擔心，它不必是一個原始的電子郵件地址，只需abc@xyz.com就可以）。

當您上傳文檔時，您可以看到該表單。複選框位於頁面的底部。

Answer 1

在您的瀏覽器中，右鍵單擊該頁面，單擊查看源代碼（或者您爲瀏覽器執行此操作）。注意到ID已經改變了？這使得它沒有找到你的元素來啓用它們。

<script type="text/javascript"> 
function EnableSubmit() { 
    if (document.getElementById('<%= tick.ClientId %>').checked == true) { 
     document.getElementById('<%= uxSubmit.ClientId %>').enabled = true; 
    } 
    else { 
     document.getElementById('<%= uxSubmit.ClientId %>').enabled = false; 
    } 
} 
</script> 

一個解決方案是將客戶端ID嵌入到帶有內聯服務器端表達式的腳本中。另一種是更改ClientIDMode。將ClientIdMode設置爲static將使客戶端在客戶端和服務器上使用相同的ID，從而避免需要內聯表達式。

Answer 2

ASP.NET對設置爲runat =「server」的任何內容的ID進行了修改。您需要詢問該控件的實際ID。如在：

function EnableSubmit() { 

    var id = "<%= tick.ClientID %>"; 
    if (document.getElementById(id).checked == true) { 

     ... 
    } 


}