0

ajaxを介して動的にロードされた非表示のフォーム要素の値を変更するのに問題があります。ユーザーが日付をクリックすると、いくつかの非表示の入力フィールドが日、月、年で自動的に更新されるようにしたいと思います(簡略化のためにコードには日のみが表示されています)。

主な質問は、ajaxを介して動的にロードされた要素をどのように選択できるかということだと思います。

簡略化されたコード:

index.php

<a href="#" id="someLink">Click Me</a>

include.js

$(document).ready(function(){
    $('#someLink').click(function(){
        // Create modal dialog dynamically
        var modal = $('<div/>').attr({
            id:'new' + objectName + 'Modal',
            class:'modal hide fade',
            tabindex:'-1',
            role:'dialog',
        });

        // Ajax call to load modal
        $.ajax({
            url: "getModal.php",
        }).done(function ( data ) {
            modal.html(data);
        });

        // show form
        modal.modal('show');    

        return false;
    });

    // bind datepicker from jQuery UI to text input
    $("body").on({
        focus: function(){ 
             $('.datepicker').datepicker({
                onClose: function(dateText, inst) {
                    var inputName = $(this).attr("name"); //returns "startDate"
                    console.log($('#'+inputName+'_day')); // returns "[]"
                    $('#'+inputName+'_day').val(new Date(dateText).getDate());
                  }
            });
        }
    },'.datepicker');
});

getModal.php

echo <?php
echo "<form name='modalForm'>";
echo "<input type='hidden' name='startDate_day' id='startDate_day'>";
echo "<input type='text' class='datepicker' name='startDate' id='startDate'>";
echo "</form>";
echo ?>
4

3 に答える 3

1

DOM要素が存在する場合、それがどのようにロードされたかに問題はないはずです-jQueryはそれを見つけます。

nameセレクターで要素を選択する必要があります

$('input[name="' + inputName + '"_day"]').val(...);

または、ロードされた入力にid="startDate_day"

于 2012-10-09T13:32:29.957 に答える
0

ChromeコンソールまたはFirebugを使用して、次のスニペットを試すことができます。

console.log(inputName);
$('#'+inputName+'_day').val();

その名前の要素が存在する必要があります。存在しない場合、jQueryは何も返すことができません。

別のデバッグ手法と同様に、ページビューソースで「フォーム」という単語を検索して、目的のフォームがロードされているかどうかを確認できます。

于 2012-10-09T13:42:45.567 に答える
0

私は他の誰かを助けることを望んでいる問題の原因を見つけることができました。

私はGrails/Railsを使用しており、IDにピリオド文字が自動的に挿入されますが、これを見落としていました。その後、jQueryを使用して、名前にピリオドが含まれている要素を呼び出そうとしましたが、これは機能しません(ピリオドはクラス名用に予約されているため)。

この質問の詳細が正常に機能していることを示すjsfiddleを作成しました。

于 2012-10-09T15:33:52.803 に答える