2

状況は次のとおりです。jQueryを使用してフォームを動的にロードしています。その形式には、jQueryUIからの日付ピッカーがあります。問題は、日付ピッカーが最初に読み込まれることですが、フォームが再度読み込まれると、日付ピッカーが機能しません。ページが読み込まれるたびにdatepicker関数を再バインドする必要があることはわかっていますが、すべての試行が失敗しました。どんな助けでもいただければ幸いです！

以下のコードスニペット：

function makeMyDay() 
{
    $(".datepicker").datepicker(
    {
        inline: true
    });
}

function getNewPage(id,idTwo)
{
    $.ajax(
    {
        type: "GET",
        url: 'foo.php',
        data: "id=" + id,
        success: function(data) 
        {
            $('.bar' + idTwo).html(data);
            makeMyDay();
        }
    });
}

明確にする必要がある場合に備えて、foo.phpは.barにロードされます。日付ピッカー自体はfoo.phpにあり、外部JSファイルはfoo.phpではなくメインファイルにあります。

編集

以下のコードを更新しましたが、問題は解決しません。

$(function()
{
    $('.datepicker').datepicker({inline: true});
});

function getNewPage(id,idTwo)
{
    $.ajax(
    {
        type: "GET",
        url: 'foo.php',
        data: "id=" + id,
        success: function(data) 
        {
            $('.bar' + idTwo).html(data).find(".datepicker").datepicker(
            {
                inline: true
            });
        }
    });
}
4

3 に答える 3

2

makeMyDayは関数であり、セレクターではないため、に切り替える$(makeMyDay);とうまくいくはずです。makeMyDay();

または、.datepickerが.barコンテナにある限り、ajax-callの直後にdatepicker（）をバインドしてみてください。これは機能するはずです。

function getNewPage(id,idTwo)
{
    $.ajax({
        type: "GET",
        url: 'foo.php',
        data: "id=" + id,
        success: function(data) {
             $('.bar' + idTwo).html(data).find(".datepicker").datepicker({
                   inline: true
              });
        }
    });
}

プロセスをシミュレートする実用的な例はここにあります：http： //jsfiddle.net/7wBWB

于 2012-12-30T01:51:11.610 に答える
0

ここでhasDatePickerクラスをテストするというアイデアに対する@ChrisKempenの回答のおかげで、私は今日の午後に同様の問題を抱えて解決しました：jQuerydatepickerはAJAXで追加されたhtml要素では機能しません

この行を使用して、ajax呼び出しによって更新されない要素を使用してバインドしました。

$('.container').on('focus', 'input[type=date]', this.bindDatepicker);

this.bindDatepickerでは、クリックの代わりにフォーカスを選択しましたが、彼のアイデアを使用してhasClass（'hasDatepicker'）をテストしました。

Modernizrを使用してModernizr.inputtypes.dateをテストしてから、datepickerをバインドするファイルをロードしていました。

于 2013-01-16T00:19:24.973 に答える
0

これらのコードを試してください。私の場合、ajaxを介してコンテンツをロードすると機能します

$(document).ready(function() {
 $('body').click(function(event) {
   if ($(event.target).is("#new_datepicker")) {
     $("#new_datepicker").datepicker({showOn: 'focus'}).focus();
   }
 });
});
于 2014-04-29T09:46:51.553 に答える