2016-07-09 9 views
1

[送信]ボタンをクリックしたときにjQuery関数が呼び出されることはありません。 commandButton:hでアヤックスライン:私はFを削除する場合jQueryとf:ajaxとの競合

Nevetheless、jQueryのは、クリックを検出します。

どうすればいいですか?f:ajaxと私のjQueryは一緒に機能しますか?

XHTML:

<h:form> 
    <!-- my inputs--> 
    <h:commandButton id="submit-button" type="button" value="Confirm" > 
     <f:param name="id" value="#{param.id}" /> 
     <f:ajax execute="@form" render="@none" /> 
    </h:commandButton> 
</h:form> 

Javascriptを:

jQuery(document).ready(function() { 
jQuery('input[id*="submit-button"]').click(function() { 
    console.log("button clicked"); 
}); }); 
+0

レンダリングされた応答を調べます。 submitボタンのidには、 'form:submit-buttom'(' 'に関連付けられた' prependId'がfalseに設定されていない限り、推奨されない限り)のようなそれぞれの親コンポーネントのIDが前に付いていなければなりません。 – Tiny

+0

私は既に 'form:submit-buttom'構文で試してみました。私が言ったように、jQueryは ''行を削除した場合にのみクリックを検出します。これはajaxから来る問題のようです... –

+0

js関数を呼び出すために ' 'の' onclick'属性を使用してみませんか? – whitesite

答えて

0

私はコメントとしてこれを書いたが、その長すぎるので、私は答えとしてそれをここに書くでしょう。そのJS-ERRORは動作しません後

// prior this code you could have a JS Error  
jQuery(document).ready(function() { 
    jQuery('input[id*="submit-button"]').click(function() { 
     console.log("button clicked"); 
    }); 
}); 

ので、すべてのJSコード:

は、私はあなたがこの従来JS-エラーを持っていると思います。

考えられる原因はxhtmlのmissConfigurationです。あなたのJSF-Ajax呼び出しもうまく動作しないと仮定します。これは、<h:head></h:head>をxhtmlに含めないと発生します。

<h:head></h:head>タグを含めて、ajaxが正常に動作するようにする必要があります。

あなたのケースでは、ajaxリクエストを作成しようとしていますが、JSFがjsf.jsをxhtmlヘッダーにロードできないために失敗します。これはJavaScriptエラーの原因となります。正しく動作しません。

関連する問題