2017-01-28 5 views
0

В простой веб-форме Pikaday работает хорошо, но когда я использую это на странице содержания, это не работает, для лучшего понимания я даю код .. .... заранее спасибоASP.NET Pikaday не работает с главной страницей

<%@ Master Language="C#" AutoEventWireup="true" CodeBehind="Site1.master.cs" Inherits="Test2.Site1" %> 

<!DOCTYPE html> 
<html xmlns="http://www.w3.org/1999/xhtml"> 
<head runat="server"> 
    <title></title> 
    <link href="css/pikaday.css" rel="stylesheet" /> 
    <link href="css/theme.css" rel="stylesheet" /> 
    <script src="js/pikaday.js"></script> 
</head> 
<body> 
    <form id="form1" runat="server"> 
     <div> 
      <asp:ContentPlaceHolder ID="ContentPlaceHolder1" runat="server"> 
      </asp:ContentPlaceHolder> 
     </div> 
    </form> 
</body> 
</html> 

и код страницы содержимого

<%@ Page Title="" Language="C#" MasterPageFile="~/Site1.Master" AutoEventWireup="true" CodeBehind="ContentPage.aspx.cs" Inherits="Test2.WebForm2" %> 

<asp:Content ID="Content2" ContentPlaceHolderID="ContentPlaceHolder1" runat="server"> 
    <asp:ScriptManager ID="ScriptManager1" runat="server"></asp:ScriptManager> 
    <asp:UpdatePanel ID="UpdatePanel1" runat="server"> 
     <ContentTemplate> 
      <h4>This is from content page</h4> 
      <asp:TextBox ID="tbxFromDate" runat="server"></asp:TextBox> 
      <asp:TextBox ID="tbxToDate" runat="server"></asp:TextBox> 

      <script type="text/javascript"> 
       var picker1 = new Pikaday({ 
        field: document.getElementById('tbxFromDate'), 
        theme: 'dark-theme' 
       }); 
       var picker2 = new Pikaday({ 
        field: document.getElementById('tbxToDate'), 
        theme: 'dark-theme' 
       }); 
      </script> 
     </ContentTemplate> 
    </asp:UpdatePanel> 
</asp:Content> 

Я не понимаю, что я пропускаю

+1

Я не понимаю, что означает «не работает». Опишите поведение, которое вы видите, и опишите поведение, которое вы ожидали увидеть. Существуют ли ошибки на стороне сервера? Любые ошибки JavaScript на стороне клиента в консоли? Если вы установите контрольную точку в своем коде, достигнут ли она? Когда вы проверяете полученный HTML-код в браузере, все ли, включая идентификаторы элементов, соответствует тому, что вы ожидали? Пожалуйста, имейте в виду, это те детали, которые вам нужно включить в свой вопрос, в начале, без запроса, чтобы задать полный вопрос. – mason

ответ

1

проблема заключается в том, что tbxFromDate и tbxToDate не исключая ist в HTML. Поскольку элементы управления находятся в контроле контента, их идентификаторы меняются, чтобы убедиться, что дубликатов нет.

Их идентификатор, вероятно, выглядит примерно так: ContentPlaceHolder1_tbxFromDate.

Для этого вам необходимо обратиться к их ClientID. Поэтому используйте

<script type="text/javascript"> 
    var picker1 = new Pikaday({ 
     field: document.getElementById('<%= tbxFromDate.ClientID %>'), 
     theme: 'dark-theme' 
    }); 
    var picker2 = new Pikaday({ 
     field: document.getElementById('<%= tbxToDate.ClientID %>'), 
     theme: 'dark-theme' 
    }); 
</script> 
+1

Если бы я был вами, я бы задержался на отправке ответа до тех пор, пока на вопрос 1) не было четко указано, что «не работает» и 2) продемонстрировал попытку базовой отладки. Изучение того, как выполнять базовую отладку и задавать хороший вопрос, в долгосрочной перспективе сделает их гораздо более хорошими, чем предоставление ответа. – mason

+0

Это работает хорошо и жаль, что на этот раз за мою ошибку я могу отредактировать этот пост сейчас? – Simon

Смежные вопросы