如何在mvc中单击按钮时生成模式弹出窗口

如何在mvc中单击按钮时生成模式弹出窗口

本文介绍了如何在mvc中单击按钮时生成模式弹出窗口的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!

问题描述

不工作



Not working

@model Inspinia_MVC5.Models.Message

@{
    ViewBag.Title = "My chat";
}

<!DOCTYPE html>

<html xmlns="http://www.w3.org/1999/xhtml">
<head>
    <meta name="viewport" content="width=device-width" />
    <title>MyChat</title>
    <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js"></script>
    <script src="http://ajax.aspnetcdn.com/ajax/jquery.ui/1.8.9/jquery-ui.js" type="text/javascript"></script>
    <link href="http://ajax.aspnetcdn.com/ajax/jquery.ui/1.8.9/themes/start/jquery-ui.css"

        rel="stylesheet" type="text/css" />

    <script type="text/javascript">
        $("#modelopen").live("click", function () {
            debugger;
            $("#window").dialog({
                title: "Send message",
                width: 430,
                height: 250,
                modal: true,
                buttons: {
                    Close: function () {
                        $(this).dialog('close');
                    }
                }
            });
            return false;
        });
    </script>
    <script type="text/javascript">


        function Send() {
            debugger;
            var sender = $("#txtSender").val();
            var receiver = $("#txtReceiver").val();
            var msg = $("#txtMsg").val();

            if (sender != '' && receiver != '' && msg != '') {
                $.ajax({
                    type: 'POST',
                    url: "@(Url.Action("SendMsg", "Mailbox"))",
                    dataType: 'json',
                    data: { Sender: sender, Receiver: receiver, Msg: msg },
                    success: function (data, textStatus, jqXHR) {
                        $("#txtSender").val('');
                        $("#txtReceiver").val('');
                        $("#txtMsg").val('');
                        $("#lblMsg").text('Message sent.');
                        $("#lblMsg").show();
                    },
                    error: function () {
                        alert('error');
                    }
                });
            }

        }

    </script>
</head>
<body>

    <div class="wrapper wrapper-content animated fadeInRight">


        <div class="ibox float-e-margins">
            <div class="ibox-title">
                <h5>Send Message</h5>
            </div>

            <div class="ibox-content">
                <div>
                </div>
                <div class="row">
                    <div class="col-sm-12">
                        <br />
                        <button id="modelopen" class="btn btn-info">Open Dialog</button>
                    </div>
                </div>
            </div>
        </div>
    </div>

    @using (Html.BeginForm("Mychat", "Mailbox", FormMethod.Post, new { id = "SendMsg" }))
    {
        @Html.AntiForgeryToken()
        <div id="window" title="basic dialog model" style="display:none;" >

            <div class="form-horizontal">
                @Html.ValidationSummary(true)

                <div class="form-group">
                    @Html.LabelFor(model => model.UserName, new { @class = "control-label col-md-2" })
                    <div class="col-md-8">
                        @Html.TextBoxFor(model => model.UserName, new { @id = "txtSender", @onclick = "HideSender();" })

                    </div>
                </div>

                <div class="form-group">
                    @Html.LabelFor(model => model.Receiver, new { @class = "control-label col-md-2" })
                    <div class="col-md-8">
                        @Html.TextBoxFor(model => model.Receiver, new { @id = "txtReceiver", @onclick = "HideReceiver();" })

                    </div>
                </div>

                <div class="form-group">
                    @Html.LabelFor(model => model.MessageText, new { @class = "control-label col-md-2" })
                    <div class="col-md-8">
                        @Html.TextBoxFor(model => model.MessageText, new { @id = "txtMsg", @onclick = "HideMsg();" })

                    </div>

                </div>

                <div class="form-group">

                    <div class="col-md-8">
                        <input id="btnSend" type="button" value="Send" class="btn btn-info btn-sm" onclick="Send();" />
                    </div>
                </div>
                @Html.LabelFor(model => model.MessageText, new { @id = "lblMsg", style = "display: none;" })


            </div>


        </div>
    }
</body>
</html>

推荐答案




这篇关于如何在mvc中单击按钮时生成模式弹出窗口的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持!

10-12 10:56