0
同じビューでいくつかのブートストラップモーダルを持つNodeJsアプリケーションを構築しています。 最初の呼び出しでブートストラップのモーダルが空になる
<!DOCTYPE html>
<html>
<head>
<meta http-equiv="content-type" content="text/html; charset=UTF-8">
<title>Update user</title>
</head>
<body>
<div class="modal-header">
<button type="button" class="close" data-dismiss="modal">×</button>
Update user
</div>
<div class="modal-body">
<strong>User: </strong><span id="userNom"></span>
<strong>Curs: </strong><span id="userCurs"></span>
<!--BODY UPDATE-->
<form role="form" method="post" id="upd">
<label for="BodyUpd">Body</label>
<textarea class="form-control" rows="3" id="BodyUpd" form="upd"></textarea>
</div>
</form>
</div>
<div class="modal-footer">
<button type="submit" form="upd" class="btn btn-success btn-block" id="updBtn">Update</button>
</div>
</body>
</html>
と含むjQueryのファイルがある:このリンクは、このリモートモーダルを呼び出す
<!--Main link-->
<a id = "myLink" data-toggle="modal" href="/path/to/myModal.ejs" data-nom="<%=user.name%>" data-id="<%=user._id%>" data-curs="<%=user.level%>" data-body = "<%=user.body%>" data-target="#ModalUpd">Update body</a>
<!-- Call the remote Modal-->
<div class="modal fade" id="modalUpd" role="dialog">
<div class="modal-dialog modal-lg">
<!-- Modal content-->
<div class="modal-content">
</div>
</div>
</div>
:
jQuery(document).ready(function(){
$("#myLink").on("click", function (e) {
e.preventDefault();
var userN = $(this).data('nom');
var userC = $(this).data('curs');
var userId = $(this).data('id');
var userbody = $(this).data('body');
$("#userN").text(userN);
$("#userC").text(userC);
$("#BodyUpd").attr("name", "user.body");
$("#BodyUpd").val(body);
$('#updBtn').on('submit', function(e){
e.preventDefault();
var urlPost = "/path/" + userId + "/otherpath/" + "?_method=put";
$('#modalUpd').modal('toggle');
$.ajax({
url: urlPost
type: 'POST',
data: $('#upd').serialize()
});
location.reload();
});
});
});
それは完璧に動作しませんが、決してようにHTML(EJS)が見えます最初の呼び出しで。モーダルを初めて呼び出すと、すべてのフィールドが空で、ユーザーデータはありません。モーダルを閉じて再コールすると、すべてのユーザーデータがモーダルに表示されます。 私はjQueryでかなり新しく、 "$(document).ready"と何か間違っていると思いますが、私は何が分かっていません...私はさまざまな可能性を試しましたが、これは最高の私が見つかりました。 あなたが私を助けてくれることを願っています。 ありがとう!
document.onをクリックするとdocument.readyが呼び出されますか?それ以外のやり方をしてください –
なぜあなたはonclickの中にdocレディ機能を持っていますか?それがあなたの問題の原因です。 doc readyは、完全なページ・ロード時に一度実行する必要があります。それは決して別の関数の中にあるべきではありません。 – Korgrue
私は問題のコードを編集したので、onclickの前にdocument.readyを置こうとしましたが、それでも動作しません。 – cfibla