1

私は自分のプロジェクトに YUI 2.7.0 と Struts を使用しており、2 つの送信ボタンがあるフォームを持っています。1 つは保存用で、もう 1 つは削除用です。フォームは DispatchAction に送信されます。onclick リスナーを正常に追加しましたが、問題は、リスナーが実行される前にフォームが送信されることです。フォームが送信される前に、ディスパッチ パラメータを設定する必要があります。どうすればいいですか?以下は私がこれまでに持っているものです:

<form name="adminUserForm" method="post" action="manage_user.do">
  <input type="hidden" id="dispatch" name="dispatch" value="unspecified"/>
  <!-- other form fields here -->
  <input type="submit" value="Save User" id="saveUser">
  <input type="submit" value="Delete User" id="deleteUser">
</form>
<script type="text/javascript"> 
  function confirmDelete(msg)
  {
    if (confirm(msg))
    {
      return setDispatchMethod("delete");
    }
    else
      return false;
  }
  function setDispatchMethod(methodName)
  {
    dispatchField = document.getElementById("dispatch");
    dispatchField.value = methodName
    return true;
  }
  var onClickSaveUser = function (e)
  {
    return setDispatchMethod('save');
  };
  var onClickDeleteUser = function (e)
  {
    return confirmDelete('Are you sure you want to delete the user?');
  };
  new YAHOO.widget.Button("deleteUser",   {onclick: {fn: onClickDeleteUser }});
  new YAHOO.widget.Button("saveUser",     {onclick: {fn: onClickSaveUser   }});
</script>
4

3 に答える 3

2

問題は、ボタンウィジェットのYahooのコードがクリックイベントを処理し、その中でプログラムでフォームを送信することです。それらのイベントハンドラーはあなたの前に呼び出されるので、あなたのイベントハンドラーが呼び出される前にフォームが送信されます。

ここにいくつかのアイデアがあります(それらはすべて機能します):

方法1

クリックイベントの代わりにmousedownイベントを処理します(クリックする前にマウスダウンが発生します)。

var deleteUserButton = new YAHOO.widget.Button("deleteUser");
deleteUserButton.on("mousedown", onClickDeleteUser);

var deleteUserButton = new YAHOO.widget.Button("saveUser");
deleteUserButton.on("mousedown", onClickSaveUser);

//Using this, you can easily stop the form from submitting
//by using YAHOO's event utility (by adding this code, you
//will prevent the click event from firing as well).

YAHOO.util.Event.preventDefault(e); 

方法2

type = submit(デフォルト)の代わりにtype=linkを使用します。type = submitの場合にのみ、フォームを送信します(フォームがそれ自体で送信されるかどうかを確認するために、これを十分にテストしていません。手動でform.submit()を呼び出す必要がある場合があります)

new YAHOO.widget.Button("deleteUser", { type: 'link', onclick: { fn: onClickDeleteUser} });
new YAHOO.widget.Button("saveUser", { type: 'link', onclick: { fn: onClickSaveUser} });

方法3

彼らのコードを見ると、フォームを送信するためにクリックされたボタンの名前で非表示のフィールドが作成されていることに気付きました(そのボタンのみ)。inputタグにはname属性が必要ですが、あなたの属性にはないので、名前を追加する必要があります。次に、サーバーで、その非表示フィールドの値(value属性)を確認するだけです。

これらの方法のいずれを使用する場合でも、フォームの送信を停止するには、これを使用する必要があります。

YAHOO.util.Event.preventDefault(e); 
于 2009-12-31T20:14:52.933 に答える
0

ここに簡単な解決策があります

<form>
    <input type="submit" name='dispatch' value="Save User" id="saveUser">
    <input type="submit" name='dispatch' value="Delete User" id="deleteUser">
</form>

非表示の入力を削除できます

最初のボタンがクリックされると、ディスパッチ要求変数は「ユーザーの保存」に設定されます

または「ユーザーの削除」は2番目がクリックされた場合

于 2009-12-22T05:51:00.147 に答える
0

この質問は数年前のものですが、YUI 2.9.0 を使用するプロジェクトがまだあり、同じ問題に遭遇したので、他の誰かが同じジャムに遭遇した場合に備えて私の解決策を共有します.

この質問について注目すべき点がいくつかあります。まず、Gabriel が説明している、クリック ハンドラが呼び出される前に YUI 2.9.0 ボタン クリック ハンドラがフォームを送信するという問題は、少なくとも IE9 では IE の問題ではありません。少なくとも FF12 までの FireFox では、問題が発生します。Chrome、Safari、および他のすべてではないにしてもほとんどのブラウザーでも問題になると思われます。また、YUI ボタン​​のクリック ハンドラーで IE の特殊なケースのように見えるものも見られます。

また、ガブリエルが提案した解決策はどれも好きではありませんでした。リンク ボタンを使用すると、送信ボタンに適用したすべてのカスタム スタイルが無効になり、マウスダウン ハンドラーを使用すると、クリックのユーザー インターフェイス セマンティクスの一部が失われ、何らかの理由で、YUI ボタン​​が送信ボタンに付けた元の名前を追跡できなくなりました。または、少なくとも、サーバー側の POST 値には表示されませんでした。ただし、Gabriel のリンク ボタンの精神で、送信ボタンをデフォルトでは送信されない入力ボタンに置​​き換え、非表示の入力を追加して自分でフォームを送信しました。

...

<form id='form'>
    <input type="button" value="&gt;" id="start_survey">

...

function start_survey (p_oEvent, p_aArgs) {
    var input = document.createElement ('input');
    input.type = 'hidden';
    input.name = this.get ('name');
    input.value = '&gt;'

    var form = YAHOO.Dom.get ('form');
    form.appendChild (input);
    form.submit();
}

new YAHOO.widget.Button ("start_survey", {onclick: {fn: start_survey}});

...

最後に、YUI はクリック時にフォームを送信するため、フォームの送信イベントをキャッチし、イベント ターゲットがボタンであるかどうかを確認し、必要なことを行ってから、送信を実行するか停止するという別の解決策が必要です。必要です。

于 2012-05-28T16:00:14.567 に答える