2015-10-25 144 views
-2

我一直在一个页面上有3个输入字段和3个按钮。输入字段是Date,Territory和Town,而按钮是Save,Back和Add。 保存和添加按钮被禁用,直到用户在3个输入字段中输入值。当用户在日期和城镇字段中输入值时,会出现一个表格。领土字段过滤城镇字段中的内容/选项。问题是,放置在服务器上的JavaScript不起作用。Javascript在本地但不在服务器上工作

这里是内嵌Javascript的HTML代码。

<!DOCTYPE html> 
<html lang="en"> 

<head> 

    <meta charset="utf-8"> 
    <meta http-equiv="X-UA-Compatible" content="IE=edge"> 
    <meta name="viewport" content="width=device-width, initial-scale=1"> 
    <meta name="description" content=""> 

    <link rel="icon" href="../images/logo.ico"> 
    <link rel="stylesheet" type="text/css" href="../css/allStyle.css"> 
    <link rel="stylesheet" href="../css/jquery-ui.css" /> 
    <link rel="stylesheet" href="../css/runnable.css" /> 
    <script src="../js/datepick.js"></script> 
    <script src="../js/datepick1.js"></script> 
    <script src="../js/script.js"></script> 

    <script type ="text/javascript"> 
    //DISABLING SAVE AND ADD WHEN INPUT FIELDS ARE EMPTY 
    $(function(){ 
      //Set button disabled 
      $("#subAdd").attr("disabled", "disabled"); 
      $("#subSv").attr("disabled", "disabled"); 

      //Append a change event listener to input 
      $("input[name='txtDay']").change(function(){ 

       if($(this).val().length > 0) { 
        $("input[type='submit']").removeAttr("disabled"); 
       }        
      }); 

      $("input[name='terlist']").change(function(){ 

       if($(this).val().length > 0) { 
        $("input[type='submit']").removeAttr("disabled"); 
       }        
      }); 

      $("input[name='town-list']").change(function(){ 

       if($(this).val().length > 0) { 
        $("input[type='submit']").removeAttr("disabled"); 
       }        
      }); 

      //trigger the a change event 
      $("input[name='txtDay'], input[name='town-list'], input[name='terlist']").trigger('change'); 
    }); 
    </script> 

    <script type ="text/javascript"> 
    //GETTING SAVED MCP RECORDS DATABASE 
    function getData(val){ 
      $.ajax({ 
      type: "POST", 
      url: "mcp_getdate.php", 
      data:'target_date='+val, 
      success: function(data){ 
       $("#list-added").html(data); 
       document.getElementById("town-list").onchange(); 
      } 
      }); 
    } 
    </script> 

    <script type ="text/javascript"> 
    //GETTING TERRITORIES IN DATABASE 
    function getTown(val){ 
     $.ajax({ 
     type: "POST", 
     url: "mcp_gettown.php", 
     data:'territory_id='+val, 
     success: function(data){ 
      $("#town-list").html(data); 
     } 
     }); 
    } 
    </script> 

    <script type ="text/javascript"> 
    //GETTING DATABASE VALUES FOR ADD 
    function submitForm() { 
      var myDate = document.getElementById("datepicker").value; 
      var myFrame = document.getElementById("mcpFrame"); 
      var myCheckboxes = new Array(); 
      $("input:checked").each(function() { 
       myCheckboxes.push($(this).val()); 
      }); 

      $.ajax({ 
       type: "POST", 
       url: "mcp_set.php", 
       dataType: 'html', 
       data: 'search_value='+myCheckboxes+'&date_value='+myDate+'&mcpFrame'+myFrame, 
       success: function(data){ 
        $("#list-added").html(data); 
        document.getElementById("town-list").value = ""; 
        document.getElementById("town-list").onchange(); 
       } 
      }); 
      return false; 

    } 
    </script> 

    <script type ="text/javascript"> 
    // SETTING CHECKBOXES 
    function getSchool(val){ 
      var myDate = document.getElementById("datepicker").value; 
      $.ajax({ 
      type: "POST", 
      url: "mcp_settown.php", 
      data:'town_id='+val+'&target_date='+myDate, 
      success: function(data){ 
       $("#school-list").html(data); 
      } 
      }); 
    } 
    </script> 
</head> 

<body> 

     <!--HEADER--> 

     <table class="table tableser"> 
      <tr> 
       <td class="tableser" width="50%"></td> 
       <?php 
        if(empty($_SESSION["user_id"])) { 
         header('Location: ../login/index.php'); 
         exit(); 
        } 
        else{ 
         if($_SESSION["dept_id"] == 2) { 
       ?> 
       <td class="tableser" align="right" style="vertical-align:bottom" width="50%"><b><?php echo "NAME : " . $_SESSION["emp_name"]; ?></b></td> 
       <?php 
         }      
         if($_SESSION["dept_id"] != 2) { 
         session_unset(); 

         // destroy the session 
         session_destroy(); 
         header('Location: ../login/index.php'); 
         exit(); 
         } 
        } 
       ?> 
       <td class="tableser" width="4%" style="vertical-align:bottom" align="right"><b><a href="../logout/index.php">(LOGOUT)</a></b></td> 
      </tr> 
     </table> 
     <hr> 

     <!--Save and Back --> 

     <table class="tableser"> 
       <tr> 
        <td class="tableser" width="90%"><b>Monthly Call Plan Entry</b></td> 
       </tr> 
       <tr> 
        <td class="tableser"> 
         <form method="post" id="myForm" name="myForm" action="<?php echo htmlspecialchars($_SERVER["PHP_SELF"]);?>"> 
          <input type="submit" id="subSv" name="subSv" value="Save" style="height:25px; width:80px; font-face: 'Comic Sans MS'; font-size: larger"/> 
         </form> 
        </td> 
        <td class="tableser" align = "right"> 
         <form method="post" id="myForm" name="myForm" action="<?php echo htmlspecialchars($_SERVER["PHP_SELF"]);?>"> 
          <input type="submit" name="subHd" value="Back" style="height:25px; width:80px; font-face: 'Comic Sans MS'; font-size: larger"/> 
         </form> 
        </td> 
       </tr> 
     </table>  
     <hr> 

     <!--CONTENT--> 

     <form method="post" id="myForm" name="myForm" action=""> 
      <table class="tableser"> 
       <tr> 
        <td class="tableser">Date</td> 
        <td class="tableser"> 
         <input type="text" name="txtDay" id="datepicker" placeholder="Enter date." size="35px" onChange="getData(this.value);" required /> 
        </td> 
       </tr> 
       <tr> 
        <td class="tableser">Territory</td> 
        <td class="tableser"> 
         <select name="terlist" id="terr-list" style="height:25px; width:279px; font-face: 'Comic Sans MS'; font-size: larger" onChange="getTown(this.value);"> 
          <option value="" selected="selected">Select Territory..</option> 
          <?php 
           $sqlTer = "SELECT DISTINCT tbl_all.territory_id, tbl_all.user_id , tbl_territory.province FROM tbl_all 
                JOIN tbl_territory ON tbl_all.territory_id = tbl_territory.territory_id 
                WHERE user_id = ".$_SESSION["user_id"]." "; 
           $result_sqlTer = $conn->query($sqlTer); 
           while($row = $result_sqlTer->fetch_assoc()) 
           { 
           ?> 
            <option value="<?php echo $row["territory_id"]; ?>"><?php echo $row["province"]; ?></option> 
           <?php 
           } 
           ?>    
         </select> 
        </td> 
       </tr> 
       <tr> 
        <td class="tableser">Town</td> 
        <td class="tableser"> 
         <select name="townlist" id="town-list" style="height:25px; width:279px; font-face: 'Comic Sans MS'; font-size: larger" onChange="getSchool(this.value);" > 
          <option value="" selected="selected">Select Town..</option> 
         </select> 
        </td> 
       </tr> 
      </table> 
     <br> 

     <div id="school-list" style="overflow-y: auto;" > 
     </div> 


     <br> 
     <input type="submit" id="subAdd" name="subAdd" value="Add" onclick="return submitForm()" style="height:25px; width:80px; font-face: 'Comic Sans MS'; font-size: larger" /> 
     <br> 
     </form> 

     <br> 
     <div id= "list-added" style="overflow-y: auto;"> 
     </div> 
     <center> 
     <iframe id="mcpFrame" name="mcpFrame" style="visibility:hidden;display:none"></iframe> 
     </center> 
</body> 
</html> 
+0

控制台上的任何错误 – CodeLove

+1

您不在任何地方包含jQuery,它是否是其他脚本之一? – jeroen

+0

为了清楚起见,服务器将html/javascript发送到客户端(通常是浏览器),然后呈现您的页面并运行您的JavaScript代码。那是你正在尝试做什么? – user2263572

回答

0

请在页面中包含jquery- [version] .js,我发现它已丢失。希望你没有将jquery- [version] .js重命名为script.js。

+0

我有jquery-1.11.3,但我没有把它包含在脚本中,因为它仍然可以在没有它的地方工作。 –

相关问题