0

複数の変数を渡す際に問題が発生しています。ここで基本的な W3schools の例から始めました . 元のサンプルを維持し、startDate と endDate をハード コーディングすると、スクリプトは完全に実行されます。次に、変数の受け渡しに問題があったため、startDate と endDate に Jason Moon のカレンダーを追加しようとしました。理想的には、Jason Moon のカレンダーが startDate と endDate の非表示のテキスト フィールドを作成していることから、カレンダーを含む任意のフィールドが編集されたときにデータ出力を自動的に更新するフォームも必要です。ここに私が持っているものがあります:

    <html>
    <head>
    <script type="text/javascript"> 
    function showReport() 
    { 
        var report = document.getElementById('report').value;
        var startDate = document.getElementById('startDate').value;
        var endDate = document.getElementById('endDate').value;

          if (report=="" && startDate=="" && endDate=="")
          {
            document.getElementById("txtOutput").innerHTML="";
             return;
          }
    if (window.XMLHttpRequest)
      {// code for IE7+, Firefox, Chrome, Opera, Safari
      xmlhttp=new XMLHttpRequest();
      }
    else
      {// code for IE6, IE5
      xmlhttp=new ActiveXObject("Microsoft.XMLHTTP");
      }
    xmlhttp.onreadystatechange=function()
      {
      if (xmlhttp.readyState==4 && xmlhttp.status==200)
        {
        document.getElementById("txtOutput").innerHTML=xmlhttp.responseText;
        }
      }
    xmlhttp.open("GET","report.php?report="+report+"&startDate="+startDate+"&        endDate="+endDate,true);
    xmlhttp.send();
    }
     </script>
     <script type="text/javascript" src="js/cal.js">

    /***********************************************
    * Jason's Date Input Calendar- By Jason Moon http://calendar.moonscript.com/dateinput.cfm
    * Script featured on and available at http://www.dynamicdrive.com
    * Keep this notice intact for use.
    ***********************************************/

    </script>
    </head>
    <body>

    <form>
    <select name="report" onChange="showReport()">
    <option value="">Type:</option>
    <option value="msales">Marketplace</option>
    <option value="lsales">Location</option>
    <option value="cos">COS</option>
    <option value="inventory">Inventory</option>
    </select>
    <br> StartDate:
    <script>DateInput('startDate', true, 'YYYY-MM-DD')</script>

    EndDate:
    <script>DateInput('endDate', true, 'YYYY-MM-DD')</script>
    </form>
    <br>
    <div id="txtOutput"><b>Report info will be listed here.</b></div>

    </body>
    </html>
4

1 に答える 1

0

あなたが抱えている問題は、ID から非表示の入力を選択しようとすることですが、関数 DateInput の最初のパラメーターはフィールドの名前です。

したがって、次の行を変更する必要があります。

var startDate = document.getElementById('startDate').value;
var endDate = document.getElementById('endDate').value;

に :

var startDate = document.getElementsByName('startDate')[0].value;
var endDate = document.getElementsByName('endDate')[0].value;

同じ名前のフィールドが複数ある場合は、必要なフィールドが返されない可能性があることに注意してください。[0] に注意してください。

于 2013-05-24T13:46:40.583 に答える