jquery - 送信時に入力フィールドにテキストを追加する

Question

次のようなフォームがあります。

<form>
    <input type="text" value="" name="order[]" title="Salmon"  />
    <input type="text" value="" name="order[]" title="Trout"  />
    <input type="text" value="" name="order[]" title="Halibut"  />
    <input type="text" value="" name="order[]" title="Crab"  />
            <button type="submit">Submit</button>
</form>

ユーザーは値に数値を入力します。彼らがフォームを送信するとき、各入力のタイトルを送信に追加したいと思います。したがって、ユーザーが最初の入力フィールドに「5」を入力すると、値は「Salmon - 5」として送信されます。

jQueryでこれをどのように達成できますか?

Answer 1

ここで動作していますhttp://jsfiddle.net/NLtS9/6/。type="submit" を type="button" に変更します

        $('button').click(function () {
            $('input[name="order[]"]').map(function () {
                $(this).val($(this).attr('title') + ' - ' + $(this).val());
                alert($(this).val());
            });
        });

Answer 2

これを試して

 $('button').click(function(){
      $('input').each(function(index,data) {
        $(this).val( $(this).attr('title')+"-"+$(this).val());
       });
    })

Answer 3

ボタンを送信ボタンではなく単純なボタンにしてから実行します

$('button').click(function(){
      $('input[name="order"]').map(function () {
         $(this).val($(this).attr('title') + ' - ' $(this).val());
      });
      $('form').submit();
    })

Answer 4

もしかしてこういうこと？

$('button').click(function () {
    $('input[name="order"]').map(function () {
        $(this).val($(this).attr('title') + ' - ' $(this).val());
    });

    ('form').submit();
});

Answer 5

submitjQuery でイベント ハンドラーを使用します。この更新されたコードは私のローカルホストで機能します

$(document).ready(function(){
    $('form').submit(function (ele) {
        ele.preventDefault(); // don't submit multiple times
        $('input[type="text"]').each(function(_,e){
             var old_val =  $(e).val();
             $(e).attr('data-old', old_val).val($(e).attr('title') + '-' + old_val);
        });

        this.submit(); // use the native submit method of the form element
        $('input[type="text"]').each(function(_,e){
             $(e).val($(e).attr('data-old'));
        });
    });
});

HTMLを置き換えbuttonて、明示的inputに表示します。action

<form method="post">
    <input type="text" value="" name="order[]" title="Salmon"  />
    <input type="text" value="" name="order[]" title="Trout"  />
    <input type="text" value="" name="order[]" title="Halibut"  />
    <input type="text" value="" name="order[]" title="Crab"  />
    <input type="submit" value="submit"></button>
</form>