0

次のように、エラー メッセージの関数内で jquery を介してブートストラップ モーダルを呼び出しています。

$('#validateButton').click(function() {

    var registrationLocation = $('#url').val();

    if (registrationLocation.indexOf("http") ==0) {
        // TODO - hardcoded DataFlow - this MUST be fixed!
        var hc06DfUrn = "urn:sdmx:org.sdmx.infomodel.datastructure.Dataflow=ESTAT:HC06(1.0)";
        $.getJSON("/" + webappName + "/ws/rest/registerservice?url=" + registrationLocation + "&dataflowurn="+hc06DfUrn, registerFileSuccess).error(displayErrorDialog);
    } else {
        $.getJSON("/" + webappName + "/ws/rest/registerfile?url=" + registrationLocation, registerFileSuccess).error(displayErrorDialog);
    }
    $('#errorDialog').modal('show')
});

モーダルhtmlについては、次のとおりです。

<div id="errorDialog" class="modal hide fade">
        <div class="modal-header">
            <button type="button" class="close" data-dismiss="modal" aria-hidden="true">×</button>
            <h3 id="myModalLabel">Modal header</h3>
        </div>
            <div class="modal-body">
            <p>One fine body…&lt;/p>
        </div>
        <div class="modal-footer">
            <button class="btn" data-dismiss="modal" aria-hidden="true">Close</button>
            <button class="btn btn-primary">Save changes</button>
        </div>
  </div>

フェード効果が見られますが、モーダルが空に見えるページの html を調べると、モーダルが表示されません。

<div class="modal-backdrop fade in">
    <div></div>
</div>

何か案は？

4

1 に答える 1

0

モーダルボディを配置するための DIV を作成する必要があります (コンテナ):

<div class="modal-backdrop fade in" id="myModal">
    <div id="myModalContainer"></div>
</div>

次に、ボタンをクリックすると、モーダルボディがコンテナー DIV に渡されます。

$('#validateButton').click(function () {
    var url = "/SomeModal/Url";
    $.get(url, function (data) {
        $('#myModalContainer').html(data);
        $('#myModal').modal('show');
    });
});
于 2013-04-18T17:22:49.533 に答える