クエリーから入力されたフォームに基づいてフォームフィールドを事前入力する

Question

入力ボックスの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=""> 

私のクエリは、私が最初に私が欲しいのcfoutputクエリにそれらのフォーム入力フィールドをラップし、value入力フィールドに変数を割り当てるが、thatsのは、それを事前に移入されたみました何

<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> 

です更新するフォーム情報。私が注文番号フィールドのために入れたものに基づいています。

アドバイスをいただければ幸いです。

Answer 1

http://api.jquery.com/jquery.ajax/が最適です。 ordernumフィールドの3番目のキーストロークでは、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>