2017-06-14 113 views
1

我输入了表单字段,当我在其中一个输入框中键入例如订单号码时,我想要预先填充该表单字段。我已经成功地编写了查询并通过执行cfdump成功输出了该查询。然而,我不知道我将如何自动填充这些字段的基础上,我把它放在表单文本字段中的订单号码呢?如果我将我准备的查询中的变量放入value,它将预先填充表单字段,但我希望表单字段根据我为订单#放置的内容进行更新?基于来自查询的表单输入预填充表单字段

我必须使用JavaScript才能完成此操作吗?

这是我的输入表单。

<label for="ordernum">Order #</label> 
<input type="text" name="ordernum" value=""> 
<label for="companyname">Company Name</label> 
<input type="text" name="companyname" value=""> 
<label for="resident">Resident</label> 
<input type="text" name="resident" value=""> 
<label for="complexname">Complex Name</label> 
<input type="text" name="complexname" value=""> 
<label for="suitenum">Suite #</label> 
<input type="text" name="suitenum" value=""> 

这里是我的查询

<cfquery name="testForm" datasource="randomData"> 
SELECT [COMPANY NAME] AS COMPANYNAME, [RESIDENT], [COMPLEX NAME] AS 
COMPLEXNAME, [SUITE##] AS SUITE, [ORDER##] AS ORDER 
FROM tests.DB 
WHERE [ORDER##] = 112211 
</cfquery> 

我试图最初被包裹的形式输入字段成CFOUTPUT查询和分配变量到value输入字段但那预填充它,我想要更新的表单信息。基于我为订单号字段输入的内容。

任何意见将不胜感激。

+1

ajax调用是不刷新页面的选项 – tech2017

回答

0

http://api.jquery.com/jquery.ajax/是你最好的选择。在ordernum字段的第三个按键上,您可以使用ajax检索查询结果。我会用制表符分隔值来保持简单。然后填写该数据集中每列的字段。

<input type="text" name="ordernum" value="" id="search"> 
<script> 
$('#search').keyup(getResults); 
function getResults(){ 
    myVal = $('#search').val() ; 
    if (myVal.length < 3) { 
    $('#list').html(''); 
    } else { 
    $.ajax({ 
     url: './search.cfm?search='+myVal, 
     success: function(data) { 
      // fill in the fields with the data 
     }, 
     dataType: 'html', 
     timeout: 1000, 
     error: function(x, t, m) { 
     if(t==="timeout") { 
      alert("Something went wrong."); 
     } else { 
      alert(t); 
     } 
     } 
    }); 
    } 
} 
</script>