如何将参数从一个html页面传递到另一个

时间:2019-01-29 03:43:37

标签: javascript html

我有一个带有输入文本框的HTML页面。现在,我需要将该值传递给另一个html页面并读取该值。

我的第一个HTML页面代码:

  <!DOCTYPE html>
  <html>
  <head>
 <form target="_blank" action="indextable.html" method="GET"> 

 <input type="managerid" class="form-control" id="ManagerId" type ="text" 
  autocomplete="off"  maxlength="8" onkeyup="alphanumOnly(this)" 
   placeholder="ManagerId"></input>

 <button id="submit" class="btn btn-primary" style="margin-top: 3px;"  
 this.disabled = true;  >Submit</button>

 <input type="reset" class="btn btn-primary" style="margin-top: 3px;" 
 value="Reset" onClick="window.location.reload()"></input>   
 </form>

我的第二个HTML页面代码:

     <!DOCTYPE html>
     <html>
     <head>
     <script src="index.js" type="text/javascript"></script>
     <body>
     <script type="text/javascript">
     getReporteeList();      //This is javascript function which is there 
                                    in the index.js file
     </script>
     </body>
     ...

当我这样做时,它给我一个错误:

 Uncaught TypeError: Cannot read property 'value' of null
at getReporteeList.

请让我知道我要去哪里了。如果可能,请提供一些示例代码。谢谢。

我的index.js代码

        function alphanumOnly(input){
        var regex = /[^a-zA-Z0-9]/gi;
        input.value = input.value.replace(regex, "");
         }
        var name = document.getElementById('ManagerId').value;
        function getReporteeList() {
        var name = document.getElementById('ManagerId').value;
        console.log(name); 
        $.ajax({
      url:'http://localhost:8088/JirasTrackingApp/
      reporter/Reportees/ReporteeList/'+ $("#ManagerId").val(),
      type:'GET',
      "crossDomain": true,
      beforeSend: function(xhr){
     },

      dataType: 'json',
      success: function(result){   
         var end = new Date().getTime();
         var dur = end - start;
         console.log("millisecs passed",dur);   
           var  size = result.length;
           var content = '';
           var number = 1;
           if(size>0){
            document.getElementById('table').style.display="block";
           $.each(result,function(key,value){
               var num    = number++;
               content += '<tbody>';
               content += '<tr>';
               content += '<td>'+num+'</td>';
               content += '<td>'+value.Name+'</td>';
               content += '<td>'+value.UserId.toUpperCase()+'</td>';
               content += '<td>'+'<a href="#" onclick ="getJira(\'' + value.UserId + '\')">'+value.count+'</a>'+'</td>';
               content += '</tr>';
               content += '<tbody>';
           });

           $('#employee_table').append(content);

        }   
           else{
             alert("Please enter a Valid Associate Id");
         }
         },
        //error: function(result){
            error:function(jqXHR,exception){
               // alert("Invalid input");
               console.log(jqXHR);
               var msg='';
               if (jqXHR.status === "ERR_CONNECTION_REFUSED") {
                msg = 'Connection time out error.';
                alert(msg);
               }
               if (jqXHR.status == 500) {
                //msg = 'Please enter an valid input';
                alert("Please enter an valid input"+ "\n" + "The input must be started with 2 charactes"+
                "\n" + "Followed by 6 digits");
        }
    }

 });

1 个答案:

答案 0 :(得分:1)

您的字段需要具有name属性才能传递值,因为id不会这样做。

index.js 中的javascript DOM元素选择器(document.getElementById('ManagerId').value等)正在寻找第2页上似乎不存在的元素。您需要做更多的工作才能使用window.location.search()从URL中实际提取参数。参见:How to obtain the query string from the current URL with JavaScript?