0

I'm new to wordpress and I am having a problem with ajax while submitting form. Form is submited fine, data is inserted in table, but ajax is calling an error function. This is my form

<form action="#" method="post" id="order-form" novalidate>
                <label for="name"><?php echo __('Ime i prezime', 'mojaobuca'); ?></label>
                <input type="text" name="name" id="name" class="required" placeholder="<?php echo __('Unesite Vaše ime i prezime', 'mojaobuca'); ?>">
                <label for="email"><?php echo __('Vaša email adresa', 'mojaobuca'); ?></label>
                <input type="email" name="email" id="email" class="required" placeholder="<?php echo __('Unesite Vašu email adresu', 'mojaobuca'); ?>">
                <label for="address"><?php echo __('Vaša adresa', 'mojaobuca'); ?></label>
                <input type="text" name="address" id="address" class="required" placeholder="<?php echo __('Unesite Vašu adresu', 'mojaobuca'); ?>">
                <label for="city"><?php echo __('Vaš grad', 'mojaobuca'); ?></label>
                <input type="text" name="city" id="city" class="required" placeholder="<?php echo __('Unesite Vaš grad', 'mojaobuca'); ?>">
                <label for="phone"><?php echo __('Vaš telefon', 'mojaobuca'); ?></label>
                <input type="text" name="phone" id="phone" class="required" placeholder="<?php echo __('Unesite Vaš telefon', 'mojaobuca'); ?>">
                <label for="shoe-num"><?php echo __('Broj obuće', 'mojaobuca'); ?></label>
                <input type="text" name="shoe_num" id="shoe_num" class="required" placeholder="<?php echo __('Unesite broj obuće', 'mojaobuca'); ?>">
                <label for="color"><?php echo __('Boja obuće', 'mojaobuca'); ?></label>
                <input type="text" name="color" id="color" class="required" placeholder="<?php echo __('Unesite boju obuće', 'mojaobuca'); ?>">
                <input type="hidden" id="product_id" name="product_id" value="<?php echo get_field('obuca_code'); ?>">
                <?php if(!get_field('obuca_discount')): ?>
                    <input type="hidden" id="shoe_price" name="shoe_price" value="<?php echo get_field('obuca_price'); ?>">
                <?php else: ?>
                    <input type="hidden" id="shoe_price" name="shoe_price" value="<?php echo get_field('obuca_discount'); ?>">
                <?php endif; ?>
                <div class="g-recaptcha" data-sitekey="#"></div>
                <a href="#"
                   name="order-shoe"
                   class="secondary push-down"
                   id="order"
                   ><?php echo __('Poruči', 'mojaobuca') ?></a>
            </form>

This is where I registered ajax in functions.php

wp_register_script( 'ajaxscript', get_template_directory_uri() . '/js/ajax-script.js', array('jquery') );
wp_localize_script( 'ajaxscript', 'myAjax', array( 'ajaxurl' => admin_url( 'admin-ajax.php' )));

This is my function for inserting data

function mojaobuca_save_order() {
global $wpdb;
$result = '';

header('Content-Type: application/json');
$name = sanitize_text_field($_REQUEST['name']);
$email = sanitize_email($_REQUEST['email']);
$address = sanitize_text_field($_REQUEST['address']);
$city = sanitize_text_field($_REQUEST['city']);
$phone = sanitize_text_field($_REQUEST['phone']);
$shoe_num = sanitize_text_field($_REQUEST['shoe-num']);
$color = sanitize_text_field($_REQUEST['color']);
$product_id = sanitize_text_field($_REQUEST['product_id']);
$price = sanitize_text_field($_REQUEST['shoe_price']);
$date = date('YYYY-MM-DD HH:MM:SS');
$table = $wpdb->prefix . 'orders';

$captcha = $_POST["response"];

$secretKey = '6LdZ0jMUAAAAAO_rRNXsHrlH2O9oPh4rHkqwkKLE';
$url = "https://www.google.com/recaptcha/api/siteverify?secret=" . $secretKey . "&response=" . $captcha;
$response = json_decode(file_get_contents($url), true);

if(!$captcha){
    var_dump('captcha ne valja');
    echo 'grecap error';
}
if($response['success'] == false) {
    var_dump('error');
    echo 'error';
} else {
    var_dump('priprema a upis');
    $data = array(
        'name' => $name,
        'email' => $email,
        'address' => $address,
        'city' => $city,
        'phone' => $phone,
        'number' => $shoe_num,
        'color' => $color,
        'product_id' => $product_id,
        'price' => $price,
        'date' => $date
    );

    $format = array('%s', '%s', '%s', '%s', '%s', '%s', '%s', '%s', '%s', '%s');

    $wpdb->insert($table, $data, $format);
    $result = 'success';
}
echo $result;
wp_die();

} add_action('wp_ajax_nopriv_mojaobuca_save_order', 'mojaobuca_save_order'); add_action('wp_ajax_mojaobuca_save_order', 'mojaobuca_save_order');

And this is my ajax

$(document).ready(function(){
$('#order').on('click', function(e){
    e.preventDefault();
    $('#order-form').validate();
    var name = $('input#name').val();
    var email = $('input#email').val();
    var address = $('input#address').val();
    var city = $('input#city').val();
    var phone = $('input#phone').val();
    var shoeNum = $('input#shoe-num').val();
    var color = $('input#color').val();
    var shoe_price = $('input#shoe_price').val();
    var product_id = $('input#product_id').val();
    var grecap = $('#g-recaptcha-response').val();
    var response = grecaptcha.getResponse();
    $.ajax({
        type: 'post',
        url : myAjax.ajaxurl,
        async: false,
        data: {
            name : name,
            email : email,
            address : address,
            city : city,
            phone : phone,
            shoeNum : shoeNum,
            color : color,
            response : response,
            shoe_price: shoe_price,
            product_id: product_id,
            action: "mojaobuca_save_order"
        },
        dataType: 'json',
        success: function(response) {

            $('div.success-msg').show();
            $('#order-form').hide();
            $('#order-form').resetForm();

        },
        error: function(response) {
            alert('error');
            $('div.error-msg').show();
            $('#order-form').hide();
            $('#order-form').resetForm();
        }
    });
});
-1

Solved. Works fine without dataType: json in ajax-script.js and header('Content-Type: application/json'); in php file

1
  • This is not answered! Please send a comment. Oct 14 '17 at 12:57

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service, privacy policy and cookie policy

Not the answer you're looking for? Browse other questions tagged or ask your own question.