2016-04-07 8 views
-3

私はローカルでページを作成していますが、jQueryとsubmit()の問題があるようです。私は下にあるものとは別に、ページ上に他のjQueryを持っていません。

私はそれぞれidがsel1,sel2およびsel3の3つのメニューを持っています。次のコードのようにalert('hereX');を追加すると、3つの参照すべてで警告ボックスが起動しますが、フォームは送信されません。

$('#sel1').on('change keyup', function() { 
    alert('here1'); 
    $('#f').append("<input type='hidden' name='act1' value=-1 />"); 
    alert('here2'); 
    $('#f').submit(); 
    alert('here3'); 
    return true; 
}); 

私のフォームは、通りである:

<input type="submit" name="update" value="Update" onclick="return confirm('You have Javascript enabled')"> 

誰もが問題があるかもしれないどこになどの任意のポインタを持っています。ボタンは次のように設定されている提出マイ

<form method="post" name="f" action="#1" id="f"> 

。 jQueryが警告として起動しているように見えますが、フォームを送信していないものを送信しているようです。 Firefox、Chrome、Safariで試してみました。次のように

Javascriptのコードは次のとおりです。ここで

<script type="text/javascript" src="http://code.jquery.com/jquery-latest.js"></script> 
<script type="text/javascript"> 
    $(document).ready(function() { 
     $('#sel1').on('change keyup', function() { 
      $('#f').append("<input type='hidden' name='act1' value=-1 />"); 
      $('#f').submit(); 
      return true; 
     }); 

     $('#sel2').on('change keyup', function() { 
      $('#f').append("<input type='hidden' name='act1' value=-2 />"); 
      $('#f').submit(); 
      return true; 
     }); 

     $('#sel3').on('change keyup', function() { 
      $('#f').append("<input type='hidden' name='act1' value=-3 />"); 
      $('#f').submit(); 
      return true; 
     }); 
    }); 
</script> 

ページがPHPのかなりの数のラインを使用し、選択ドロップダウンが動的にACT1によって送信された値に比べてロードされ、メニューの簡易版でありますjqueryで

<select name="f[type]" style="width: 180px;" id="sel1" 
<option value="car">Car</option> 
<option value="boat">Boat</option> 
</select> 

<select name="f[color]" style="width: 180px;" id="sel2" 
<option value="red">Red</option> 
<option value="blue">Blue</option> 
</select> 

<select name="f[size]" style="width: 180px;" id="sel3" 
<option value="5">5</option 
<option value="6">6</option> 
<option value="7">7</option> 
</select> 
+2

フォームに 'submit()'イベントハンドラがありますか?現在のところそのアクションは '#1'に設定されていますので、あなた自身でsubmitイベントを処理しない限り何もしません。また、すべての 'selX'要素に対して単一のイベントハンドラを使ってコードを単純にDRYできます。 –

+0

申し訳ありません私は、 "Submit"と "update"という名前のSubmitボタンを持っています –

+0

提出する際に、このフォームが正確に何を期待していますか?あなたはその事をするためにどこにフォームを教えていますか? – David

答えて

0

ちょっとフォームアクションが#1であるため、動作していません。 フォームのアクションを変更するか、フォームの別の送信イベントハンドラを作成する必要があります。

1

正確にはとなります。このフォームは送信されますか?アクション属性を確認してください:

<form method="post" name="f" action="#1" id="f"> 

#1とは何ですか?これはサーバー側のURLではないので、フォームは実際にサーバーリソースに何かをポストすることはありません。基本的には何もしません。

私は他のjQueryを次のページから除外しています。

その後、何もしない#1アクション以外のこのフォームにはsubmitイベントハンドラは、ありません。デフォルトでは、フォームはあなたがしたいことを知らないので、それを伝える必要があります。有効なactionまたはインコードsubmitイベントハンドラを使用してください。

このような何か:問題は、他のボタンのいずれかと同じ名前のページに動的に設定された第2の送信ボタンだった私を発見した

$('#f').submit(function() { 
    // do something here 
}); 
+0

OK、私は#1からページ名であるcalc.phpにページの名前にアクションを変更しましたが、依然として投稿しません! –

+0

@MikeB:あなたが記述している振る舞いを再現することができません:https://jsfiddle.net/c98x8sg6/ – David

0

<form method="post" name="f" action="someUrl.php" id="f"> 

またはこのさまざまな段階で公開されるようになりました。フォームが削除されると、ボタンの重複した名前が矛盾していました。

申し訳ありません私は前にこれを発見していませんでした。ページ全体でかなりの量のPHPコードが使用されていましたが、別の場所で何が起こっていたのか少し払うよりも、

#1に設定されているフォームアクションのちょっとした点、フォームの実際の動作が#1に設定されているか、実際のファイル名に設定されているとわかった後差異

すべての答えに時間をとってくれてありがとう。