アプリケーションで picnet tablefilter を使用しています。
http://www.picnet.com.au/resources/tablefilter/demo.htm
Tablefilter は、各列の入力を生成します。入力にいくつかの文字を入力した後、フィルタリングがトリガーされます。
ヘッダーを修正したいので、そのヘッダーのコピーを作成して配置し、tablefilter with で使用されるヘッダーのすぐ上に浮かぶようにしましたposition: fixed
。
次のように、id = "filtertable_filter_3" の代わりに id = "my_filtertable_filter_3" を使用して同じ入力を作成しました。
$( '#fixed_table thead' ).append( '<tr class="filters">' + $( '#container thead .filters' ).html() + '</tr>' );
$( '#fixed_table thead .filters input' ).each( function( index )
{
$( this ).attr( 'id', 'my_' + $( this ).attr( 'id' ) );
});
これで、デモの picnet tablefilter のヘッダーとまったく同じように見えるヘッダーができました。これは、ヘッダーが修正されたという印象を与える元のヘッダーの上を流れます。
問題の図 (明らかに picnet の状況なし) がここに掲載されています: http://jsfiddle.net/bJ2K7/21/
私が達成したいこと:
ユーザーが id = "my_filtertable_filter_3" の入力に文字列を入力すると、この関数は picnet tablefilter によって生成された入力に同じ値を入力します。また、(picnets コードを数時間読んだ後) フィルターをトリガーしているように見える keyup イベントもトリガーします。
$( '#fixed_table thead .filters input' ).keyup( function()
{
var input_id = $( this ).attr( 'id' ).substr( 3 );
var input_val = $( this ).val() ;
$( '#filtertable #hidden_thead .filters' ).find( 'input#filtertable_filter_3.filter' ).val( input_val );
$( '#filtertable #hidden_thead .filters' ).find( 'input#filtertable_filter_3.filter' ).trigger('keyup');
} );
このイベントをこのようにキャッチしようとしている間、うまくいっているようです:
$( '#filtertable_filter_3' ).keyup( function()
{
alert( 'event caught' );
});
私の質問:
これは問題に対する完全に間違ったアプローチですか、それとも正しいイベントを発生させていないだけですか?
問題:
以下のコメントで述べたように: アラートは発生しますが、フィルターはフィルター処理されません (入力値が入力されます)。