I am trying to load two modal dialog boxes with Jquery. Both of them load separate pages using ajax. The only problem is that only one of them works.
I think I need to simplify my code but am unsure how.
<script type="text/javascript">
$(document).ready(function(){
var dialogOpts = {
modal: true,
bgiframe: true,
autoOpen: false,
height: 400,
width: 550,
draggable: true,
resizeable: true,
title: "Your campaign rates",
};
$("#ratesbox").dialog(dialogOpts); //end dialog
$('#ratesbutton').click(
function() {
$("#ratesbox").load("rate_sheet/index.php", [], function(){
$("#ratesbox").dialog("open");
}
);
return false;
}
);
});
</script>
<script type="text/javascript">
$(document).ready(function(){
var dialogOptsPass = {
modal: true,
bgiframe: true,
autoOpen: false,
height: 400,
width: 550,
draggable: true,
resizeable: true,
title: "Change your pasword",
};
$("#passwordbox").dialog(dialogOptsPass); //end dialog
$('#passwordbutton').click(
function() {
$("#passwordbox").load("change_password/index.php", [], function(){
$("#passwordbox").dialog("open");
}
);
return false;
}
);
});
</script>
Is it posible to combine the two scripts????