2016-05-18 10 views
-1

ユーザーが値を指定してボタンをクリックできるようにするため、入力に基づいてカスタマイズされたURLに移動します。ユーザー入力値を動的URLに渡す方法

以下はこれまでのところです。唯一の問題は何らかの理由で私がGoボタンをクリックしたときに私のuser_inputデータがURLに渡されていないことです。

<!DOCTYPE html> 
<html lang="en"> 
<head> 
<title>Test</title> 
<p>Testing</p> 
</head> 
<body> 
<label for="Store_No">Store_No</label> 
<input type = "text" id="user_input"></input> 


<form action="http://XXX/XX?Store_No="+user_input> 
<input type="submit" value="Go"> 
</form> 



</body> 
</html> 
+0

に行くことができます... action = "..." + user_input> 'です。これはHTMLでは許されませんが、URLの場所を表示するにはJavaScriptを使用する必要があります。 – Himmel

+0

これはどういう意味ですか?私はURLにリダイレクトすることができます。 http://jsfiddle.net/wp2rjzkd/ – riteshmeher

+0

実際、これはより良い一致かもしれません:http://stackoverflow.com/questions/34128361/appending-form-input-value-to-action-url-as-path –

答えて

2

これはJavacriptを必要としません。これはHTMLフォームの仕組みに関する基本的な知識です。

<form action="http://example.com/" method="get"> 
<label for="Store_No">Store_No</label> 
<input type="text" id="Store_No" name="Store_No"> 
<input type="submit" value="Go"> 
</form> 

入力フィールドには、ターゲットURLに表示するパラメータの適切な名前が設定されます。フォームフィールドに

タイプ「123」を押し、「移動」 - そしてそれはhttp://example.com/?Store_No=123あなたが行 `でそれを使用している方法で、HTMLに動的変数を使用することはできません

+0

何らかの理由で、私が変更したのはアクション内のURLだったので、テキストは最初のスラッシュ/の直後にURLの中央に置かれました。 – Joe

+0

何ですか?あなたが変更したものを正確に表示してください。 – CBroe

関連する問題