3

ユーザーがフォームの送信ボタンをクリックしたときに、フォームを送信する代わりにパスワード プロンプトを表示しています。ユーザーがプロンプトの「OK」ボタンをクリックしたときにフォームを送信したい。jquery impromptu プラグインを使用しています (バージョン 3.1 と 4.0.1 の両方で試しました)。私は自分のコードのどこが間違っているのか、または何かが完全に欠けているのか急いでいます。

ここに私のコードがあります -

トライアル 1
HTML パーツ

<form name="frmAddAdnetworkTemplate" id="frmAddAdnetworkTemplate" action="someAction">
  ...
  ...
  <input id="submit" type="submit" name="submit" value="Submit"  onclick="return promptPassword();" />
</form>

JavaScript部分

function promptPassword()
{
   /*prepared passwordForm = some html; here */
   $.prompt(passwordForm,{ buttons: { Ok:, Cancel: false , submit: }, callback: submitPasswordPrompt, focus: 1});

   return false; //so as to not submit the form
}

function submitPasswordPrompt(value,m,form)
{
    $("form#frmAddAdnetworkTemplate").submit(); //this does not work - no js error as well
}

ただし、フォームは送信されません。

Trial 1.1 送信時に submitPasswordPrompt を呼び出す代わりに、

function promptPassword()
{
   $.prompt(passwordForm,{ buttons: 
                             { Ok: $("#frmAddAdnetworkTemplate").submit(), //this too does not work
                               Cancel: false }, 
                           focus: 1
                          });

}

トライアル 1.2

私は preventDefault() で試しました -

HTML 部分

<input id="submit" type="submit" name="submit" value="Submit" onclick="promptPassword(event);"/>

JavaScript部分

function promptPassword(e)
{
  e.preventDefault();
  $.prompt(passwordForm,{ buttons: { Ok: true, Cancel: false }, submit: submitPasswordPrompt});

  function submitPasswordPromptTest(e, value,m,form)
  {
     if(value)
     {
        $("#frmAddAdnetworkTemplate").submit(); //does not work
     }
  }

試行 2 ドキュメント document .ready 内で $.prompt を呼び出して、送信ボタンのクリック イベントでバインドしてみました -

HTML 部分

<input id="submit" type="submit" name="submit" value="Submit" />

JavaScript部分

$("#submit").click(function(){
   $.prompt(passwordForm,{ buttons: { Ok: $("#frmAddAdnetworkTemplate").submit(), Cancel: false }});
   return false;
});

$("#frmAddAdnetworkTemplate").off('submit').submit(); を試したときにこのエラーが発生しました。-

e[h] is not a function

ここに画像の説明を入力

4

3 に答える 3

1

インライン Javascript と jQuery 関数およびイベントを混在させると、理解が難しくなります。

onclick="promptPassword(event);"で定義された「イベント」変数がなく、promptPassword()関数がその引数を受け入れないため、「トライアル 1.2」の試行は機能しません。したがって、e.preventDefault()as eis not defined (jQuery オブジェクトとして) を使用することはできません。

ただし、jQuery を使用すると、フォーム送信イベントにバインドして、すべてのタイプの送信をキャッチできます。つまり、Enter キーを使用するとき、または送信ボタンをクリックするときです。

$(document).ready(function() {
    $('#myForm').submit(function(event) {
        var password = "password",
            promptText = "Password required",
            isAuthenticated = (password == prompt(promptText));

        if (!isAuthenticated) {
            event.preventDefault();
            //console.log("Invalid password");
        }
    });

});

デモを見る。

于 2012-03-05T15:20:13.347 に答える
1

送信でボタン ID を使用する

私のシナリオのために

$.prompt(msg, {
    buttons: btns,
    submit: function (v) {
        //this is simple pre submit validation, the submit function
        //return true to proceed to the callback, or false to take 
        //no further action, the prompt will stay open.
    },
    callback: function (e, v, m, f) {
        if (v) {
            $("#MainContent_HiddenFieldIsContinueWithSave").val('1');
            $("#MainContent_buttonSave").submit();
        }
        else { }
    }
});
于 2012-10-16T10:39:07.640 に答える
1

この問題は、何らかの理由で id="submit" が原因で発生し、これが HTML 送信と混同されます。私は以前にこの問題を抱えていましたが、答えはIDと名前を(安全のために)別のものに変更することです:

<input id="my-form-submit" type="submit" name="my-form-submit" value="Submit" />
于 2012-08-30T23:38:52.547 に答える