2つのテキストボックスからの2datesを比較するjavascriptコードを書いた
function CompareDates() {
var fdate = document.getElementById('txtFromDate');
var edate = document.getElementById('txtToDate');
var FromDate = fdate.value.split('/');
var EndDate = edate.value.split('/');
var val = 'false';
if (parseInt(FromDate[2]) < parseInt(EndDate[2])) {
val = 'true';
return true;
}
else if (parseInt(FromDate[2]) == parseInt(EndDate[2])) {
if (parseInt(FromDate[0]) < parseInt(EndDate[0])) {
val = 'true';
return true;
}
else if (parseInt(FromDate[0]) == parseInt(EndDate[0])) {
if (parseInt(FromDate[1]) <= parseInt(EndDate[1])) {
val = 'true';
return true;
}
}
}
if (val == "false") {
alert("FromDate Always Less Than ToDate");
return false;
}
}
そしてhtmlコードは
<asp:TextBox ID="txtFromDate" runat="server" Width="150px" />
<ajaxToolkit:CalendarExtender CssClass="MyCalendar" runat="server"
ID="ceFromDate"
TargetControlID="txtFromDate"
Format="dd/MM/yyyy" />
<asp:TextBox ID="txtToDate" runat="server" Width="150px" />
<ajaxToolkit:CalendarExtender CssClass="MyCalendar" runat="server"
ID="ceToDAte"
TargetControlID="txtToDate"
Format="dd/MM/yyyy" />
<asp:Button ID="btnGenerate" runat="server" CssClass="button"
Text="Generate" OnClientClick="if(!CompareDates()) return false;"
OnClick="btnGenerate_Click" />
問題は、ページがchromeで正常に実行されていることですが、IEでアプリケーションを実行すると、エラーがスローされます。
0x800a138f-JavaScriptランタイムエラー:未定義またはnull参照のプロパティ '値'を取得できません
この問題を克服するために私を助けてください。
エラーはここにあります:
var fdate = document.getElementById('txtFromDate');
var edate = document.getElementById('txtToDate');
問題は、txtFromDate
およびtxtToDate
がコントロールのサーバー名であり、クライアント名ではないことです(ブラウザーからページのソースを確認してください)。
これを試して:
var fdate = document.getElementById('<%=txtFromDate.ClientID%>');
var edate = document.getElementById('<%=txtToDate.ClientID%>');
JavaScriptが外部JSファイルにある場合(そうする必要があります)、投稿されたソリューションは機能しません。ただし、テキストフィールドに一意のクラス名を付けて、コードを次のように変更できます。
<asp:TextBox ID="txtFromDate" runat="server" Width="150px" CssClass="txtFromDate" />
<asp:TextBox ID="txtToDate" runat="server" Width="150px" CssClass="txtToDate" />
そしてあなたのjavascript:
var fdate = document.getElementsByClassName('txtFromDate')[0];
var edate = document.getElementsByClassName('txtToDate')[0];
これをお試しください
document.getElementById('<%=txtFromDate.ClientID %>')
次のようにコードを変更します。
function CompareDates() {
var fdate = document.getElementById('<%=txtFromDate.ClientID %>');
var edate = document.getElementById('<%=txtFromDate.ClientID %>');
var FromDate = fdate.value.split('/');
var EndDate = edate.value.split('/');
var val = 'false';
if (parseInt(FromDate[2]) < parseInt(EndDate[2])) {
val = 'true';
return true;
}
else if (parseInt(FromDate[2]) == parseInt(EndDate[2])) {
if (parseInt(FromDate[0]) < parseInt(EndDate[0])) {
val = 'true';
return true;
}
else if (parseInt(FromDate[0]) == parseInt(EndDate[0])) {
if (parseInt(FromDate[1]) <= parseInt(EndDate[1])) {
val = 'true';
return true;
}
}
}
if (val == "false") {
alert("FromDate Always Less Than ToDate");
return false;
}
}
ID参照の#
がありません。
から変更する:
var fdate = document.getElementById('txtFromDate');
に:
var fdate = document.getElementById('#txtFromDate');
上記の説明について私は間違っていました。
_#
が欠落していたjqueryコードで同じエラーを修正できました。 getElementById
には、この特殊文字は必要ありません。