2017-01-28 40 views
0

シンプルなWebフォームで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を調べると、要素IDを含むすべてのものが期待していたものと一致しますか?これらは、完全な質問をするために、あなたの質問に、初めに、尋ねることなしに含める必要がある詳細の種類です。 – mason

答えて

1

問題がtbxFromDatetbxToDateが元にないことですHTMLのist。コントロールはコンテンツコントロール内にあるため、IDが変更されて重複がないようにします。

IDはおそらく次のようになります。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

関連する問題