如何在 swal 消息中使用@Html.Raw

Question

I want to pass controller html msg to view swal pop-up box but it's showing html code not html formated msg - like this:

Controller code:

ViewBag.message = "<h3> Something went terribly wrong, please try again or contact us at <a href='mailto:info@abc.we'>info@abc.we</a> </h3>";

View markup:

@{
    var msg = Html.Raw(ViewBag.message);
}

<script type="text/javascript">
$(function () {
                swal({
                    title: "@Html.Raw(msg)",
                    text: "",
                    icon: "success",
                    button: "Ok",
                });
            });
</script>

This is my code - can anyone please help me find a solution? I am stuck on this problem.

I just want controller html msg to be displayed properly in swal pop-up.

Thanks in advance to whoever is able to help me with this problem.

Another Example:

Controller :

ViewBag.htmlmsg = "alert('asd');";

View :

<script>
    $(document).ready(function () {
    @Html.Raw(ViewBag.htmlmsg);
        
});
</script>

this one is also not working. not showing alert pop-up.

Answer 1

I just want controller html msg to be displayed properly in swal pop-up.

Well, swal alert has the content attribute to allow htmlContent you can use that as well. In that case you could set additional span and bind your viewbag there, which will generate expected result.

Controller:

public class RawHtmlController : Controller
    {
        public IActionResult Index()
        {
           
            ViewBag.message = "<h3> Something went terribly wrong, please try again or contact us at <a href='mailto:info@abc.we'>info@abc.we</a> </h3>";
            return View();
        }
    }

Script:

@{
   

}


@section scripts {
    <script src="https://ajax.aspnetcdn.com/ajax/jQuery/jquery-3.2.1.min.js"></script>
    <script src="https://cdnjs.cloudflare.com/ajax/libs/sweetalert/2.1.2/sweetalert.min.js"></script>
    <script>

        $(document).ready(function () {
           
            var message = "@Html.Raw(ViewBag.message)";

            var span = document.createElement("span");
            span.innerHTML = message;
           

            $(function () {
                swal({
                    content: span,
                    icon: "success",
                    button: "Ok",
                });
            });
        });
    </script>
        }

Your Scenario:

    <script type="text/javascript">

                var message = "@Html.Raw(ViewBag.message)";
    
                var span = document.createElement("span");
                span.innerHTML = message;
                   $(function () {
                    swal({
                        content: span,
                        icon: "success",
                        button: "Ok",
                    });
                });
    </script>

Output: