ASP.NET - MessageBox on server side

  • Model
[Flags]
public enum MessageBoxButtons
{
    Cancel = 1,
    Ok = 2,
    No = 4,
    Yes = 8,
    Abort = 16,
    Retry = 32,
    Ignore = 64,
}

public class MessageBoxModel
{
    public static string GetButtonName(MessageBoxButtons msgButton)
    {
        var dict = new Dictionary<MessageBoxButtons, string>() {
            { MessageBoxButtons.Cancel, "取消" },
            { MessageBoxButtons.Ok, "确认" },
            { MessageBoxButtons.No, "否" },
            { MessageBoxButtons.Yes, "是" },
            { MessageBoxButtons.Abort, "放弃" },
            { MessageBoxButtons.Ignore, "忽略" },
        };
        return dict[msgButton];
    }

    public string Id { get; set; }
    public string Title { get; set; }
    public string Message { get; set; }
    public MessageBoxButtons Buttons { get; set; }
    public Dictionary<MessageBoxButtons, string> OnClick { get; private set; }

    public MessageBoxModel()
    {
        Id = Guid.NewGuid().ToString();
        Buttons = MessageBoxButtons.Ok;
        OnClick = new Dictionary<MessageBoxButtons, string>();
    }
}
  • View
@model MessageBoxModel

<div class="modal fade" id="@Model.Id" tabindex="-1" role="dialog" aria-labelledby="msgbox-label-@Model.Id">
    <div class="modal-dialog" role="document">
        <div class="modal-content">
            <div class="modal-header">
                <button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">&times;</span></button>
                <h4 class="modal-title" id="msgbox-label-@Model.Id">@(Model?.Title)</h4>
            </div>
            <div class="modal-body">
                <div>
                    <p id="msgbox-message-@Model.Id">@(Model?.Message)</p>
                </div>
            </div>
            <div class="modal-footer">
                @if (Model != null) {
                    var enumType = typeof(MessageBoxButtons);
                    foreach (MessageBoxButtons val in Enum.GetValues(enumType)) {
                        if (Model.Buttons.HasFlag(val)) {
                            var name = MessageBoxModel.GetButtonName(val);
                            var onclick = Model.OnClick.ContainsKey(val) ? Model.OnClick[val] : string.Empty;
                            <button type="button" class="btn btn-default" data-dismiss="modal" id="@Model.Id-btn-@(val.ToString().ToLower())" onclick="@onclick">@name</button>
                        }
                    }
                }
            </div>
        </div>
    </div>
</div>
@Html.Partial("~/Views/Shared/MessageBox.cshtml", new MessageBoxModel() {
    Id = "msgbox-delete-group",
    Buttons = MessageBoxButtons.Ok | MessageBoxButtons.Cancel,
    OnClick = { { MessageBoxButtons.Ok, "your_function()" } },
    Title = "Confirm?",
    Message = "Are you sure to delete this?"
})

<div>
    <a id='demo-btn' class="btn btn-primary btn-lg">Live Demo &raquo;</a>
</div>

@section scripts {
<script>
    $('.btn').click(function () {
        console.log('clicked');
        $('#msgbox-delete-group').modal('show');
    });
</script>
}
Live Demo »