Почему не отправляется форма JSON AJAX?

Question

[Денис Вяземский]

Почему при извлечении данных и JSON не отправляется форма?
=======================================================

setInterval(function()  
        {
	SimpleBasket.getData(function(data){ 
	
	var html = [];
	html += '<form id="zk-basketForm" class="basketForm" action="/cart/" method="post">' + '<input type="hidden" name="mode" value="update">' + '<table class="dhunbusket" cellpadding="5" id="cartrestid">';
	

for( var key in data.items) {
    var item = data.items[key]
	var summa = item.SIMPLE_BASKET_QUO * item.SIMPLE_BASKET_PRICE;

	   html += '<tr data-product-id="' + key + '">';
        //console.log('  ' + key2, item2)
		html += '<td class="namebusket">' + item.SIMPLE_BASKET_TITLE + '</td>';
		html += '<td class="quooo" data-value="' + item.SIMPLE_BASKET_QUO + '" data-id="' + key + '">' + item.SIMPLE_BASKET_QUO + ' шт.</td>'
		html += '<td class="summ summbusket" data-value="' + item.SIMPLE_BASKET_PRICE + '">' + summa + ' Р</td>'
		html += '<td class="quo" id="zkzk" data-value="' + item.SIMPLE_BASKET_QUO + '" data-id="' + key + '"><div class="cdid"><input class="spinner" type="hidden" name="update_' + key + '" value="' + item.SIMPLE_BASKET_QUO + '" /></div><a class="zk-del didbut" href="javascript:void(0);"></a></td>'
		html += '</tr>';
    //}

}
html += '</form></table>';
	$("#reloadcart").html(html)
	
	});	

}, 1000);

======================================================================
Хотел узнать почему не отправляется форма при клике на ссылку удалить товар из корзины
=======================================================================
Сам код который обрабатывает нажатие на кнопку
=======================================================================

$('.zk-del').click(function(e){
e.preventDefault();
$(this).prev().find('input:first').val(0);
recost();
$('#zk-basketForm').submit();
});

function recost() {
var q = 0;
var p = 0;
$('#zk-basketForm table tr').each(function(){
var quo = $(this).find('td.quo span input:first').val();
var cos = $(this).find('td.price').data('value');
if (quo != undefined) {
q = q + (quo*1);
p = p + cos*quo;
}
});
var res = q + ' товаров | ' + p + ' руб.';
createCookie("__zk_cart_summury__", res, 1);
}

================================================================
Почему форма не обрабатывается? Как сделать чтобы при нажатии в строчке товара кнопку, отправлялась форма?

Comments

[Stalker_RED]

Я вообще не вижу в вашем примере отправку формы.
Что такое SimpleBasket.getData()?
И зачем setInterval? Корзина пересоздается каждую секунду?

[Денис Вяземский]

Stalker_RED: да, потому что кнопки добавления товара в корзину работают на ajax, а корзина с товарами выводится в правом блоке! Поэтому пришлось присвоить setInterval!

$('.simple-basket-buy-now').click(function(e){
        e.preventDefault();
        var p1 = $('<p/>');                                                      
        var p2 = $('<p/>');
        var p3 = $('<p/>');
        if ($(this).parent().parent().children().length == 6) {
            var img = $(this).parent().prev().prev().prev().find('img:first').clone();
            var price = $(this).parent().prev().prev().prev().prev().find('p:first').html();
            var deskr = $(this).parent().prev().prev().prev().prev().prev().find('a:first').text();
        } else {
            var img = $('#medium-photo').find('img:first').clone();
            var w = img.width() / 2;
            var h = img.height() / 2;
            img.width(w);
            img.height(h);
            var price = $(this).parent().parent().prev().find('td:first').text();
            var deskr = $('#post-single').find('h1:first').text();
        }
        p1.append(img);
        p2.append(price);
        p3.append(deskr);
        $('#zk-modal-content').html('').append(p1).append(p2).append(p3);
        //$('#basketModal').reveal();
        var link = $(this).attr('href');
        $.get(link, {}, function(response){
            var str = response.split('|_|_|_|_|_|_|');
            var res = str[1];
            createCookie("__zk_cart_summury__", res, 1);
            $('#zk-cart-summury').text(res);
        });
    });

[Stalker_RED]

Денис Вяземский: Хитро как закручено. Тут без поллитры не разберешься.

[Денис Вяземский]

Stalker_RED: ВОТ ajax-api.php

<?php
/**
 * AJAX API корзины
 */

$simpeBasketAPI = new SimpleBasketAPI();


class SimpleBasketAPI
{
	/**
	 * Корзина
	 * @var SimpleBasketOrder
	 */
	 private $basket;	



	/**
	 * Конструктор класса
	 */
	public function __construct()
	{
		if ( is_admin() ) 
		{
			add_action( 'wp_ajax_nopriv_getTime', array( &$this, 'getTime'));
			add_action( 'wp_ajax_getTime', array( &$this, 'getTime'));

			add_action( 'wp_ajax_nopriv_getData', array( &$this, 'getData'));
			add_action( 'wp_ajax_getData', array( &$this, 'getData'));

			add_action( 'wp_ajax_nopriv_add', array( &$this, 'add'));
			add_action( 'wp_ajax_add', array( &$this, 'add'));



		}
		add_action( 'init', array( &$this, 'init' ) );


		$this->basket = SimpleBasketOrder::create();
	}

	/**
	 * Функция инициализации AJAX
	 */
	public function init()
	{
		wp_enqueue_script('simple-basket', plugin_dir_url( __FILE__ ) . 'js/simple-basket.js', array( 'jquery' ) );
		wp_localize_script('simple-basket', 'SimpleBasket', array(
		    'ajaxurl' => admin_url( 'admin-ajax.php' ),
		    'nonce' => wp_create_nonce( 'ajax-example-nonce' )
		) );
	}

	/**
	 * Функция проверки токена
	 */
	public function validateNonce()
	{
		if ( ! isset( $_REQUEST['nonce'] ) || ! wp_verify_nonce( $_REQUEST['nonce'], 'ajax-example-nonce' ) )
			die ( 'Invalid Nonce' );
	}

	/**
	 * Функция ответа
	 */
	public function responce($result)
	{
		header('Content-Type: application/json');
		echo json_encode($result);
		exit;
	}
	
	public function clear()
	 {
		 $this->validateNonce();
		 $this->responce($this->basket);
		 $this->items = array();
		 $this->userComment = '';
	 }
	
	/* --------------------- AJAX методы ---------------------- */
	public function getTime()
	{
		$this->validateNonce();
		$this->responce(array(
			'time' => date('d.m.Y H:i:s')
		));
	}

	// Возврат корзины
	public function getData()
	{
		$this->validateNonce();
		$this->responce($this->basket);
	}

	// Добавление товара в корзину
	public function add()
	{
		$this->validateNonce();
		if (!isset($_REQUEST['id']))
			die ( 'ID not specified' );

			// Код товара
			$id = (int) $_REQUEST['id'];
			$product = get_post($id);
			$title = $product->post_title;
			// Цена
			$price = simple_basket_custom_fields($id, get_option('simple_basket_catalog_price'));
			// Вычисляем категорию по таксономии 
			$category = '';
			// Тип записи каталога товара
			$postType = $product->post_type;
			// Таксономии записи
			$taxonomies = get_object_taxonomies($postType);
			// Ищем таксономию, которая не тег
			foreach ($taxonomies as $taxonomy)
			{
				if (strpos($taxonomy, 'tag') !== FALSE) continue;
				// Берем элементы этой таксономии
				$categories = get_the_terms($id, $taxonomy);
				$category = (count($categories) > 0) ? $categories[0]->name : '';
				// Следующие таксономии не рассматриваем
				break;
			}
			
			// Добавляем в корзину
			if (!empty($title)) $this->basket->add($id, $title, $price, $category);
		$this->responce($this->basket);
	}
}

[Денис Вяземский]

Stalker_RED: Вот JS API Корзины

/**
 * JS API корзины
 */

jQuery(function ($)
{

	// Демо-метод вывода времени с сервера
	SimpleBasket.getTime = function (callback)
	{
		jQuery.ajax({
			url: SimpleBasket.ajaxurl,
			type: 'POST',
			data: ({
				action: 'getTime',
				nonce: SimpleBasket.nonce
			}),
			success: function (data)
			{
				$('#reloadcart').attr(data);
				if (callback) callback(data);
			}
		});
	}

	// Метод выводит содержимое корзины
	SimpleBasket.getData = function (callback)
	{
		jQuery.ajax({
			url: SimpleBasket.ajaxurl,
			type: 'POST',
			cache: false,
			data: ({
				action: 'getData',
				nonce: SimpleBasket.nonce
			}),
			success: function (data)
			{
				if (callback) callback(data);
			}
		});
	}
 


	// Метод добавляет товар в корзину
	SimpleBasket.add = function (id, callback)
	{
		if (!id) return;
		jQuery.ajax({
			url: SimpleBasket.ajaxurl,
			type: 'POST',
			data: ({
				action: 'add',
				nonce: SimpleBasket.nonce,
				'id': id 
			}),
			success: function (data)
			{
				console.log(data);
				if (callback) callback(data);
			}
		});
	}
	
setInterval(function()  
        {
	SimpleBasket.getData(function(data){ 
	
	var html = [];
	html += '<form id="zk-basketFormm" class="basketForm" action="" method="post">' + '<input type="hidden" name="mode" value="update">' + '<table class="dhunbusket" cellpadding="5" id="cartrestid">';
	

for( var key in data.items) {
    var item = data.items[key]
	var summa = item.SIMPLE_BASKET_QUO * item.SIMPLE_BASKET_PRICE;

	   html += '<tr data-product-id="' + key + '">';
        //console.log('  ' + key2, item2)
		html += '<td class="namebusket">' + item.SIMPLE_BASKET_TITLE + '</td>';
		html += '<td class="quooo" data-value="' + item.SIMPLE_BASKET_QUO + '" data-id="' + key + '">' + item.SIMPLE_BASKET_QUO + ' шт.</td>'
		html += '<td class="summ summbusket" data-value="' + item.SIMPLE_BASKET_PRICE + '">' + summa + ' Р</td>'
		html += '<td class="quo" id="zkzk" data-value="' + item.SIMPLE_BASKET_QUO + '" data-id="' + key + '"><div class="cdid"><input class="spinner" type="hidden" name="update_' + key + '" value="' + item.SIMPLE_BASKET_QUO + '" /></div><a class="zk-del' + key + ' didbut" href="javascript:void(0);"></a></td>'
		html += '</tr>';

}
html += '</form></table>';
	$("#reloadcart").html(html)	
	});	
}, 1000);



});

[Денис Вяземский]

Stalker_RED: А это действия для кнопок, добавление, удаление и т.д.

(function($){

$(function() {
    
    $( ".spinner" ).spinner( {
        min: 0,
        max: 2500
    });
    
    var cres = readCookie("__zk_cart_summury__")
    if ( cres ) {
        $('#zk-cart-summury').text(cres);
    }
    
    $('.simple-basket-buy-now').click(function(e){
        e.preventDefault();
        var p1 = $('<p/>');                                                      
        var p2 = $('<p/>');
        var p3 = $('<p/>');
        if ($(this).parent().parent().children().length == 6) {
            var img = $(this).parent().prev().prev().prev().find('img:first').clone();
            var price = $(this).parent().prev().prev().prev().prev().find('p:first').html();
            var deskr = $(this).parent().prev().prev().prev().prev().prev().find('a:first').text();
        } else {
            var img = $('#medium-photo').find('img:first').clone();
            var w = img.width() / 2;
            var h = img.height() / 2;
            img.width(w);
            img.height(h);
            var price = $(this).parent().parent().prev().find('td:first').text();
            var deskr = $('#post-single').find('h1:first').text();
        }
        p1.append(img);
        p2.append(price);
        p3.append(deskr);
        $('#zk-modal-content').html('').append(p1).append(p2).append(p3);
        //$('#basketModal').reveal();
        var link = $(this).attr('href');
        $.get(link, {}, function(response){
            var str = response.split('|_|_|_|_|_|_|');
            var res = str[1];
            createCookie("__zk_cart_summury__", res, 1);
            $('#zk-cart-summury').text(res);
        });
    });
    
    $('.zk-del').click(function(e){
        e.preventDefault();
        $(this).prev().find('input:first').val(0);
        recost();
        $('#zk-basketForm').submit();
    });
    
    $('#zk-update').click(function(e){
        e.preventDefault();
        recost();
        $('#zk-basketForm').submit();
    });
    
    $('#zk-send-order').click(function(e){
        e.preventDefault();
        createCookie("__zk_cart_summury__", '', 1);
        $('#zzzzz').submit();
    });
});

function recost() {
    var q = 0;
    var p = 0;
    $('#zk-basketForm table tr').each(function(){
        var quo = $(this).find('td.quo span input:first').val();
        var cos = $(this).find('td.price').data('value');
        if (quo != undefined) {
            q = q + (quo*1);
            p = p + cos*quo;
        }
    });
    var res = q + ' товаров | ' + p + ' руб.';
    createCookie("__zk_cart_summury__", res, 1);
}

function createCookie(name, value, days) {
    var expires;

    if (days) {
        var date = new Date();
        date.setTime(date.getTime() + (days * 24 * 60 * 60 * 1000));
        expires = "; expires=" + date.toGMTString();
    } else {
        expires = "";
    }
    document.cookie = escape(name) + "=" + escape(value) + expires + "; path=/";
}

function readCookie(name) {
    var nameEQ = escape(name) + "=";
    var ca = document.cookie.split(';');
    for (var i = 0; i < ca.length; i++) {
        var c = ca[i];
        while (c.charAt(0) === ' ') c = c.substring(1, c.length);
        if (c.indexOf(nameEQ) === 0) return unescape(c.substring(nameEQ.length, c.length));
    }
    return null;
}

function eraseCookie(name) {
    createCookie(name, "", -1);
}


	})(jQuery);

Answer 1

[Сергей Сергей]

Здесь кнопка-ссылка отправки формы пересоздается по интервалу, и обработчик слетает. Для прикрепления к такой кнопке обработчика придется писать

$('.zk-del').live('click', function(e) {
/** и так далее */
});

или придумать способ переназначения этого обработчика там же в инетрвале.

Comments

[Денис Вяземский]

Все равно не работает!

[Денис Вяземский]

Форма вообще не реагирует!

[Сергей Сергей]

Денис Вяземский: синтаксические ошибки?

[Денис Вяземский]

Сергей Сергей: нет, просто ничего не происходит, я даже интервал отключил!

[Денис Вяземский]

Сергей Сергей: Сергей, я сейчас на хостинг выложу сможете посмотреть?

[Сергей Сергей]

Денис Вяземский: ну тогда придется делать полный дебаг.
- проверить запуск обработчика ссылкокнопки;
- проверить выборку $('#za-basketForm').length;
- проверить отправку формы по событию .onsubmit;
еще бы поменять местами закрывающие теги формы и таблицы, для порядка.

можно и посмотреть.

[Денис Вяземский]

Сергей Сергей: Вот ссылка dhunters.iqdemo.ru/restoran/kfc/?add=113
Логин и пароль: 1

[Сергей Сергей]

Денис Вяземский: из-за пароля не работает ajax-form.php.
И вообще, ничего не понятно, что должно происходить?

[Денис Вяземский]

Сергей Сергей: попробуйте ввести сначала логин пароль 1, а потом логин: 555 пароль: 666

[Сергей Сергей]

Денис Вяземский: класс zk-del дополняется какими-то числами? так он не привяжется к обработчику.