嗨,我正在尝试在引导模式中制作表格。此模式将基于 href 单击事件打开。这个 a href 标记将使用 Jquery 在 ajax 调用中动态生成。
a href 标记的格式如下调用引导模式。
'<a id="addvideo" data-toggle="modal" data-title="'+field.title+'" data-id="'+field.video_id+'" data-desc="'+field.description+'" data-channelname="'+field.channel_name+'" data-yudate="'+field.created_date+'" href="#form-content">'+field.title+'</a>'
我正在调用的模态如下所示。
<div id="form-content" class="modal hide fade in" style="display: none;">
<div class="modal-header">
<a class="close" data-dismiss="modal">×</a>
<h3>Add Video</h3>
</div>
<div class="modal-body">
<form name="addvideo" action="#" id="addvideo">
<label>Title</label>
<input type="text" id="videotitle" name="videotitle" value="" /><br />
<label>Video ID</label>
<input type="text" id="videoid" name="videoid" value="" /><br />
<label>Description</label>
<textarea name="videodesc" id="videodesc"></textarea><br />
<label>Channel</label>
<input type="text" id="channelname" name="channelname" value="" /><br />
<label>Actors</label>
<input type="text" id="actors" name="actors" value="" /><br />
<label>Directors</label>
<input type="text" id="directors" name="directors" value="" /><br />
<label>Producers</label>
<input type="text" id="producers" name="producers" value="" /><br />
<label>Order Number</label>
<input type="text" id="orderno" name="orderno" value="" /><br />
<label>Youtube Updated Date</label>
<input type="text" id="yudate" name="yudate" value="" /><br />
<label>CMS Updated Date</label>
<input type="text" id="cudate" name="cudate" value="" /><br />
<label class="checkbox">
<input type="checkbox" id="hidevideo"> Hide video in mobile app
</label>
<button class="btn btn-success" id="submit"><i class="icon-white icon-ok"></i> Submit</button>
<button class="btn btn-inverse"><i class="icon-white icon-circle-arrow-left"></i> Cancel</button>
</form>
</div>
</div>
现在基于点击调用模态,我使用下面的 javascript 代码,并且仅在此代码中,我通过使用 Jquery 在模态中设置文本框将数据传递给模态,如下所示。
$(document).on("click", "#addvideo", function () {
var videoid = $(this).data('id');
var videotitle = $(this).data('title');
var videodesc = $(this).data('desc');
var channelname = $(this).data('channelname');
var yudate = $(this).data('yudate');
$(".modal-body #videoid").val( videoid );
$(".modal-body #videotitle").val( videotitle );
$(".modal-body #videodesc").val( videodesc );
$(".modal-body #channelname").val( channelname );
$(".modal-body #yudate").val( yudate );
});
现在我的模态加载正常,一旦模态加载点击href标签,值就会显示在指定的文本框中。但是,如果我在加载后单击模式,文本框中的值会自动重置为空白值。