Why popup window is not showing using mvc5

Question

0.00/5 (No votes)

See more:

Hi,

I am trying to show a popup window for list of records for select a particular record from a list page. But popup window is not showing. Please help me.

Thank you in advance.
below is my code
--------------

HTML

<h4>Departments</h4>
<a class="btn btn-success" data-toggle="modal" data-target=".DepartmentViewModel">
    <span class="glyphicon glyphicon-eye-open"></span>View
</a>
<div class="modal fade DepartmentViewModal">
    <div class="modal-dialog">
        <div class="modal-content">
            <div class="modal-header">
                <button data-dissmiss="modal" class="close"><span>&times;</span> </button>
                <div class="modal-title">My modal</div>
            </div>
            <div class="modal-body">
                <img src="~/Content/images/Desert.jpg" />
                <p>
                   Some text here or Add fields here..
                </p>
            </div>
            <div class="modal-footer">
                <button class="btn btn-primary">Submit</button>
                <button class="btn btn-default" data-dissmiss="modal">Cancel</button>

            </div>

        </div>
    </div>

</div>

What I have tried:

Please help me.

Thank You very much in Advance.

Posted 27-Jul-16 1:47am

Member 12224368

Updated 28-Jul-16 2:16am

Add a Solution

Comments

F-ES Sitecore 27-Jul-16 7:55am

Html does not have the concept of pop-up windows, you normally need some kind of javascript plug-in to make them work and there is no indication of any such code in what you have posted.

Karthik_Mahalingam 28-Jul-16 8:16am

check my solution

2 solutions

Add a Solution

Add your solution here

Treat my content as plain text, not as HTML

Preview 0

…

Existing Members

Sign in to your account

...or Join us

Download, Vote, Comment, Publish.

Your Email
Password
Forgot your password?

Your Email
This email is in use. Do you need your password?
Optional Password

I have read and agree to the Terms of Service and Privacy Policy
Please subscribe me to the CodeProject newsletters

When answering a question please:

Read the question carefully.
Understand that English isn't everyone's first language so be lenient of bad spelling and grammar.
If a question is poorly phrased then either ask for clarification, ignore it, or edit the question and fix the problem. Insults are not welcome.
Don't tell someone to read the manual. Chances are they have and don't get it. Provide an answer or move on to the next question.

Let's work to help developers, not make them feel stupid.

This content, along with any associated source code and files, is licensed under The Code Project Open License (CPOL)

Richard Deeming · Accepted Answer · 2016-07-27T02:30:00

Assuming you're using Bootstrap[^], the data-target attribute needs to be the ID of the modal dialog element. You can't use a generic jQuery selector, as that could match multiple elements.

HTML

<h4>Departments</h4>
<a class="btn btn-success" data-toggle="modal" data-target="#DepartmentViewModel">
    <span class="glyphicon glyphicon-eye-open"></span>View
</a>
<div class="modal fade" id="DepartmentViewModal">
    <div class="modal-dialog">
        <div class="modal-content">
            <div class="modal-header">
                <button data-dissmiss="modal" class="close"><span>&times;</span> </button>
                <div class="modal-title">My modal</div>
            </div>
            <div class="modal-body">
                <img src="~/Content/images/Desert.jpg" />
                <p>
                   Some text here or Add fields here..
                </p>
            </div>
            <div class="modal-footer">
                <button class="btn btn-primary">Submit</button>
                <button class="btn btn-default" data-dissmiss="modal">Cancel</button>
 
            </div>
 
        </div>
    </div>
</div>

Karthik_Mahalingam · Accepted Answer · 2016-07-28T02:16:00

Solution 2

Refer this for complete documentation on BootStrap Modal[^]

C#

data-dissmiss="modal" // spell error

change to

C#

data-dismiss="modal"

for Save button, you will have to map an event to it and inside the event you close the popup.
refer bootstrap modal save button click and close [^]

Posted 28-Jul-16 2:16am

Karthik_Mahalingam

Comments

Member 12224368 29-Jul-16 0:53am

Thank you sir.. it's working

Karthik_Mahalingam 29-Jul-16 1:25am

cool,

Member 12224368 29-Jul-16 2:23am

marked sir

Karthik_Mahalingam 29-Jul-16 2:25am

Thank you, i would recommend you to go through the tech docs before implementing any new feature, so that you will get to know what and all features available in the framework. it will help you to enhance the knowledge..

Member 12224368 29-Jul-16 2:29am

Ok Sir

Karthik_Mahalingam 29-Jul-16 2:32am

good

Member 12224368 29-Jul-16 2:40am

Karthik sir, I struct in below question, Please post me any videos and suggestions. My question is:

I have a list of records for DepartmentViewModel class and I want to select a particular record from DepartmentViewModel list in a popup window and want to display that particular record in CollegeViewModel class field(In CollegeVIewModel class I have a Department field) So, I have Department Name field in DepartmentVIewModel and Department filed in CollegeVIewModel(here I have to select Department Name from DepartmentViewModel list and after selecting Department Name that name should display in Department field in CollegeViewModel filed). Please provide any videos.

Karthik_Mahalingam 29-Jul-16 2:50am

Linq is the best way

http://linq101.nilzorblog.com/linq101-lambda.php[^]

101 LINQ Samples in C#[^]