ワイズリマインダー

formをjQueryでcloneするとselectの変更が反映されない件

$(function(){
  $('#form1').submit(function(){
    var f=$('#form1').clone(false);
    $.ajax({
      type:'post'
     ,cache:false
     ,url:'送信先URL'
     ,dataType:'json'
     ,data:new FormData(f.get()[0])
     ,processData:false
     ,contentType:false
    }).then(function(json){
      alert('送信しました');
    },function(XMLHttpRequest,textStatus,errorThrown){
      if(textStatus!='abort' && textStatus!='error'){ alert(XMLHttpRequest+'\n'+textStatus+'\n'+errorThrown); }
    });
    return false;
  });
});
<form id="form1">
<select name="fruit">
<option value="apple">りんご</option>
<option value="banana" selected="selected">バナナ</option>
</select>
<button type="submit">送信</button>
</form>

上記のフォームをりんごに変更して送信しても
バナナが送信されてしまう。

cloneしてから送信までの間に
以下を挿入することで解決

    $('select',$('#form1')).each(function(i){
	    $('select',f).eq(i).val($(this).val());
	  });

コメントを残す

メールアドレスが公開されることはありません。

このサイトはスパムを低減するために Akismet を使っています。コメントデータの処理方法の詳細はこちらをご覧ください