2017-07-17 21 views
0

私はフォームをセットアップしようとすると、新しいウィンドウが送信され、URLに入力フィールドが挿入されます。現時点ではページをリフレッシュしていますので、ここで不足しているものは何もわかりません。アドバイスは参考になります!フォーム入力フィールドをURLに挿入する方法は?

!! ---更新--- !!

私はDNNを使用しているため、サイトは.aspxにあり、ページ全体がフォームです(つまり、フォーム内にフォームを作成しようとしているので、これは動作しません)。

onClick="this.form.action='https://www.paypal.com/cgi-bin/webscr';this.form.submit();"

<form method="GET" target="_blank" action="https://www.youtube.com/" > 
 
<input id="street_1" name="street_1" placeholder="" type="text" /> 
 
<input id="street_2" name="street_2" placeholder="" type="text" /> 
 
<input id="suburb" name="suburb" placeholder="" type="text" /> 
 
<input id="City" name="City" placeholder="" type="text" /> 
 
<input id="Postcode" name="Postcode" placeholder="" type="text" /> 
 
<button type="submit" id="submit">Submit</button> 
 
</form>

事前に感謝します!興味がある人のために

+1

はいたjsfiddleに

感謝を - それは自動的にページが更新されますそれ以降はクライアントスクリプトを実行できません。 ASP.NET UpdatePanelを使用するか、$ .ajax()を使用してjQuery/javascriptを使用して追加した新しいフォームタグにデータをロードするか、フォーム内でフォームをロードするためにajaxを使用する必要があります。 – Yatin

答えて

0

..私は私のタスク達成HERESにどのように:それは送信ボタンだとして、私は、ここにhttp://jsfiddle.net/t8kAS/

<fieldset> 
    <legend>Customize Link</legend> 
    Value 1: <input type="text" id="street_1" class="jsCustomField" /><br /> 
    Value 2: <input type="text" id="street_2" class="jsCustomField" /><br /> 
    Value 3: <input type="text" id="suburb" class="jsCustomField" /><br /> 
    Value 4: <input type="text" id="city" class="jsCustomField" /><br /> 
    Value 5: <input type="text" id="postcode" class="jsCustomField" /> 
</fieldset> 
<a href="https://www.randomurl.com/stuff/id?street_1=&street_2=&suburb=&city=&postcode=" id="dynLink" target="_blank">Click Me!</a> 

    $(function() { 
     var linkTemplate = "https://www.randomurl.com/stuff/id?street_1={0}&street_2={1}&suburb={2}&city={3}&postcode={4}", 
      $input1 = $("#street_1"), 
      $input2 = $("#street_2"), 
      $input3 = $("#suburb"), 
      $input4 = $("#city"), 
      $input5 = $("#postcode"), 
      $dynLink = $("#dynLink") 

    $(".jsCustomField").on("change", function() { 
     var customLink = linkTemplate.replace("{0}", $input1.val()) 
             .replace("{1}", $input2.val()) 
             .replace("{2}", $input3.val()) 
             .replace("{3}", $input4.val()) 
             .replace("{4}", $input5.val()); 
     $dynLink.attr("href", customLink); 
    }); 


}); 
関連する問題