0

ドメイン オブジェクトを編集するための素敵なポップアップを開こうとしています。

このために、ページの非表示の div 内にポップアップ テンプレートが隠されています。ユーザーがボタンをクリックすると、ドメイン オブジェクトを ajax で読み込んで、テンプレートに入力して表示しようとします。

問題は、テンプレート内の最初のフィールドのみが入力されることです。

テンプレート：

 <div class="popup" id="addDriverPopup">
        <div class="close"></div>

        <hr class="both"/>

        <div class="container  radius">
            <form action="/driver/manageDriver" method="post" name="driverForm" id="driverForm" >
                <input type="hidden" name="id" id="id" value="" />
                <div class="title"><span>Uus autojuht </span><hr class="line"/></div>
                <p class="name">Nimi </p>
                <p class="input"><input type="text" name="firstName" id="firstName" value="" /></p>

                <p class="name">Perekonna nimi </p>
                <p class="input"><input type="text" name="lastName" id="lastName" value="" /></p>
                <p class="name">Isikukood </p>
                <p class="input"><input type="text" name="personalId" id="personalId" value="" /></p>
                <p class="name">Telefoni number </p>
                <p class="input"><input type="text" name="phoneNumber" id="phoneNumber" value="" /></p>
            </form>

        </p>
        </div>
    </div>

Javascript:

 $jq.ajax({
  url: 'show',
  dataType: 'json',
  data: {driverId: driverId},
  success: function( data ) {
        var popup = $jq('#addDriverPopup').clone();
        popup.find("#id").val(data.id);
        popup.find("#firstName").val(data.firstName);
        popup.find("#lastName").val(data.lastName);
        popup.find("#personalId").val(data.personalId);
        popup.find("#phoneNumber").val(data.phoneNumber);

        alert(popup[0].innerHTML); // only id field is field in the template.


  },
  error: function(xhr, error) {
      alert(error);
      unblockUI();
  }
});

alert() の出力:

        <div class="close"></div>
        <hr class="both">

        <div class="container  radius">
            <form action="/driver/manageDriver" method="post" name="driverForm" id="driverForm">
                <input name="id" id="id" value="1271672" type="hidden">
                <div class="title"><span>Uus autojuht </span><hr class="line"></div>
                <p class="name">Nimi </p>
                <p class="input"><input name="firstName" id="firstName" value="" type="text"></p>
                <p class="name">Perekonna nimi </p>
                <p class="input"><input name="lastName" id="lastName" value="" type="text"></p>
                <p class="name">Isikukood </p>
                <p class="input"><input name="personalId" id="personalId" value="" type="text"></p>
                <p class="name">Telefoni number </p>
                <p class="input"><input name="phoneNumber" id="phoneNumber" value="" type="text"></p>
            </form>
        <p></p>
        </div>

サーバーから返されたデータ:

{"id":1271745,"firstName":"Burak","lastName":"Torum","personalId":"123456","phoneNumber":"123456"}

タイプミスがないか要素 ID を再確認しました。デバッグは、正しい要素が見つかったことを示しています。

私は何が欠けていますか？

前もって感謝します

4

3 に答える 3

0

何が#addDriverPopupできていますか？

ID が競合していることが問題である可能性があります。クローンを作成しているため、同じ値を持つ複数の ID が作成されます。

その結果、ある種の競合が発生する可能性があります。クラスを検討したいかもしれません。

以下の私のコメントによると：

$jq.ajax({
  url: 'show',
  dataType: 'json',
  data: {driverId: driverId},
  success: function( data ) {

        $("#id").val(data.id);
        $("#firstName").val(data.firstName);
        $("#lastName").val(data.lastName);
        $("#personalId").val(data.personalId);
        $("#phoneNumber").val(data.phoneNumber);

        $jq('#addDriverPopup').dialog({
                 close: function(){
                       //Do stuff here to clean up, this syntax may be a bi
                      }
        });

  },
  error: function(xhr, error) {
      alert(error);
      unblockUI();
  }
});
于 2012-11-01T14:58:42.267 に答える
0

変更してみる

alert(popup[0].innerHTML);

に

alert(popup.html());

また、あなたが提供したコードに「#addDriverPopup」要素が表示されません...それはDOMのどこかにありますか?

于 2012-11-01T14:57:54.267 に答える
0

@rcdmk の質問コメントで指摘されているように、これはプラットフォームの問題のようです。

json ではなく、すぐに編集できるフォームをクライアントに返すように、コードをリファクタリングする必要がありました。ソリューションはエレガントではありませんが、クロスプラットフォームです:)

于 2012-11-01T17:00:50.167 に答える