在woocommerce中添加动态字段

时间:2015-08-03 13:00:21

标签: forms woocommerce field

我尝试在woocommerce结算表单上添加一个输入。我想使用Ajax来呈现它的动态。

它是这样的:

  • 一个选择输入,例如:

选择1

选择2

即,当选择“选择1”时,带有无线电框的另一个列表会出现与前一个菜单相关的选项。

该功能在没有wordpress的情况下完美运行,但是当我们在WP上添加它时,它不起作用。该功能重复且无法正常工作

我使用require_once();

将它添加到function.php中的wp中

你能帮我们做这件事。

非常感谢

Le Conseil Informatique

1 个答案:

答案 0 :(得分:0)

我的功能就像这样(form_livraison.php):

<script type='text/javascript'>
 
			function getXhr(){
                                var xhr = null; 
				if(window.XMLHttpRequest) // Firefox et autres
				   xhr = new XMLHttpRequest(); 
				else if(window.ActiveXObject){ // Internet Explorer 
				   try {
			                xhr = new ActiveXObject("Msxml2.XMLHTTP");
			            } catch (e) {
			                xhr = new ActiveXObject("Microsoft.XMLHTTP");
			            }
				}
				else { // XMLHttpRequest non supporté par le navigateur 
				   alert("Votre navigateur ne supporte pas les objets XMLHTTPRequest..."); 
				   xhr = false; 
				} 
                                return xhr;
			}
 
			/**
			* Méthode qui sera appelée sur le click du bouton
			*/
			function go(){
				var xhr = getXhr();
				// On défini ce qu'on va faire quand on aura la réponse
				xhr.onreadystatechange = function(){
					// On ne fait quelque chose que si on a tout reçu et que le serveur est ok
					if(xhr.readyState == 4 && xhr.status == 200){
						leselect = xhr.responseText;
						// On se sert de innerHTML pour rajouter les options a la liste
						document.getElementById('horaires').innerHTML = leselect;
					}
				}
 
				// Ici on va voir comment faire du post
				xhr.open("POST",'http://XX/ajax_livraison.php',true);
				// ne pas oublier ça pour le post
				xhr.setRequestHeader('Content-Type','application/x-www-form-urlencoded');
				// ne pas oublier de poster les arguments
				// ici, l'id du site
				sel = document.getElementById('site');
				idsite = sel.options[sel.selectedIndex].value;
				xhr.send("idSite="+idsite);
			}
		</script>

				<label>Lieux du retrait :</label>
				<select name='site' id='site' onchange='go()'>
					<option value='-1'>Aucun</option>
					<?php
						$bdd = new PDO('mysql:host=XX', 'XX', 'XX'); //Connexion à la base
						$req = $bdd->query('SELECT * FROM site ORDER BY ville');//Récupération des informations

						while($row = $req->fetch()){
							echo "<option value='".$row["id"]."'>".$row["ville"]."</option>";
						}
					?>
				</select>
				<div id='horaires'>
					Horaires :<br/>
				</div>

这个人打电话给这个页面(ajax_livraison.php)

<?php
	setlocale (LC_TIME, 'fr_FR.utf8','fra'); //Mise en français de la date
	echo "Horaires : <br/> Nous sommes le ".(strftime("%A %d %B"))."<br/>"; //Affichage de la date
	$num_jour = date("N"); //Récupération du numéro du jour (Lundi 1 -> Dimanche 7)

	if(isset($_POST["idSite"])){ //si un élément est sélectionné... 
		$bdd = new PDO('mysql:host=XX', 'XX', 'XX'); //Connexion à la base
		//mysql_select_db("test");
		//$res = mysql_query("SELECT * FROM horaires WHERE idSite=".$_POST["idSite"]); //Récupération des informations
		$req = $bdd->prepare('SELECT * FROM horaires WHERE idSite = ?');
		$req->execute(array($_POST['idSite']));

		$resultfinal = array(); //Création d'un tableau
		
		while($row = $req->fetch()){ //Boucle tant qu'il y a des résultats

			$inter_jour = $num_jour - $row['id_jour']; //Calcul de l'intervalle entre le jour J et le jour de livraison

			if ($inter_jour>=0){ //Si intervalle de livraison supérieur ou égale à 0
				$compte_jour = date('d')+(7-$inter_jour); //Calcul jour livraison
			}

			else{
				$compte_jour = date('d')-$inter_jour; //Sinon idem avant
			}

			$date_livraison = strftime("%A %d %B",mktime(0,0,0,date('m'),$compte_jour,date('Y'))); //Récupération de la date de livraison suite au calcul

			$num_livraison = strftime("%d", mktime(0,0,0,date('m'),$compte_jour,date('Y'))); //Récupération numéro livraison suite au calcul

			if((($num_jour+1) == $row["id_jour"]) && $row['idSite']==1){ //Si livraison = J+1 et site de livraison == Massy
				$write = "<input type='radio' name='heures' id='".$row["id"]."' value='".$row["id"]."' checked><label for='".$row["id"]."'> ".$date_livraison." 16h00 - 20h00</label><br/>";
			}

			else{
				$write = "<input type='radio' name='heures' id='".$row["id"]."' value='".$row["id"]."'><label for='".$row["id"]."'> ".$date_livraison." ".$row["am"]." ".$row["pm"]."</label><br/>";
			}

			$resultfinal[$num_livraison] = $write; //Ajout de la ligne en fin de tableau

		}

		ksort($resultfinal); //Trie du tableau par la clé

		foreach ($resultfinal as $key => $value) { //Pour chaque ligne du tableau...
			echo $value; //afficher le contenu
		}

	}
?>

所以在wordpress的function.php中我用require_once(form_livraison.php)调用它;

add_action( 'woocommerce_checkout_fields' , 'custom_store_pickup_field');
 
function custom_store_pickup_field($fields) {
    require_once("form_livraison.php");
}

我希望你理解我的功能^^

感谢您的帮助