I wanted to change the following function to bs modal or any other fancy dialogue box.
if (Form::mailer($email, $fname, $lname)) {
echo
'<script >
alert("Thank you for registration.");
window.location = "../test.php"; <
/script>';
} else {
echo ' <
script >
alert("Error, please try submitting again. Error code 1");
window.history.back(); <
/script>';
}
You can replace alert with BoostrapDialog:
Need to add these bootstrap CDN first
https://cdnjs.cloudflare.com/ajax/libs/bootstrap3-dialog/1.34.7/css/bootstrap-dialog.min.css
https://cdnjs.cloudflare.com/ajax/libs/bootstrap3-dialog/1.34.7/js/bootstrap-dialog.min.js
And then replace the alert method with show method of BootstrapDialog
BootstrapDialog.show({
message: 'Thank you for registration.'
});
For detail, please refer http://nakupanda.github.io/bootstrap3-dialog/
Related
I am trying to show a popup box in if conditions.
Here is my HTML :
<div id="my-confirm-dialog" class="dialog-overlay">
<div class="dialog-card">
<div class="dialog-question-sign"><i class="fa fa-question"></i></div>
<div class="dialog-info">
<h5>Thank You !</h5>
<p>Your Messag has been sent.</p>
<button class="dialog-confirm-button">OK</button>
</div>
</div>
</div>
Here is my Script :
<script>
$(document).ready(function() {
function showDialog(id){
var dialog = $('#' + id),
card = dialog.find('.dialog-card');
dialog.fadeIn();
card.css({
'margin-top' : -card.outerHeight()/2
});
}
function hideAllDialogs(){
$('.dialog-overlay').fadeOut();
}
$('.dialog-confirm-button, .dialog-reject-button').on('click', function () {
hideAllDialogs();
});
$('.dialog-overlay').on('click', function (e) {
if(e.target == this){
hideAllDialogs();
}
});
$(document).keyup(function(e) {
if (e.keyCode == 27) {
hideAllDialogs();
}
});
$('.dialog-show-button').on('click', function () {
var toShow = $(this).data('show-dialog');
showDialog(toShow);
});
});
</script>
Here is my button :
<span class="dialog-show-button" data-show-dialog="my-confirm-dialog">Dialog Button</span>
Whenever, I click on the button, a popup box is arrived. till now everyythin is fine. Now what i am trying to do is, when I sent mail and the condition is true, This popup box will appear.
Here is the condition and in this alert box is working perfectly.
if ($mail == true){
echo '<script type="text/javascript">alert("Thankyou for Contacting Shagun Sweets")</script>';
}
I just want to show the popup box in the place of alert box, I have already tried something like this but not helpful.
<?php
if ($mail == true){
echo "<script>";
echo "showDialog('my-confirm-dialog');";
echo "</script>";
}
?>
Please help me out.
Define the showDialog function outside the DOM ready function.
And, do this instead:
$script = '<script type="text/javascript">';
$script .= 'showDialog('my-confirm-dialog');';
$script .= '</script>';
echo $script;
If your alert is working, this should then also work
Your php script should have worked. But it is possible that it isn't working because you are actually checking if mail is true before the page loads. here is what I suggest you do, edit your php function to:
<?php if($mail == true){
echo "<script>var show_dialog = true;</script>";
} ?>
in your script:
$(document).ready(function() {
// put me in the end
if(show_dialog != undefined && show_dialog){
showDialog('my-confirm-dialog');
}
});
hi i have a message alert box that appears when a user gets a new message, what i want to do is add sound to this box when it pops up, i am using a php if statement to check when a user gets a new message and i have tried adding sound by doing the following but its not working please can someone show me how to do this. thanks.
<?php
$check_new_chats = check_new_chats();
while ($chat = mysql_fetch_array($check_new_chats))
if (isset($_SESSION['user_id'])) {
if ($chat['to_user_id'] == $_SESSION['user_id']){
echo( "<embed name='sound_file' src='/assets/music/sound_file.mp3' loop='true' hidden='true' autostart='true'/>"); ?>
<?php
$check_new_chats = check_new_chats();
while ($chat = mysql_fetch_array($check_new_chats))
if (isset($_SESSION['user_id'])) {
if($chat['to_user_id'] == $_SESSION['user_id']){
echo '<script type="text/javascript">play_sound();</script>';
}
}
?>
Here's the Javascript function:
<script type="text/javascript">
function play_sound() {
var audioElement = document.createElement('audio');
audioElement.setAttribute('src', '/assets/music/sound_file.mp3');
audioElement.setAttribute('autoplay', 'autoplay');
audioElement.load();
audioElement.play();
}
</script>
According to the question:
hi i have a message alert box that appears when a user gets a new
message, what i want to do is add sound to this box when it pops up
You already have some sort of javascript function that displays an alert box when needed. Use the info from this answer to play a sound with it.
<audio id="soundHandle" style="display: none;"></audio>
<script>
soundHandle = document.getElementById('soundHandle');
soundHandle.src = '/assets/music/sound_file.mp3';
</script>
//With your message alert function....
alert("Message box");
soundHandle.play();
I'm trying to display a hyperlink that has a colorbox popup associated with it.
The javascript is:
function bid() {
var bid = document.getElementById("bid").value;
if (bid>0 && bid<=100) {
var per = 3.50;
} else if (bid>100 && bid<=200) {
var per = 3.40;
} else if (bid>200 && bid<=300) {
var per = 3.30;
}
var fee = Math.round(((bid/100)*per)*100)/100;
var credit = 294.9;
if (fee>credit) {
var message = 'Error';
} else {
var message = '<a class="popup" href="URL">The link</a>';
}
document.getElementById("bidText").innerHTML=message;
}
The javascript works fine and displays the link in the right conditions, the problem however is that when clicking the link, the Colorbox isn't being applied and the page loads as a normal hyperlink.
I have the following code in the header:
jQuery(document).ready(function () {
jQuery('a.popup').colorbox({ opacity:0.5 , rel:'group1' });
});
If I output just the hyperlink in the standard html source, it works fine and displays correctly in the Colorbox.
Any help would be greatly appreciated :)
You need to wait until you've appended the link before you call the colorbox() method on it.
Move your colorbox() method so that it comes after your innerHTML.
jQuery('a.popup').colorbox({ opacity:0.5 , rel:'group1' });
when adding html dynamically you, the event added already can not be triggered.
try the following code
jQuery(document).ready(function () {
$("a.popup").on("click", function(event){
applycolorbox($(this));
});
function applycolorbox($elem) {
$elem.colorbox({ opacity:0.5 , rel:'group1' });
}
I have this code that is to fetch a particular item in the database after the user presses a button. If the item is found I would like to display a confirm message via javascript and I don't know how to show it.
After obtaining the item from the database
if(null!=mysqli_fetch_array($res)))
{
echo ""; // how can I call the javascript code here ?
}
and the following confirm box
<script type="text/javascript">
function onConfirm()
{
return confirm("Display this item ?");
}
</script>
Use jquery and ajax to get the value from the database:
<script src="http://code.jquery.com/jquery-1.7.2.min.js"></script>
$.get("ajax.php", function(data){
if(data != "0"){
if(confirm("Display this item ?"))
{
//do something
}
}
});
ajax.php:
//other db code here
if(null!=mysqli_fetch_array($res)))
{
echo "1";
}
else{
echo "0";
}
There are number of ways you can solve this. A good way is to:
Send an ajax request to a page
The page does the mysql stuff and returns(echo in case of PHP) the message
On the callback function use simple way such as alert() to show the message.
i've been trying to get a confirm box to work, i am using php and jquery to make a confirm box appear when clicking on a delete link, actual code :
$(document).ready(function(){
if (jQuery("a.delete-link").length > 0) {
$("a.delete-link").bind("click", function(){
return confirm("Sunteti sigur ca doriti sa stergeti?");
});
}
});
and the link is called :
sterge
the link is used to submit a form when clicked, the code for that is :
$(document).ready(function(){
if ($(".formSubmit").length > 0) {
if ($(".formSubmit").parents("form").find("input:submit").length == 0) {
$(".formSubmit").parents("form").append('<div style="width:1px;height:1px;overflow:hidden;"><input style="width:0;height:0;overflow:hidden;" type="submit" /></div>');
}
$(".formSubmit").click(function(){
$(this).parents("form").trigger("submit");
return false;
});
}
});
i do get the confirm dialog, but any option i chose, the form submits and the delete action is called.. any idea what i'm doing wrong ?
Bind the confirmation to the onSubmit of the form. You'll save a lot of hassle that way and you will get a confirmation no matter how the form was submited.
$( document ).ready ( function () {
$( 'selector for your form' ).submit ( function () {
return confirm ( 'Are you sure ...?' );
} );
} );
You have two click events bound to the anchor tag. The first event shows the confirm and the second submits the form.
Trigger the form submission only if the user confirmed:
$(document).ready(function(){
if ($(".formSubmit").length > 0) {
if ($(".formSubmit").parents("form").find("input:submit").length == 0) {
$(".formSubmit").parents("form").append('<div style="width:1px;height:1px;overflow:hidden;"><input style="width:0;height:0;overflow:hidden;" type="submit" /></div>');
}
$(".formSubmit").click(function(){
if ($(this).hasClass('delete-link') && confirm("Sunteti sigur ca doriti sa stergeti?"))
{
$(this).parents("form").trigger("submit");
}
return false;
});
}
});
Can you use this:
<a href="#" onclick"return javascript:void(0);" ... />