Welcome Guest, Not a member yet? Register   Sign In
Jquery UI modal show not working
#1

Hello Everyone,

New to this forum and new to codeigniter. Facing following issue.

I have a view definition file which contain a link to show personal info as given below.

Code:
<div><a href="javascript:show_contact_info();">Show contact info</a></div>

THen I have the javascript function as follows:

Code:
function show_contact_info()
{
$("#emplinfo_div").modal('show');
}

Now here is the modal definition.
Code:
<div class="modal fade" id="emplinfo_div"  role="dialog" >
<div class="modal-dialog">
<div class="modal-content">
CONTACT INFORMATION OF <?php echo $firstname." ".$lastname;?>
<div class="col-md-12 ">
<div  class="col-md-12 row" style="margin-top:10px;">
<b>Email</b> : <?php echo $email;?>
</div>
<div  class="col-md-12 row" style="margin-top:10px;">
<div class="col-md-3 row"><b>Address</b>:</div>
<div class="col-md-9"><?php echo $address1.", ".$address2."<br />".$city.", ".$state."<br />".
$country." - ".$pincode;?></div>
</div>
<div  class="col-md-12 row" style="margin-top:10px;">
<b>Contact phone</b> : <?php echo $phone;?>
</div>
<div id="txt001"></div>
</div>
</div>
<div class="modal-footer">
<button type="button" class="btn btn-primary" data-dismiss="modal">
OK
</button>
</div>
</div>
</div


Please help

Regards,
Vijay
Reply
#2

Hello,

Can somebody answer please..

Project held up on this.

Thanks and regards,
Vijay
Reply
#3

This isn't a CodeIgniter related question, i.m.o.
It's about Javascript and/or jQuery UI.

A few steps you need to check:
Do you load jQuery and jQuery UI correctly?
Do you have a $(document).ready() section to handle jQuery events?

If you replace
Code:
$("#emplinfo_div").modal('show');

by
Code:
alert("You clicked the link to open a popup!");

Does that work?
Reply
#4

Here is how to do it using Bootstrap Modal.

Bootstrap Modal
What did you Try? What did you Get? What did you Expect?

Joined CodeIgniter Community 2009.  ( Skype: insitfx )
Reply
#5

Perhaps you can refer to this website in creating modal with javascript : https://www.w3schools.com/bootstrap/boot..._modal.asp
Reply
#6

(01-10-2019, 11:58 PM)Wouter60 Wrote: This isn't a CodeIgniter related question, i.m.o.
It's about Javascript and/or jQuery UI.

A few steps you need to check:
Do you load jQuery and jQuery UI correctly?
Do you have a $(document).ready() section to handle jQuery events?

If you replace
Code:
$("#emplinfo_div").modal('show');

by
Code:
alert("You clicked the link to open a popup!");

Does that work?

Yes it work when I put alert there. It is going to the function. In fact, the window seems to display something but nothing is shown and the control is passed on to the non-displayed div. I need to click somewhere to get back to original screen. Really weird.
Reply
#7

(01-10-2019, 11:58 PM)Wouter60 Wrote: This isn't a CodeIgniter related question, i.m.o.
It's about Javascript and/or jQuery UI.

A few steps you need to check:
Do you load jQuery and jQuery UI correctly?
Do you have a $(document).ready() section to handle jQuery events?

If you replace
Code:
$("#emplinfo_div").modal('show');

by
Code:
alert("You clicked the link to open a popup!");

Does that work?

To clear the issue, the above modal window is in another view of codeigniter which display the base page with other info. The link is given to click to show only that info in a modal window.
Reply
#8

A modal should be at the bottom of html file.

Here are a couple of links to a more friendly bootstrap dialog (modal)

bootstrap-dialog

Examples
What did you Try? What did you Get? What did you Expect?

Joined CodeIgniter Community 2009.  ( Skype: insitfx )
Reply
#9

If you are using mozilla firefox please use right click then choose "inspect element". In console section if you have an error will show up.
Reply




Theme © iAndrew 2016 - Forum software by © MyBB