2015-10-25 4 views
-2

Я работаю на странице с тремя полями ввода и тремя кнопками. Поля ввода - это дата, территория и город, а кнопки - «Сохранить», «Назад» и «Добавить». Кнопки «Сохранить» и «Добавить» отключены, пока пользователь не вводит значения в 3 поля ввода. Когда пользователь вводит значение в поле даты и города, появится таблица. В то время как поле территории фильтрует содержимое/параметры в поле города. Проблема в том, что javascript не работает при размещении на сервере.Javascript работает на локальном, но не на сервере

Вот коды HTML со встроенным Javascript.

<!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, но я не включил его в скрипты, так как он по-прежнему работает на локальном без него. –

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