404 Not Found

<?php

ini_set('display_errors', 1);
ini_set('display_startup_errors', 1);
error_reporting(E_ALL);

$pagetitle = "ST Engineers - Contact Us";
require 'header.php';
?>

<section class="contact-banner">
    <div class="d-flex flex-column align-items-center">
        <div class="page-header__inner text-center">
            <h1>Contact Us</h1>
        </div>
    </div>
</section>

<section class="address-sec">
    <div class="container">
        <div class="row" style="margin:0 0;">
            <div class="col-lg-5 contact-content mt-5">
                <h5>Reach out to us</h5>

<div class="contactdiv">
                    <span class="contactdiv1">Tel :</span>
                    <span> 
                        
                         <a href="tel:+91 7397685550" style="color:#2c2c2c;">For Machine Enquiry: +91 73976 85550</a> <br>
                        <a href="tel:+91 42225 90810" style="color:#2c2c2c;">For Careers & General Enquiry: +91 42225 90810</a>
                    </span>
                </div>
                
                <div class="contactdiv">
                    <span class="contactdiv1">Email :</span>
                    <span> 
                        <a href="mailto:enquiry.lead.trading@stengineers.com" style="color:#2c2c2c;">enquiry.lead.trading@stengineers.com</a>
                    </span>
                </div>
                
                <div class="contactdiv">
                    <span class="contactdiv1">Address :</span>
                    <span class="contactdiv2">
                        <span>&nbsp;S&T Engineers (P) Ltd</span><br/>
                        <span>22, Vasanth Nagar, </span><br/>
                        <span>Singanallur, Coimbatore - 641005,</span><br/>
                        <span>Tamil Nadu, INDIA.</span><br/>
                    </span>
                </div>

<div class="row">
                        <input class="form-control" type="hidden" name="pageSource" id="e_pageSource1" value="<?php echo $currentPage; ?>">
                        
                        <div class="col-sm-6">
                            <div class="form-group">
                                <input class="form-control" name="name" id="e_name1" type="text" placeholder="Name*">
                                <span style="color: red;" class="errorform" id="e_name_Err1"></span>
                            </div>
                        </div>
                        
                        <div class="col-sm-6">
                            <div class="form-group">
                                <input class="form-control" name="company" id="e_company1" type="text" placeholder="Company*">
                                <span style="color: red;" class="errorform" id="e_company_Err1"></span>
                            </div>
                        </div>
                        
                        <div class="col-sm-6">
                            <div class="form-group">
                                <input class="form-control" name="email" id="e_email1" type="email" placeholder="Email ID*">
                                <span style="color: red;" class="errorform" id="e_email_Err1"></span>
                            </div>
                        </div>
                        
                        <div class="col-sm-6">
                            <div class="form-group">
                                <input class="form-control" name="mobile" id="e_mobile1" type="tel" inputmode="tel">
                                <span style="color: red;" class="errorform" id="e_mobile_Err1"></span>
                            </div>
                        </div>
                        
                        <div class="col-sm-6">
                            <div class="form-group">
                                <input class="form-control" name="country" id="e_country1" type="text" placeholder="Country*">
                                <span style="color: red;" class="errorform" id="e_country_Err1"></span>
                            </div>
                        </div>
                        
                        <div class="col-sm-6">
                            <div class="form-group">
                                <input class="form-control" name="pincode" id="e_pincode1" type="text" placeholder="Pin Code*">
                                <span style="color: red;" class="errorform" id="e_pincode_Err1"></span>
                            </div>
                        </div>
                        
                        <div class="col-12">
                            <div class="form-group">
                                <input class="form-control" name="product" id="e_product1" type="text" placeholder="Product">
                                <span style="color: red;" class="errorform" id="e_product_Err1"></span>
                            </div>
                        </div>
                        
                        <div class="col-12">
                            <div class="form-group mt-25">
                                <textarea class="form-control w-100" name="message" id="e_message1" cols="30" rows="4" placeholder="Message"></textarea>
                                <span style="color: red;" class="errorform" id="e_message_Err1"></span>
                            </div>
                        </div>
                        
                        
                         <div class="form-group mt-3">
        <div class="g-recaptcha" data-sitekey="6LdpyB4sAAAAAFEGvTl7alj-dlsTn0qtlYbRGVw9" data-callback="onCaptchaVerified" data-expired-callback="onCaptchaExpired"></div>
        <span style="color: red;" id="recaptcha-error" class="errorform"></span>
    </div>
    
    <div class="form-group mt-3">
        <button type="submit" class="boxed-btn" id="add-submit">SUBMIT</button>
        <div id="succ-client-alert1" style="color: green;padding: 6px 0px 0px 16px;text-align:center"></div>
        <div id="fail-client-alert1" style="color: red;padding: 6px 0px 0px 16px; text-align:center"></div>
                    </div>
                </form>
            </div>
        </div>
    </div>
</section>

<?php require 'footer.php';?>

<scriptsrc="https://code.jquery.com/jquery-3.6.0.min.js"></script>
<script src="https://rawgit.com/RobinHerbots/jquery.inputmask/3.x/dist/jquery.inputmask.bundle.js"></script>

function onCaptchaVerified(token) {
    isCaptchaVerified = true;
    document.getElementById('recaptcha-error').textContent = '';
}

function onCaptchaExpired() {
    isCaptchaVerified = false;
    if (typeof grecaptcha !== 'undefined') grecaptcha.reset();
}

// Initialize phone input with intlTelInput
$(document).ready(function($) {
    var phoneInputID = "#e_mobile1";
    var input = document.querySelector(phoneInputID);
    phoneInputInstance = window.intlTelInput(input, {
        formatOnDisplay: true,
        autoHideDialCode: false,
        autoPlaceholder: "aggressive",
        hiddenInput: "full_number",
        initialCountry: "auto",
        preferredCountries: ['in', 'us', 'gb', 'ca', 'au', 'de', 'fr'],
        separateDialCode: true,
        customPlaceholder: function(selectedCountryPlaceholder, selectedCountryData) {
            return '' + selectedCountryPlaceholder.replace(/[0-9]/g, 'X');
        },
        geoIpLookup: function(callback) {
            $.get('https://ipinfo.io', function() {}, "jsonp").always(function(resp) {
                var countryCode = (resp && resp.country) ? resp.country : "";
                callback(countryCode);
            });
        },
        utilsScript: "https://cdnjs.cloudflare.com/ajax/libs/intl-tel-input/11.0.14/js/utils.js"
    });

$(phoneInputID).on("focus click countrychange", function(e, countryData) {
        var pl = $(this).attr('placeholder') + '';
        var res = pl.replace(/X/g, '9');
        if (res != 'undefined') {
            $(this).inputmask(res, {placeholder: "X", clearMaskOnLostFocus: true});
        }
    });
});

// Main form submission function
function submitContactForm(event) {
    event.preventDefault(); // Prevent normal form submission
    
    // Clear previous messages
    document.querySelectorAll('.errorform').forEach(el => el.textContent = '');
    document.getElementById('recaptcha-error').textContent = '';
    document.getElementById('succ-client-alert1').textContent = '';
    document.getElementById('fail-client-alert1').textContent = '';
    
    let isValid = true;
    
    // 1. Check reCAPTCHA
    if (!isCaptchaVerified) {
        document.getElementById('recaptcha-error').textContent = 'Please verify that you are not a robot.';
        isValid = false;
    }
    
    // 2. Validate Name
    const nameEl = document.getElementById('e_name1');
    if (!nameEl.value.trim()) {
        document.getElementById('e_name_Err1').textContent = 'Name is required';
        isValid = false;
    } else if (nameEl.value.trim().length < 2) {
        document.getElementById('e_name_Err1').textContent = 'Name must be at least 2 characters';
        isValid = false;
    }
    
    // 3. Validate Company
    const companyEl = document.getElementById('e_company1');
    if (!companyEl.value.trim()) {
        document.getElementById('e_company_Err1').textContent = 'Company is required';
        isValid = false;
    }
    
    // 4. Validate Email
    const emailEl = document.getElementById('e_email1');
    const emailRegex = /^[^\s@]+@[^\s@]+\.[^\s@]+$/;
    if (!emailEl.value.trim()) {
        document.getElementById('e_email_Err1').textContent = 'Email is required';
        isValid = false;
    } else if (!emailRegex.test(emailEl.value.trim())) {
        document.getElementById('e_email_Err1').textContent = 'Please enter a valid email address';
        isValid = false;
    }
    
    // 5. Validate Mobile
    const mobileEl = document.getElementById('e_mobile1');
    const mobileValue = mobileEl.value.trim();
    
    if (!mobileValue) {
        document.getElementById('e_mobile_Err1').textContent = 'Mobile number is required';
        isValid = false;
    } else if (phoneInputInstance && !phoneInputInstance.isValidNumber()) {
        const countryData = phoneInputInstance.getSelectedCountryData();
        document.getElementById('e_mobile_Err1').textContent = `Please enter a valid ${countryData.name} mobile number`;
        isValid = false;
    }
    
    // 6. Validate Country
    const countryEl = document.getElementById('e_country1');
    if (!countryEl.value.trim()) {
        document.getElementById('e_country_Err1').textContent = 'Country is required';
        isValid = false;
    }
    
    // 7. Validate Pincode
    const pincodeEl = document.getElementById('e_pincode1');
    const pincodeValue = pincodeEl.value.trim();
    
    if (!pincodeValue) {
        document.getElementById('e_pincode_Err1').textContent = 'Pin Code/Zip Code is required';
        isValid = false;
    } else if (pincodeValue.length < 3) {
        document.getElementById('e_pincode_Err1').textContent = 'Pin Code must be at least 3 characters';
        isValid = false;
    }
    
    // If validation fails, scroll to first error
    if (!isValid) {
        const firstError = document.querySelector('.errorform:not(:empty)');
        if (firstError) {
            firstError.scrollIntoView({ behavior: 'smooth', block: 'center' });
        }
        return false;
    }
    
    // If validation passes, submit via AJAX
    submitFormViaAjax();
    return false;
}

// AJAX form submission
function submitFormViaAjax() {
    const btn = document.getElementById('add-submit');
    const originalBtnText = btn.textContent;
    btn.disabled = true;
    btn.textContent = 'Submitting...';
    
    // Get form data
    const formData = new FormData();
    
    // Add all form fields
    formData.append('name', document.getElementById('e_name1').value.trim());
    formData.append('company', document.getElementById('e_company1').value.trim());
    formData.append('email', document.getElementById('e_email1').value.trim());
    formData.append('country', document.getElementById('e_country1').value.trim());
    formData.append('pincode', document.getElementById('e_pincode1').value.trim());
    formData.append('product', document.getElementById('e_product1').value.trim());
    formData.append('message', document.getElementById('e_message1').value.trim());
    formData.append('pageSource', document.getElementById('e_pageSource1').value);
    
    // Add phone number with country code
    if (phoneInputInstance) {
        const fullNumber = phoneInputInstance.getNumber();
        formData.append('mobile', fullNumber);
    } else {
        formData.append('mobile', document.getElementById('e_mobile1').value.trim());
    }
    
    // Add reCAPTCHA response
    const recaptchaResponse = grecaptcha.getResponse();
    if (recaptchaResponse) {
        formData.append('g-recaptcha-response', recaptchaResponse);
    }
    
    // Send AJAX request to your API endpoint
    fetch('https://stengineers.com/admin/api/insertcontact.php', {
        method: 'POST',
        body: formData
    })
    .then(response => {
        // First check if response is JSON
        const contentType = response.headers.get('content-type');
        if (contentType && contentType.includes('application/json')) {
            return response.json();
        } else {
            return response.text().then(text => {
                // Try to parse as JSON even if content-type is wrong
                try {
                    return JSON.parse(text);
                } catch {
                    // If not JSON, return a generic response
                    return {
                        success: response.ok,
                        message: text || 'Form submitted successfully'
                    };
                }
            });
        }
    })
    .then(data => {
        console.log('API Response:', data); // Debug log
        
        // Handle response based on your API's response format
        if (data.success || data.status === 'success' || data.message?.includes('success')) {
            // Show success message briefly, then redirect
            const successMessage = 'Thank you! Your message has been sent successfully.';
            document.getElementById('succ-client-alert1').innerHTML = `
                <div style="background: #d4edda; color: #155724; padding: 12px; border-radius: 5px; border: 1px solid #c3e6cb;">
                    <strong>Success!</strong> ${successMessage}<br>
                    <small>Redirecting to thank you page...</small>
                </div>
            `;
            document.getElementById('fail-client-alert1').textContent = '';
            
            // Reset form
            document.getElementById('enq_form').reset();
            
            // Reset phone input
            if (phoneInputInstance) {
                phoneInputInstance.setNumber("");
            }
            
            // Reset captcha
            if (typeof grecaptcha !== 'undefined') {
                grecaptcha.reset();
            }
            isCaptchaVerified = false;
            
            // Redirect to thank you page after 1.5 seconds
            setTimeout(() => {
                window.location.href = "https://stengineers.com/thank-you/";
            }, 1500);
            
        } else {
            // Show error message
            const errorMessage = data.message || 'There was an error submitting your form. Please try again.';
            document.getElementById('fail-client-alert1').innerHTML = `
                <div style="background: #f8d7da; color: #721c24; padding: 12px; border-radius: 5px; border: 1px solid #f5c6cb;">
                    <strong>Error!</strong> ${errorMessage}
                </div>
            `;
            document.getElementById('succ-client-alert1').textContent = '';
        }
    })
    .catch(error => {
        console.error('Error:', error);
        document.getElementById('fail-client-alert1').innerHTML = `
            <div style="background: #f8d7da; color: #721c24; padding: 12px; border-radius: 5px; border: 1px solid #f5c6cb;">
                <strong>Error!</strong> There was an error submitting your form. Please try again.
            </div>
        `;
        document.getElementById('succ-client-alert1').textContent = '';
    })
    .finally(() => {
        // Re-enable button
        btn.disabled = false;
        btn.textContent = originalBtnText;
    });
}
// Add real-time validation for better UX
document.addEventListener('DOMContentLoaded', function() {
    const inputs = document.querySelectorAll('#enq_form input, #enq_form textarea');
    inputs.forEach(input => {
        input.addEventListener('blur', function() {
            validateField(this);
        });
        
        input.addEventListener('input', function() {
            const fieldName = this.name;
            const errorId = `e_${fieldName}_Err1`;
            const errorElement = document.getElementById(errorId);
            if (errorElement) {
                errorElement.textContent = '';
            }
        });
    });
});

// Validate individual field
function validateField(field) {
    const fieldName = field.name;
    const fieldValue = field.value.trim();
    const errorId = `e_${fieldName}_Err1`;
    const errorElement = document.getElementById(errorId);
    
    if (!errorElement) return;
    
    errorElement.textContent = '';
    
    switch(fieldName) {
        case 'name':
            if (!fieldValue) {
                errorElement.textContent = 'Name is required';
            } else if (fieldValue.length < 2) {
                errorElement.textContent = 'Name must be at least 2 characters';
            }
            break;
            
        case 'company':
            if (!fieldValue) {
                errorElement.textContent = 'Company is required';
            }
            break;
            
        case 'email':
            const emailRegex = /^[^\s@]+@[^\s@]+\.[^\s@]+$/;
            if (!fieldValue) {
                errorElement.textContent = 'Email is required';
            } else if (!emailRegex.test(fieldValue)) {
                errorElement.textContent = 'Please enter a valid email address';
            }
            break;
            
        case 'mobile':
            if (!fieldValue) {
                errorElement.textContent = 'Mobile number is required';
            } else if (phoneInputInstance && !phoneInputInstance.isValidNumber()) {
                const countryData = phoneInputInstance.getSelectedCountryData();
                errorElement.textContent = `Please enter a valid ${countryData.name} mobile number`;
            }
            break;
            
        case 'country':
            if (!fieldValue) {
                errorElement.textContent = 'Country is required';
            }
            break;
            
        case 'pincode':
            if (!fieldValue) {
                errorElement.textContent = 'Pin Code/Zip Code is required';
            } else if (fieldValue.length < 3) {
                errorElement.textContent = 'Pin Code must be at least 3 characters';
            }
            break;
            
        case 'product':
            if (fieldValue && fieldValue.length < 2) {
                errorElement.textContent = 'Product must be at least 2 characters';
            }
            break;
            
        case 'message':
            if (fieldValue && fieldValue.length < 10) {
                errorElement.textContent = 'Message must be at least 10 characters';
            }
            break;
    }
}
</script>

<script src="https://www.google.com/recaptcha/api.js" async defer></script>