Welcome Guest, Not a member yet? Register   Sign In
Using Jquery Modal to show data in pop up
#1

[eluser]Unknown[/eluser]
Step by step guide to use jquery modal to integrate with codeigniter!

1- First of all add three files in header section of your view where you want to show data in popup.

Code:
Adding jquery file path
Adding jqModal.js path

     <link href="<?php echo base_url() ?>styles/jqModal.css" rel="stylesheet" type="text/css" />

Adding style sheet and invoking event in header also
Code:
<style>
.container {
    width: 333px;
    height: 90px;
    border: #888 4px solid;
    padding: 80px 40px;
    position: absolute;
    top: 50px;
    left: 25%;
    margin-left: -151px;
}
#response{
    z-index: 300;
    margin: auto;
    top: 200px;
    width: 400px;
    height: auto;
    background-color: #c4dded;
    display: none;
}
</style>

defining script tag
$(document).ready(function(){
    $('#response').jqm({trigger:'.onclickcall', toTop: true});
});
ending script tag

2- In body section

Code:
<p class="onclickcall">Click to show</p>
<div id="response" class='container'>That data will be shown in popup window.That data will be shown in popup window.That data will be shown in popup window.That data will be shown in popup window. </div >

sorry we can't use script tag in code here so please add script tag in head section

In your body section, adding the anchor tag for popup div




Theme © iAndrew 2016 - Forum software by © MyBB