I have to choices for a user to make at a sign in form. They can either submit or cancel. If they click submit then they get this :
if they cancel they get this :
I have a minor issue that does not bother me but will bother my supervisor (which in turn will bother me -_-)
if you notice the [x] on the popup of the confirmation dialog it is out of place because it is not centered in the x box, it is outside of it, and I do not know why this could be possibly happening.
This is my Jq :
<script>
$(document).on('submit', "#signinform", function(e)
{
e.preventDefault();
var href = '<?php echo base_url();?>studentlogin_controller/agree';
$("#dialog-confirm").dialog(
{
resizable: false,
draggable: false,
height: 310,
width: 500,
modal: true,
buttons:
{
"Cancel": function()
{
$(this).dialog("close");
},
"Enter Queue": function()
{
window.location.href = href;
}
}
});
});
$(document).on('click', "#Cancel", function(e)
{
e.preventDefault();
var href = '<?php echo base_url();?>studentlogin_controller/studentlogin';
$("#dialog-noconfirm").dialog(
{
resizable: false,
draggable: false,
height: 310,
width: 500,
modal: true,
buttons:
{
"Cancel": function()
{
$(this).dialog("close");
},
"Go Back": function()
{
window.location.href = href;
}
}
});
});
</script>
And my HTML :
<div id="dialog-confirm" title="Please Confirm" style="display: none;">
<ul>
<li>By clicking <FONT COLOR="red">"Enter Queue"</FONT> counselors will be notified that you here - please take a seat</li>
<br>
<li>If You click <FONT COLOR="red">"Cancel"</FONT> you will not be inserted into the Student Queue</li>
</ul>
</div>
<div id="dialog-noconfirm" title="Please Confirm" style="display: none;">
<ul>
<li>By clicking <FONT COLOR="red">"Go Back"</FONT> your information will be removed from the current session</li>
<br>
<li>If You click <FONT COLOR="red">"Cancel"</FONT> your information will still be active and you will stay on the current page</li>
</ul>
</div>
And this is my theme includes and CSS :
<link rel="stylesheet" href="<?php echo base_url(); ?>css/mainstyle.css" type="text/css" />
<link rel="stylesheet" href="<?php echo base_url(); ?>css/secondarystyles.css" type="text/css"/>
<link rel="stylesheet" href="<?php echo base_url(); ?>javascript/themes/smoothness/jquery-ui-1.8.4.custom.css"/>
<script src="<?php echo base_url(); ?>javascript/js/jquery.js" type="text/javascript"></script>
<script src="<?php echo base_url(); ?>javascript/js/jquery-ui-1.10.2.custom.js" type="text/javascript"></script>
And this is happening in google chrome.