請求書のリストを作成するために c# とカミソリを使用しています。各請求書は表の行であり、それに対するメモの膨大なリストがあります。行間に大量のスペースが入らないようにするために、メモを非表示にしてポップで表示できるようにします。現在は次のとおりです。
<td>
@foreach (var invoiceLine in invoice.InvoiceLines)
{
<p>
<strong>@invoiceLine.Date.ToShortDateString() @invoiceLine.Username</strong> <br />
@Html.Raw(invoiceLine.Notes.Replace(Environment.NewLine, "<br />"))
@Html.Raw((invoiceLine.DueDate.HasValue ? "<br /><strong>Follow up:</strong> " + invoiceLine.DueDate.Value.ToShortDateString() : ""))
@Html.Raw(invoiceLine.Completed ? "<br /><strong>Completed</strong>" : "")
</p>
}
だから私がしたいのは、jqueryを使用してポップアップを追加することです:
$(function () {
$('#clickMe').click(function (event) {
var mytext = $('#myText').val();
$('<div id="dialog">' + mytext + '</div>').appendTo('body');
event.preventDefault();
$("#dialog").dialog({
width: 600,
modal: true,
close: function (event, ui) {
$("#dialog").hide();
}
});
}); //close click
});
次に、コードを変更します。
<td>
<h3 id="clickMe">Open Notes</h3>
<textarea cols="1" rows="75" id="myText" style="display:none">
@foreach (var invoiceLine in invoice.InvoiceLines)
{
<p>
<strong>@invoiceLine.Date.ToShortDateString() @invoiceLine.Username</strong> <br />
@Html.Raw(invoiceLine.Notes.Replace(Environment.NewLine, "<br />"))
@Html.Raw((invoiceLine.DueDate.HasValue ? "<br /><strong>Follow up:</strong> " + invoiceLine.DueDate.Value.ToShortDateString() : ""))
@Html.Raw(invoiceLine.Completed ? "<br /><strong>Completed</strong>" : "")
</p>
}
</textarea>
</td>
最初の問題は、最初の行しか表示されないことです。私のIDがずっと同じだからだと思いますか?
行ごとにダイアログを開くにはどうすればよいですか?
私はc#とjsの初心者です:)