PHP_SMART_HOME_V3/test.php

<pre>
	<?php
	var_dump($_POST);
	?>
</pre>

<form class="" action="" method="post">
	<label for="operator">Typ podmínky</label>
	<select class="" name="operator">
		<option value="or">OR</option>
		<option value="and">AND</option>
	</select>
	<div class="variableArea">

		<button name="addButton" id="addButton">+</button>
	</div>
	<br>

	<label for="resetOperator">Typ podmínky</label>
	<select class="" name="resetOperator">
		<option value="or">OR</option>
		<option value="and">AND</option>
	</select>
	<div class="resetvariableArea">

		<button name="restartaAddButton" id="restartAddButton">+</button>
	</div>
	<br>

	<button type="submit" name="button">Odeslat</button>

</form>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.4.1/jquery.min.js"></script>
<script type="text/javascript">
function foo(element){
	var id = element.attr("name").match(/\d+/)[0]
	$("[name='variable["+id+"][value]']").remove();
	$("[name='variable["+id+"][equaler]']").remove();

	if (element.val() == "atDeviceValue") {
		var arrVarOperator = [
			{val : '>', text: '>'},
			{val : '<', text: '<'},
		];

		var varOperator = $('<select name="variable['+id+'][equaler]">');
		$(arrVarOperator).each(function() {
			varOperator.append($('<option>').attr('value',this.val).text(this.text));
		});
		element.parent().append(varOperator);


		var input = $("<input/>");
		input.attr("type","text");
		input.attr("name","variable["+id+"][value]");
		element.parent().append(input);
	} else if (element.val() == "time") {
		var arrVarOperator = [
			{val : '>', text: '>'},
			{val : '<', text: '<'},
		];

		var varOperator = $('<select name="variable['+id+'][equaler]">');
		$(arrVarOperator).each(function() {
			varOperator.append($('<option>').attr('value',this.val).text(this.text));
		});
		element.parent().append(varOperator);

		var input = $("<input/>");
		input.attr("type","time");
		input.attr("name","variable["+id+"][value]");
		element.parent().append(input);
	}else {
		var arrVarOperator = [
			{val : '=', text: '=='},
			{val : '!=', text: '!='},
		];

		var varOperator = $('<select name="variable['+id+'][equaler]">');
		$(arrVarOperator).each(function() {
			varOperator.append($('<option>').attr('value',this.val).text(this.text));
		});
		element.parent().append(varOperator);

		var arrVarValue = [
			{val : 'true', text: 'True'},
			{val : 'false', text: 'False'},
		];

		var varValue = $('<select name="variable['+id+'][value]">');
		$(arrVarValue).each(function() {
			varValue.append($('<option>').attr('value',this.val).text(this.text));
		});
		element.parent().append(varValue);
	}
}
$("#addButton,#restartAddButton").click( function (event) {
	event.preventDefault();
	var numItems = $('.var').length
	var arrVarSelect = [
		{val : 'sunSet', text: 'Západ Slunce'},
		{val : 'sunRise', text: 'Východ Slunce'},
		{val : 'inHome', text: 'Příchod'},
		{val : 'outHome', text: 'Odchod'},
		{val : 'time', text: 'Čas'},
		{val : 'atDeviceValue', text: 'Při hodnotě zařízení'},
		{val : 'sunRise', text: 'Východ Slunce'},
		{val : 'noOneHome', text: 'Nikdo Doma'},
		{val : 'someOneHome', text: 'Nekdo Doma'},
	];

	var varSelect = $('<select name="variable['+numItems+'][what]">');
	$(arrVarSelect).each(function() {
		varSelect.append($('<option>').attr('value',this.val).text(this.text));
	});
	varSelect.attr("onchange", "foo($(this))");

	/*onchange = function(e) {
	console.log(this.value);
	if (this.value == 'atDeviceValue') {
	alert("ok");
}
};*/

var arrVarOperator = [
	{val : '>', text: '>'},
	{val : '<', text: '<'},
	{val : '=', text: '=='},
	{val : '!=', text: '!='},
];

var varOperator = $('<select name="variable['+numItems+'][equaler]">');
$(arrVarOperator).each(function() {
	varOperator.append($('<option>').attr('value',this.val).text(this.text));
});

var arrVarValue = [
	{val : 'true', text: 'True'},
	{val : 'false', text: 'False'},
];

var varValue = $('<select name="variable['+numItems+'][value]">');
$(arrVarValue).each(function() {
	varValue.append($('<option>').attr('value',this.val).text(this.text));
});

var newDiv = $("<div class=var>").append(varSelect);
newDiv = newDiv.append(varOperator);
newDiv = newDiv.append(varValue);
$(this).parent().append(newDiv);

});

/*var arrVarSelect = [
{val : 'sunSet', text: 'Západ Slunce'},
{val : 'sunRise', text: 'Východ Slunce'},
{val : 'inHome', text: 'Příchod'},
{val : 'outHome', text: 'Odchod'},
{val : 'time', text: 'Čas'},
{val : 'atDeviceValue', text: 'Při hodnotě zařízení'},
{val : 'sunRise', text: 'Východ Slunce'},
{val : 'noOneHome', text: 'Nikdo Doma'},
{val : 'someOneHome', text: 'Nekdo Doma'},
];

var varSelect = $('<select name="variable['+numItems+'][]">');
$(arrVarSelect).each(function() {
varSelect.append($('<option>').attr('value',this.val).text(this.text));
});

var arrVarOperator = [
{val : '>', text: '>'},
{val : '<', text: '<'},
{val : '=', text: '=='},
{val : '!=', text: '!='},
];

var varOperator = $('<select name="variable['+numItems+'][]">');
$(arrVarOperator).each(function() {
varOperator.append($('<option>').attr('value',this.val).text(this.text));
});

var arrVarValue = [
{val : 'true', text: 'True'},
{val : 'false', text: 'False'},
];

var varValue = $('<select name="variable['+numItems+'][]">');
$(arrVarValue).each(function() {
varValue.append($('<option>').attr('value',this.val).text(this.text));
});

//TODO změna výstupní proměné na základě vstupu date,num etc
var newDiv = $("<div class=var>").append(varSelect);/*.change(
function (subEvent) {
alert(subEvent);
}
);*/
/*newDiv = newDiv.append(varOperator);
newDiv = newDiv.append(varValue);
$(".restartaAddButton")append(newDiv);*/


/*
var arrVarSelect = [
{val : 'sunSet', text: 'Západ Slunce'},
{val : 'sunRise', text: 'Východ Slunce'},
{val : 'inHome', text: 'Příchod'},
{val : 'outHome', text: 'Odchod'},
{val : 'time', text: 'Čas'},
{val : 'atDeviceValue', text: 'Při hodnotě zařízení'},
{val : 'sunRise', text: 'Východ Slunce'},
{val : 'noOneHome', text: 'Nikdo Doma'},
{val : 'someOneHome', text: 'Nekdo Doma'},
];

var varSelect = $('<select name="variable['+numItems+'][]">');
$(arrVarSelect).each(function() {
varSelect.append($('<option>').attr('value',this.val).text(this.text));
});

var arrVarOperator = [
{val : '>', text: '>'},
{val : '<', text: '<'},
{val : '=', text: '=='},
{val : '!=', text: '!='},
];

var varOperator = $('<select name="variable['+numItems+'][]">');
$(arrVarOperator).each(function() {
varOperator.append($('<option>').attr('value',this.val).text(this.text));
});

var arrVarValue = [
{val : 'true', text: 'True'},
{val : 'false', text: 'False'},
];

var varValue = $('<select name="variable['+numItems+'][]">');
$(arrVarValue).each(function() {
varValue.append($('<option>').attr('value',this.val).text(this.text));
});

//TODO změna výstupní proměné na základě vstupu date,num etc
var newDiv = $("<div class=var>").append(varSelect);/*.change(
function (subEvent) {
alert(subEvent);
}
);*/
/*	newDiv = newDiv.append(varOperator);
newDiv = newDiv.append(varValue);
$(".variableArea").parent().append(newDiv);*/

</script>