1


0

yui送信ボタンとディスパッチアクション

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

  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   }});

3 Answer


2


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

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

*方法1 *

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

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} });
  • METHOD 3 *

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

これらの方法のどれを使用しても、これを使用してフォームの送信を停止する必要があります。

YAHOO.util.Event.preventDefault(e);


0


ここは簡単な解決策です


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

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

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


0


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

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

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

...




...

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

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

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

...

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