?
Solved

How to include Jquery simple Model dialog in an asp.net project

Posted on 2010-11-17
9
Medium Priority
?
1,749 Views
Last Modified: 2012-05-10
First of all i wantto include the jquery simple modal dialog in an asp.net application, then
I need to call jquery simple mode dialog behind the click eventof a button in an asp.net project
0
Comment
Question by:Ammar Iqbal
  • 4
  • 4
9 Comments
 
LVL 6

Accepted Solution

by:
Codebot earned 2000 total points
ID: 34153562
It is very simple
Just include reevant js and css files.
and then add code on button onclick event.

here are example with how to use tutorials
http://jquery.com/demo/thickbox/
or
http://www.ericmmartin.com/projects/simplemodal/
0
 
LVL 21

Expert Comment

by:Alpesh Patel
ID: 34153593
Create Model popup using jQuery and restrict to open on document.ready.
Open dialog on click of any HTML button click event. It works.
0
 
LVL 1

Assisted Solution

by:Ammar Iqbal
Ammar Iqbal earned 0 total points
ID: 34153595
for simple modal dialog, I have included these two js files in my .aspx page
script src="/js/jquery.simplemodal-1.4.1.js" type="text/javascript"></script>
 <script src="/js/jquery.simplemodal-1.4.1.min.js" type="text/javascript"></script>

is it right?

I am noticing, that each of the modal dialog has its own css and img files....Do i need to copy thiese in my respective folder of my project...
Is it possible to customize its css with respect of my project
0
Get expert help—faster!

Need expert help—fast? Use the Help Bell for personalized assistance getting answers to your important questions.

 
LVL 1

Author Comment

by:Ammar Iqbal
ID: 34153599
but how to create a model popup, can you give me a sample
0
 
LVL 6

Assisted Solution

by:Codebot
Codebot earned 2000 total points
ID: 34153621
Yes you need all images and css file and you can customized everything according to your needs.
Example is given in my earlier post.
here are example with how to use tutorials
http://jquery.com/demo/thickbox/
or
http://www.ericmmartin.com/projects/simplemodal/
0
 
LVL 1

Author Comment

by:Ammar Iqbal
ID: 34154044
I have added  nad include all the relvant files to invoke a contact form of simple dialog

i have included these files as well:
<link id="Link1" runat="server" type="text/css" href="/css/contact.css"  rel="stylesheet" />      
 <link id="Link2" runat="server" type="text/css" href="/css/demo.css"  rel="stylesheet" />
 
   <script src="/js/jquery.simplemodal.js" type="text/javascript"></script>
  <script src="/js/jquery.js" type="text/javascript"></script>
   <script src="/js/contact.js" type="text/javascript"></script>


Now the problem is that I need to invoke a contact form or a simple model dialog when the button is clicked. I am not figuring it out how to do this stuff in a right way.
Any suggestions?
0
 
LVL 6

Expert Comment

by:Codebot
ID: 34164363
Simple add this link in your html

<p><a href="#" class="demo button">Demo</a> <a href="http://simplemodal.googlecode.com/files/simplemodal-demo-contact-1.4.1.zip" class="button">Download</a></p> 

Open in new window

0
 
LVL 6

Expert Comment

by:Codebot
ID: 34164381
I mean

<a href="#" class="demo button">Demo</a>
#= your page
0
 
LVL 1

Author Closing Comment

by:Ammar Iqbal
ID: 34276675
partial solution
0

Featured Post

Free Tool: SSL Checker

Scans your site and returns information about your SSL implementation and certificate. Helpful for debugging and validating your SSL configuration.

One of a set of tools we are providing to everyone as a way of saying thank you for being a part of the community.

Question has a verified solution.

Are you are experiencing a similar issue? Get a personalized answer when you ask a related question.

Have a better answer? Share it in a comment.

Join & Write a Comment

Calculating holidays and working days is a function that is often needed yet it is not one found within the Framework. This article presents one approach to building a working-day calculator for use in .NET.
This article describes and provides a custom-made tool I wrote to give businesses a means of identifying commercial music content, without having to expend too much effort. Business recordings are easily identified from possibly illegal music files …
The video will let you know the exact process to import OST/PST files to the cloud based Office 365 mailboxes. Using Kernel Import PST to Office 365 tool, one can quickly import numerous OST/PST files to Office 365. Besides this, the tool also comes…
Watch the working video to know how to import Outlook PST/OST files to Amazon WorkMail. Kernel released this tool which is very easy to use and migrate single or multiple PST and OST files to Amazon WorkMail. To know more about Kernel Import PST to …

589 members asked questions and received personalized solutions in the past 7 days.

Join the community of 500,000 technology professionals and ask your questions.

Join & Ask a Question