PHP bootstrap contact form modul help please

anthonygallina · October 7, 2015

Not finding any errors.

scootstah · October 7, 2015

Did you restart Apache and/or PHP services afterwards? Are you sure that ini is being used?

anthonygallina · October 7, 2015

No not sure that ini is being used. No did not restart services afterwards, not sure I have that ability on the plan I was speaking of. Linux Deluxe

scootstah · October 8, 2015

Try just adding this to the top of your PHP script:

error_reporting(-1);
ini_set('display_errors', 'On');

anthonygallina · October 10, 2015

Thank you Scootstah.

Got that code loaded. I found a error in the HTML here.

 <textarea name="message" id="message" required="required placeholder="message"></textarea>

I corrected that. Now it sends mail. But the modul does'nt load. And this white page gets loaded from the PHP

else {
    ?>
    <html>
      <head>
        <title>Thanks!</title>
      </head>
      <body>
        <p><?php echo $responseMessage; ?></p>
        <p>Click your browser's Back button to return to the page.</p>
      </body>
    </html>
    <?php

Is there a way to get the thank you modul to load only on sucessful mail send, and have the PHP return to the original page? And also Thank you for helping me work on this.

scootstah · October 10, 2015

Can you post the Javascript and full PHP page please?

anthonygallina · October 10, 2015

Yes

(function(cash) { "use strict";

 var ios = navigator.userAgent.match(/Android/i) || navigator.userAgent.match(/webOS/i) ||      navigator.userAgent.match(/iPhone/i) || navigator.userAgent.match(/iPad/i) || navigator.userAgent.match(/iPod/i) || $(window).width()<980;

	//center_image//////////////////////////////////////////////////////////////////////////////////////////
                 
	var obj;
	function center_image(){
		$('.center_img').each(function(){
			obj = $(this);
			var bg_ratio = obj.attr('data-width-img')/obj.attr('data-height-img');
			var wrapper_ratio = obj.parent().width()/obj.parent().height();
			if(bg_ratio<wrapper_ratio){
				var center = (obj.parent().width()/bg_ratio - obj.parent().height())*(-0.5);
				obj.css({'left':'0px', 'top':center, 'width':'100%', 'height':'auto'});
			}
			else{
				var center_hor = (bg_ratio*obj.parent().height() - obj.parent().width())*(-0.5);
				obj.css({'left':center_hor, 'top':'0px', 'height':'100%', 'width':'auto'});
			}
		});
	}
                 
	////////////////////////////////////////////////////////////////////////////////////////////////////////
	
	//center_bg/////////////////////////////////////////////////////////////////////////////////////////////
                 
	function center_bg(){
		$('.center-image1').each(function(){
		  var bgSrc = $(this).attr('src');
		  $(this).parent().css({'background-image':'url('+bgSrc+')'});
		  $(this).remove();
		});
	}
	center_bg();
                 
	////////////////////////////////////////////////////////////////////////////////////////////////////////
	
  ////////////////////////////////////////////////////////////////////////////////////////////////////////
  
  	//sliders///////////////////////////////////////////////////////////////////////////////////////////////
		 
    //==========top-baner======================================================================================// 
     
     var numb_main = 1;
     var crafter_container;         
		 $(function(){
			    crafter_container = $('.crafter-baner').swiper({
				loop:false,
				grabCursor: true,
				slidesPerView: numb_main,
				calculateHeight: true,                  
                pagination: '.crafter-points',
				paginationClickable: true,
                onInit: function(swiper){
                     $('.crafter-points').find('.swiper-pagination-switch').hide(); 
					  if($(window).width()<=480){
						var numb = crafter_container.params.slidesPerView = 1;
					  } else if($(window).width()<=980){
						 var numb = crafter_container.params.slidesPerView = 3;
					  }
					  else {
						var numb = crafter_container.params.slidesPerView = 4;
					  }
                     var slide = crafter_container.slides.length;
                     var points = parseInt(slide - numb) + 1;
                     $('.swiper-pagination-switch').slice(0, points).show();
				}  
			});
		});
		 
	 //========================================================================================================// 
 
    //==========journal-baner======================================================================================// 
    
    var journal_container;         
		 $(function(){
			  journal_container = $('.journal-baner').swiper({
				loop:false,
				grabCursor: true,
				slidesPerView: 'auto',
				calculateHeight: true,
                freeMode: true,
                onInit: function(swiper){
					  if($(window).width()<=530){
						journal_container.params.slidesPerView = 1;
					  } else if($(window).width()<=980){
						journal_container.params.slidesPerView = 2;
					  }
					  else {
						journal_container.params.slidesPerView = 3;
					  } 
				}
			});
          $('.journal .slider-prev').click(function(){
            journal_container.swipePrev();
            return false;
          });

          $('.journal .slider-next').click(function(){
            journal_container.swipeNext();
            return false;
          });     
     });
                 
    //==========header-baner======================================================================================//                          
    //========================================================================================================//
                 
    var header_container;         
		 $(function(){
			  header_container = $('.header-baner').swiper({
				loop:true,
				grabCursor: true,
				slidesPerView: 1,
				calculateHeight: true
			});
          $('.header-2 .slider-prev').click(function(){
            header_container.swipePrev();
            return false;
          });

          $('.header-2 .slider-next').click(function(){
            header_container.swipeNext();
            return false;
          });     
     }); 
                 
    //========================================================================================================//               
	
    //==========logo-baner======================================================================================// 
                 
     var logo_container;         
		 $(function(){
			  logo_container = $('.logo-baner').swiper({
				loop:true,
				grabCursor: true,
				slidesPerView: 4,
				calculateHeight: true,
                onInit: function(swiper){
					  if($(window).width()<=545){
						logo_container.params.slidesPerView = 2;
					  } else if($(window).width()<=768){
						logo_container.params.slidesPerView = 3;
					  }
					  else {
						logo_container.params.slidesPerView = 4;
					  } 
				},
                onTouchStart: function(){
                    if ($('.logo-container img').hasClass('active')) {
                    $('.logo-container img').removeClass('active');}
                    else {
                    $('.logo-container img').addClass('active');
                    }
                  return false;
                }  
			});
		});
                 
    //========================================================================================================//
                 
	////////////////////////////////////////////////////////////////////////////////////////////////////////
                 
	function rax(){
        
        if ($('.crafter-container').length==1){
        
        $(function(){
            
        if($(window).width() > 980){
        numb_main = 4;
          }else {
             if($(window).width() <= 980){
                numb_main = 3;
                   if($(window).width() <= 480 ) {
                      numb_main = 1;
            }
          }
        }
            crafter_container.params.slidesPerView = numb_main;
        });
        
          }
       }           
    rax();
                 
	////////////////////////////////////////////////////////////////////////////////////////////////////////
	
    $(function(){
           $('.container-blog-mix').mixItUp({});
           $('.container-portfolio-mix').mixItUp({});
         
            $('.container-mix').mixItUp({
                animation: {
                    enable:false
                },
                callbacks: {
                    onMixEnd: function(){
                        journal_container.reInit();
                        $('.journal-baner .swiper-wrapper').css({'transform':'translate3d(0px, 0px, 0px)','-webkit-        transform':'translate3d(0px, 0px, 0px)'}); 
                    }
                }  
            });
    });
                 
	////////////////////////////////////////////////////////////////////////////////////////////////////////
                 
	$(window).load(function(){
    	center_image();
    	$('.loader').hide();
        if($('#map-canvas-contact').length==1){
		initialize('map-canvas-contact');}
        
    });  
                 
	////////////////////////////////////////////////////////////////////////////////////////////////////////
	
	////////////////////////////////////////////////////////////////////////////////////////////////////////
                 
	$(window).resize(function(){
		$('body *').addClass('animation-stop');
		rax();
		center_image();
		$('body *').removeClass('animation-stop');
        crafter_container.reInit;
	}); 
                 
	//////////////////click/////////////////////////////////////////////////////////////////////////////////////

    $('.slide-icon, .close-menu').click( function(){
             if($('.navigation nav').hasClass('active')){ 
                $('.menu-mobile-icon').show();
                $('.navigation nav').removeClass('active'); 
                $('body').removeClass('fix');
             }else{
                $('.menu-mobile-icon').hide();
                $('.navigation nav').addClass('active');
                $('body').addClass('fix');
             }
             return false;
    });
                 
    $('.filter-button a').click(function(){
         journal_container.swipeTo(0);
         if ($(this).hasClass('active')){
            $(this).addClass('active');
         }else{
            $(this).removeClass('active');
         }
          return false;
    }); 
                 
    $('.filter-categories a').click(function(){
         if ($(this).hasClass('active')){
            $(this).addClass('active');
         }else{
            $(this).removeClass('active');
         }
          return false;
    }); 
                 
    $('.portfolio-button a').click(function(){
         if ($(this).hasClass('active')){
            $(this).addClass('acttive');
         }else{
            $(this).removeClass('active');
         }
          return false;
    });
                 
    $('.portfolio-menu .portfolio-button a').click(function(){
         if ($(this).hasClass('active')){
            $(this).addClass('acttive');
         }else{
            $(this).removeClass('active');
         }
          return false;
    });
                 
    $('.drop-list, .drop').click(function(){
			if($('.drop-list').hasClass('act')){
				$('.drop-list').removeClass('act');
				$('.drop').find('span').slideUp(300);
			}else{
				$('.drop-list').addClass('act');
                $('.drop-list').removeClass('act2');
				$('.drop').find('span').slideDown(300);
			}
			return false;
		});
		
    $('.drop span a').click(function(){
			$(this).parent().parent().find('input').attr('value',$(this).text());
			$('.drop-list').addClass('act2');
			$('.drop').find('span').slideUp(300);
		});
    $('body').click(function(){
           $('.drop').find('span').slideUp(300);
           $('.drop-list').addClass('act2');
    }); 
                 
     $('.h-push').click(function(){
      $('.drop-span-home').slideDown(500);
        if ($('.drop-span-home').hasClass('slide-submenu')){
           $('.drop-span-home').removeClass('slide-submenu').slideUp(500);   
             }
        else {
            $('.drop-span-home').addClass('slide-submenu').slideDown(500);
            $('.drop-span-portfolio').removeClass('slide-submenu').slideUp(500);
            $('.drop-span-pages').removeClass('slide-submenu').slideUp(500);
             }
      return false;
    });             
    
    $('.p-push').click(function(){
      $('.drop-span-portfolio').slideDown(500);
        if ($('.drop-span-portfolio').hasClass('slide-submenu')){
           $('.drop-span-portfolio').removeClass('slide-submenu').slideUp(500);   
             }
        else {
            $('.drop-span-portfolio').addClass('slide-submenu').slideDown(500);
            $('.drop-span-home').removeClass('slide-submenu').slideUp(500);
            $('.drop-span-pages').removeClass('slide-submenu').slideUp(500);
             }
      return false;
    });
                 
    $('.pg-push').click(function(){
      $('.drop-span-pages').slideDown(500);
        if ($('.drop-span-pages').hasClass('slide-submenu')){
           $('.drop-span-pages').removeClass('slide-submenu').slideUp(500);
        }
        else {
            $('.drop-span-pages').addClass('slide-submenu').slideDown(500);
            $('.drop-span-portfolio').removeClass('slide-submenu').slideUp(500);
            $('.drop-span-home').removeClass('slide-submenu').slideUp(500); 
        }
      return false;
    });
                 
    $('.menu-drop').click(function(){ 
        $('.menu-popup').addClass('act');
        $(this).hide();
        return false;
    }); 
    $('.top-close').click(function(){
         $('.menu-popup').removeClass('act');
        $('.menu-drop').show();
        return false;
    });
     
  ////////////////////////map///////////////////////////////////////////////////////////////////////////////
                 
  function initialize(obj) {
		var lat = $('#'+obj).attr("data-lat");
        var lng = $('#'+obj).attr("data-lng");
		var contentString = $('#'+obj).attr("data-string");
		var myLatlng = new google.maps.LatLng(lat,lng);
		var map, marker, infowindow;
		var image = 'img/marker.png';
		var zoomLevel = parseInt($('#'+obj).attr("data-zoom"));

		var styles = []
		
		var styledMap = new google.maps.StyledMapType(styles,{name: "Styled Map"});
	
		var mapOptions = {
			zoom: zoomLevel,
			disableDefaultUI: true,
			center: myLatlng,
            scrollwheel: false,
			mapTypeControlOptions: {
            mapTypeIds: [google.maps.MapTypeId.ROADMAP, 'map_style']
			}
		}
		
		map = new google.maps.Map(document.getElementById(obj), mapOptions);
	
		map.mapTypes.set('map_style', styledMap);
		map.setMapTypeId('map_style');
	
		infowindow = new google.maps.InfoWindow({
			content: contentString
		});
      
	    
        marker = new google.maps.Marker({
			position: myLatlng,
			map: map,
			icon: image
		});
	
		google.maps.event.addListener(marker, 'click', function() {
			infowindow.open(map,marker);
		});
	
	}
                 
    /////////////////////REMOVE HOVER///////////////////////////////////////////////////////////////
                 
	removeHoverCSSRule();
	function removeHoverCSSRule() {
	  if ('createTouch' in document) {
		try {
		  var ignore = /:hover/;
		  for (var i = 0; i < document.styleSheets.length; i++) {
			var sheet = document.styleSheets[i];
			if (!sheet.cssRules) {
			  continue;
			}
			for (var j = sheet.cssRules.length - 1; j >= 0; j--) {
			  var rule = sheet.cssRules[j];
			  if (rule.type === CSSRule.STYLE_RULE && ignore.test(rule.selectorText)) {
				sheet.deleteRule(j);
			  }
			}
		  }
		}
		catch(e) {
		}
	  }
	}
    
     /////////////////////fancybox///////////////////////////////////////////////////////////////
        
    $('.send-button').click(function(){
         $('.th-popup').addClass('act');
         setTimeout(function() {
                $('.th-popup').removeClass('act');
                  }, 3000);
          }); 
                 $('.th-popup').click(function(){
                     $(this).removeClass('act');
                 });
                 
//         $('.gallery').masonry({
//                   itemSelector: '.item',
//                   columnWidth: 600
//         });
//                 
})(jQuery);

this is called all.js

There also is a bootstrap.min.js not sure if you want that. jquery.fancybox.pack.js jquery.mixitup.min.js jquery-1.11.1.min.js a swiper js http://www.idangero.us/swiper/#.VhkOOKe36DA

I have this one in a js file loaded by link into the page

$('.send-button').on('submit', function(e){
    e.preventDefault();

    var data = {
        email: $('#senderEmail').val(),
        message: $('#message').val()
    };

    $.ajax({
        url: 'php/contact.php',
        type: 'POST',
        dataType: 'json',
        data: data,
        success: function(response){
            if (response.success === true) {
                $('.th-popup').addClass('act');

                setTimeout(function(){
                    $('.th-popup').removeClass('act');
                }, 3000);
            }    
        }
    });
});

And the only PHP file is the contact form below

<?php
error_reporting(-1);
ini_set('display_errors', 'On');
function isAjaxRequest()
{
    return (isset($_SERVER['HTTP_X_REQUESTED_WITH']) && strtolower($_SERVER['HTTP_X_REQUESTED_WITH']) == 'xmlhttprequest');
}

// Define some constants
define( "RECIPIENT_NAME", "developer" );
define( "RECIPIENT_EMAIL", "developer@fullstackwebdesign.net" );
define( "EMAIL_SUBJECT", "Visitor Message" );

// Read the form values
$success = false;
$senderEmail = isset( $_POST['senderEmail'] ) ? preg_replace( "/[^\.\-\_\@a-zA-Z0-9]/", "", $_POST['senderEmail'] ) : "";
$message = isset( $_POST['message'] ) ? preg_replace( "/(From:|To:|BCC:|CC:|Subject:|Content-Type:)/", "", $_POST['message'] ) : "";

// If all values exist, send the email
if ( $senderEmail && $message ) {
    $recipient = RECIPIENT_NAME . " <" . RECIPIENT_EMAIL . ">";
    $headers = "From: " . $senderEmail . " <" . $senderEmail . ">";
    $success = mail( $recipient, EMAIL_SUBJECT, $message, $headers );

    if ($success === true) {
        $responseMessage = "Thanks for sending your message! We'll get back to you soon.";
    } else {
        $responseMessage = "There was a problem sending your message. Please try again.";
    }

    // Return an appropriate response to the browser
    if (isAjaxRequest() === true) {
        // send JSON response
        echo json_encode(array(
            'success' => $success,
            'message' => $responseMessage,
        ));

        // exit to make sure no other output is sent
        exit;
    } else {
    ?>
    <html>
      <head>
        <title>Thanks!</title>
      </head>
      <body>
        <p><?php echo $responseMessage; ?></p>
        <p>Click your browser's Back button to return to the page.</p>
      </body>
    </html>
    <?php
    }
} else {
    // you'll want to handle this state - where $senderEmail or $message
    // are empty strings.
}

Let me know if you need more please.

scootstah · October 10, 2015

Okay, so you didn't modify the PHP to give Javascript what it needs. See my other post.

anthonygallina · October 10, 2015

I am not sure I am understanding the handling empty strings part? Sorry

scootstah · October 10, 2015

Where?

anthonygallina · October 10, 2015

What part of the code needs to be modified to give Javascript what it needs?

scootstah · October 11, 2015

I already explained that in detail in my other post. What are you having trouble with?

anthonygallina · October 11, 2015

The javascript you proposed to use does not load the page modul, by it's self. I can see that you tried to activate it in the code but it doesnt work. The only way the modul right now loads is with the on click code. And with that it loads the modul whether or not the form input is correct. Also I was needing to have the sucess or failure of sending the form sent back to the page. Not to a blank white page with the out come on it. So that is where I am having trouble. I pulled the code down and compared it with diff to see if I was missing something. But it looks indentical to me to the code on your prior post that you are referencing.

scootstah · October 11, 2015

The Javascript doesn't work because you're not returning the expected JSON response from your PHP script - you're just returning HTML. My proposed PHP script determines whether the request came from AJAX and returns JSON if so - otherwise it returns HTML.

The modifications I made to the PHP script returns whether the request succeeded or not, and includes your message strings. I'm not sure how you think it is identical, they are very different.

anthonygallina · October 14, 2015

Thank you seandisanti, benanamen, Jaques1, and scootah. I will look into the issues you spoke of. RTFM on the form, I have been looking on the web. I will open another thread if I cant figure it out. Oh I have been reading the O'Reily Programming PHP, 3rd Edition.
And found this helpfull site for a link to help with forms for others that may come this way. http://www.phpcontactform.com/creating-contact-form-thank-you-pages.html :happy-04:

Sign In

PHP bootstrap contact form modul help please

Recommended Posts

Link to comment

Share on other sites

Link to comment

Share on other sites

Link to comment

Share on other sites

Link to comment

Share on other sites

Link to comment

Share on other sites

Link to comment

Share on other sites

Link to comment

Share on other sites

Link to comment

Share on other sites

Link to comment

Share on other sites

Link to comment

Share on other sites

Link to comment

Share on other sites

Link to comment

Share on other sites

Link to comment

Share on other sites

Link to comment

Share on other sites

Link to comment

Share on other sites

Join the conversation

Important Information