[英]Ajax form in response of ajax Call
我有一個問題:
我讓AJAX查詢數據庫,並顯示有關特定ID,並顯示在HTML格式的郵件返回信息。
這是HTML代碼:
<!-- WINE -->
<div id="slides">
<div id="information_slide" class="slide">
<!-- container as a result of JS -->
</div>
</div>
<!-- WINE -->
<!-- LOADING -->
<div id="loading_slide" class="slide" style="display: none;">
Loading information about the wine ...<br/><br/><img src="images/ajax-loader.gif" />
</div>
<!-- LOADING -->
<!-- AJAX CALL BUTTON -->
<?php
echo '<div id="'.$id['id'].'" class="menuItem">Show wine when ID = '.$id['id'].'</div>';
?>
<!-- AJAX CALL BUTTON -->
這是JS代碼:
[JavaScript的]
$('.menuItem').on('click', function() {
// ID Wine
var id = $(this).attr('id');
$.ajax({
url: 'function.php',
beforeSend: function () {
$('#slides #information_slide').fadeOut(200, function() {
$('#slides #loading_slide').fadeIn(200);
});
},
data: {
funkcja: 'show_wine',
id: id
},
type: 'post',
success: function(result) {
setTimeout(function() {
$('#slides #loading_slide').fadeOut(200, function() {
$('#slides #information_slide').html(result).fadeIn(400);
});
}, 500);
}
});
// alert(id);
});
[/ JavaScript]
以下是PHP代碼:
[php]
<?php
if(isset($_POST['funkcja']) && !empty($_POST['funkcja'])) {
switch($_POST['funkcja']) {
case 'show_wine':
show_wine($_POST['id']);
break;
}
}
// Callback wine function
function show_wine($id) {
$qwerty = "SELECT * FROM `wina` WHERE id='".$id."' LIMIT 1";
$sql = mysql_query($qwerty);
while($id = mysql_fetch_assoc($sql)) {
echo '
<div id="'.$id['id'].'" class="element">
<form method="post" action="" class="jcart">
<fieldset>
<input type="hidden" name="jcartToken" value="'.$_SESSION['jcartToken'].'" />
<input type="hidden" name="my-item-id" value="'.$id['id'].'" />
<input type="hidden" name="my-item-name" value="'.stripslashes($id['nazwa']).'" />
<input type="hidden" name="my-item-price" value="'.stripslashes($cena_przecinek).'" />
<input type="hidden" name="my-item-url" value="" />
<input type="hidden" name="my-item-qty" value="1" size="3" class="item-sztuk" />
<input type="submit" name="my-add-button" value="to cart" class="item-button" />
</fieldset>
</form>
<!-- ... remaining HTML code... -->
</div>
';
}
}
?>
[/ php]
我有如上所述的結果。 該腳本顯示了我的信息(記錄)從數據庫中一個特定的ID - 腳本的這部分確定。
我目前在PHP回調函數(稱為Ajax)托管表單時遇到的問題也使用Ajax函數。 的HTML代碼從PHP函數響應這部分...
<form method="post" action="" class="jcart">
<fieldset>
<input type="hidden" name="jcartToken" value="'.$_SESSION['jcartToken'].'" />
<input type="hidden" name="my-item-id" value="'.$id['id'].'" />
<input type="hidden" name="my-item-name" value="'.stripslashes($id['nazwa']).'" />
<input type="hidden" name="my-item-price" value="'.stripslashes($cena_przecinek).'" />
<input type="hidden" name="my-item-url" value="" />
<input type="hidden" name="my-item-qty" value="1" size="3" class="item-sztuk" />
<input type="submit" name="my-add-button" value="to cart" class="item-button" />
</fieldset>
</form>
...是我jCart腳本的形式。 按鈕(名稱=我加鍵)無法正常工作。
JS腳本是從網頁上一開始加載:
[HTML]
<head>
<script type="text/javascript" language="javascript" src="files/jcart.js"></script>
</head>
[/ html]
當我調用AJAX功能,加載結果(HTML代碼)的容器和按鈕,應該添加項目到購物車,頁面重新加載和項目僅被添加到購物車。 我已經嘗試添加返回FALSE; 在PHP腳本,但如果恰好是絕對沒有。
這是JS代碼文件jcart-> www.starwines.com.pl/jcart/js/jcart.js
這里是DEMO PAGE - > www.starwines.com.pl/test.php
請嘗試以下操作:* 1)*通過點擊“Dodaj做koszyka”(黃色按鈕)2)選擇從傳送帶上不同的酒,然后單擊添加項目“Dodaj做koszyka”
如何解決這個問題呢?
問候 !
PS。 對不起,英語,我很虛弱:)
從更改您的點擊事件綁定代碼
$('.jcart').submit(function(e) {
add($(this));
e.preventDefault();
});
至
$(document).on('submit', '.jcart', function(e) {
add($(this));
e.preventDefault();
});
會做的工作。
聲明:本站的技術帖子網頁,遵循CC BY-SA 4.0協議,如果您需要轉載,請注明本站網址或者原文地址。任何問題請咨詢:yoyou2525@163.com.