Modal bootstrap MVC 5

Asked

Viewed 415 times

3

I’m trying to use the modal of Bootstrap, but I can’t make the window open in modal form with the style of the page, instead it opens as a page with no style and using the whole browser frame.

Follow the page code:

@model MyApplication.ViewModels.MyViewModel


@Ajax.ActionLink("Adicionar Endereço", "Create", "Enderecos", new { area = "Geografia", id = Model.Id },
    new AjaxOptions() { 
        HttpMethod = "Get", 
        UpdateTargetId = "modalContent", 
        InsertionMode = InsertionMode.Replace, 
        OnBegin = "onBegin", 
        OnSuccess = "onSuccess", 
        OnFailure = "onFailure", 
        OnComplete = "onComplete" },
    new { id = "btnEndereco", @class = "btn btn-lg btn-info" }
)

<a href='@Url.Action("Create", "Enderecos", new { area = "Geografia", id = Model.Id})' class="btn btn-success btn-xs">Adicionar Endereço</a>

<table id="enderecosJson">
    <thead>
        <tr>
            <th>CEP</th>
            <th>Rua</th>
            <th>Numero</th>
            <th>Complemento</th>
            <th>Bairro</th>
            <th>Estado</th>
            <th>Cidade</th>
            <th></th>
            <th></th>
        </tr>
    </thead>
</table>


<div class="modal fade" id="myModal" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true">
    <div class="modal-dialog">
        <div class="modal-content" id="modalContent">
        </div>
    </div>
</div>
@section Scripts {
    @Scripts.Render("~/bundles/jqueryval")
    <script type="text/javascript">
        function onBegin() {
            //alert('begin');
        }

        function onSuccess() {
            //alert('success');
        }

        function onComplete() {
            // alert('complete');
            $('#myModal').modal('show');
        }

        function onFailure() {
            alert('fail');
        }
    </script>
}

The screen looks like this:

endereco

Can someone give me a light where I might be missing?

  • 1

    How are the Bundles modal? CSS and JS load at what time?

  • 1

    <a href='...' class="btn btn-success btn-xs">Adicionar Endereço</a> in the print is showing different as it has no word or green color. I’m guessing your site isn’t loading the Bootstrap files, as Gypsy said, checks the Bundles if they’re loading right.

  • So people, I found out that my view is not carrying anything from my _layout, as I’m not very good at front-end to penando. What I’m trying to do is call my controllerX, the controllerY action create so that the controllerY view create appears modally on my screen, without changing the bottom screen ( controller view)but either that’s not possible and I’ll have to create this view by calling it partial from the controllerX, or I’ll have to modify my model to meet this registration, I’ll do the suggested tests.

  • I made a copy of a web page that is working and tested as follows, first implemented in the direct controller folder, the web page worked as it should, when I implemented using area, stopped working, someone knows the reason ?

1 answer

1


You are only loading the bootstrap JS, you have to load the CSS too, do a test, put this tag in your header =

<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.5/css/bootstrap.min.css">

  • I’ll try @henriquedomingospereira

Browser other questions tagged

You are not signed in. Login or sign up in order to post.