【问题标题】:JavaScript/Ajax: Populate a Hidden FieldJavaScript/Ajax:填充隐藏字段
【发布时间】:2010-08-12 16:34:52
【问题描述】:

嘿,你们这些程序员过去对我非常有帮助,所以我想我会再次在这里问我的问题。这可能是一个简单的修复,但我是 JavaScript 和 Ajax 的新手。

我正在工作的是 Ajax,它写入一个 responseText 声明,如果在文本字段失去焦点时找不到它,则 "LOCATION NOT FOUND"。如果这个 responseText 存在,我想做的是阻止表单提交。如果隐藏字段的值为 LOCATION NOT FOUND,我知道如何防止表单提交,所以我认为让 JavaScript 用 responseText 填充隐藏字段可能是最简单的解决方案?不确定这是否可行或如何去做。

这是我当前的 JS:

 <script type="text/javascript">
  <!-- 
  function newXMLHttpRequest() 
  {
   var xmlreq = false;
   if (window.XMLHttpRequest) 
   {
    xmlreq = new XMLHttpRequest();
   } 
   else if (window.ActiveXObject) 
   {
    try 
    {
     xmlreq = new ActiveXObject("Microsoft.XMLHTTP");
    }
    catch (e2) 
    {
     alert("Error: Unable to create an XMLHttpRequest.");
    }
   }
   return xmlreq;
  }
  function getLocation(locationrouting) 
    {
   var getLocation= newXMLHttpRequest(); // sending request
   getLocation.open("GET", "/PP?PAGE=GETLOCATIONNAME&ROUTINGNUM=" + locationrouting, false);
   getLocation.send(null); // getting location

     var dv = document.getElementById("location_div");

     if (getlocation.responseText === 'LOCATION NOT FOUND')
     {
       dv.style.color = "red";
     }
      else 
     {
      dv.style.color = "black";
    }
   dv.innerHTML = getLocation.responseText;
    }
  //-->
 </script>

这是表格的适用部分:

    <form name="locationform" id="locationform" action="/PP?PAGE=POSTADDLOCATION" method="post">
        <tr>
         <td class="ajax_msg">
            <div id="location_div">/div>       
         </td>
        </tr>
        <tr>
     <td>
       <div class="column1" id="locationrouting_div">
             <p class="label_top">
*Routing Number</p>
         <p class="field_top">
                  <input type="text" id="locationrouting" name="locationrouting" size="28" maxlength="9" onblur="getLocation(this.value);" /></p>

    ...

提前致谢!

【问题讨论】:

    标签: javascript forms hidden-field populate


    【解决方案1】:

    作为一个选项,您可以创建 javascript 变量 var isSubmitAllowed = true;,当找不到位置时将此变量设置为 false,并检查此变量以防止提交表单。

    类似:

    <script type="text/javascript">
      <!-- 
      var isSubmitAllowed = true;
    
      function newXMLHttpRequest() 
      {
       var xmlreq = false;
       if (window.XMLHttpRequest) 
       {
        xmlreq = new XMLHttpRequest();
       } 
       else if (window.ActiveXObject) 
       {
        try 
        {
         xmlreq = new ActiveXObject("Microsoft.XMLHTTP");
        }
        catch (e2) 
        {
         alert("Error: Unable to create an XMLHttpRequest.");
        }
       }
       return xmlreq;
      }
      function getLocation(locationrouting) 
        {
       var getLocation= newXMLHttpRequest(); // sending request
       getLocation.open("GET", "/PP?PAGE=GETLOCATIONNAME&ROUTINGNUM=" + locationrouting, false);
       getLocation.send(null); // getting location
    
         var dv = document.getElementById("location_div");
    
         if (getlocation.responseText === 'LOCATION NOT FOUND')
         {
           dv.style.color = "red";
           isSubmitAllowed = false;
         }
          else 
         {
          dv.style.color = "black";
          isSubmitAllowed = true;
        }
       dv.innerHTML = getLocation.responseText;
        }
      //-->
     </script>
    

    然后在Form 标签中添加onSubmit 事件处理程序,它将返回isSubmitAllowed 值:

    <form name="locationform" id="locationform" action="/PP?PAGE=POSTADDLOCATION" method="post" onSubmit="return isSubmitAllowed">
    

    【讨论】:

    • 听起来很有希望,但不太确定如何去做。你有例子吗?
    • 你的意思是这样的吗?函数 getLocation(locationrouting) { ar getLocation= newXMLHttpRequest(); getLocation.open("GET", "/PP?PAGE=GETLOCATIONNAME&ROUTINGNUM=" + locationrouting, false); getLocation.send(null); var dv = document.getElementById("location_div"); if (getlocation.responseText === '位置未找到') { dv.style.color = "red"; var isSubmitAlowed = false; } 其他 { dv.style.color = "黑色"; var isSubmitAlowed = true; } dv.innerHTML = getLocation.responseText; }
    【解决方案2】:

    如果您不想在找不到位置的情况下提交表单,最简单的方法可能是在提交之前查询服务器。这比通过其副作用检查以前可能发生或未发生的查询的状态更容易实现和使用。 :D

    【讨论】:

    • 同意。但是我的雇主希望我在前端做这件事。在后端工作的程序员是我的老板,他宁愿让我找到解决方案。
    • 你的解决方案是我可以用 JavaScript 实现的,还是必须在服务器上配置?
    • @Spockrates 如果响应文本 !== "LOCATION NOT FOUND",则只需发送另一个 ajax 请求并提交表单即可
    猜你喜欢
    • 2011-03-29
    • 1970-01-01
    • 2014-05-15
    • 1970-01-01
    • 1970-01-01
    • 2013-07-22
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    相关资源
    最近更新 更多