Как создавать параметр php myqli и перемешивать программирование с jQuery?

Я разрабатываю систему управления о продуктах и печатания продуктов с CMS, но хочу дать ему вышеупомянутое конечное касание системе CMS простая система этикеток.

Это простая система этикеток, разработанная с jQuery каждое слово, отделенное запятой превращается в этикетку. Примеры: php, jquery, и т.д.

Если я добавляю два равных слова, они добавляются без проблемы. Как предотвращать удвоение этикеток?

introducir la descripción de la imagen aquí

Те этикетки производят этот код html.

php
jquery

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

Пример

id   tags
 1    php
 2  jQuery

Для ende так предотвращать ты приклеиваешь этикетку например привет, ajdjj, и т.д.

Формулируя вопрос в SO на английском, как избавления стоимости этикеток вводить данные в основание информации, они дали мне это решение:

var tags = '';
$('#tags > span').each(function() {
    tags = tags + $(this).html() + ',';
});
$('#inputInForm').val(tags);

Может быть, этот вопрос вышел вне темы SO.

Несмотря на то, что знает в php и mysqli осложняют я во время перемешивания программирования с jQuery. Но я грубый в перемешивании php и mysqli с jQuery, не, как использовать это. Они могут помогать мне с простым примером, чтобы завершать эту систему основного tags?

Я не нуждаюсь в полной системе, только нуждаюсь в маленьком примере как использовать это.

$(function(){ // DOM ready

  // ::: TAGS BOX

  $("#tags input").on({
    focusout : function() {
      var txt = this.value.replace(/[^a-z0-9\+\-\.\#]/ig,''); // allowed characters
      if(txt) $("", {text:txt.toLowerCase(), insertBefore:this});
      this.value = "";
    },
    keyup : function(ev) {
      // if: comma|enter (delimit more keyCodes with | pipe)
      if(/(188|13)/.test(ev.which)) $(this).focusout(); 
    }
  });
  $('#tags').on('click', 'span', function() {
    $(this).remove(); 
  });

});
#tags{
  float:left;
  border:1px solid #ccc;
  padding:5px;
  font-family:Arial;
}
#tags > span{
  cursor:pointer;
  display:block;
  float:left;
  color:#fff;
  background:#789;
  padding:5px;
  padding-right:25px;
  margin:4px;
}
#tags > span:hover{
  opacity:0.7;
}
#tags > span:after{
 position:absolute;
 content:"×";
 border:1px solid;
 padding:2px 5px;
 margin-left:3px;
 font-size:11px;
}
#tags > input{
  background:#eee;
  border:0;
  margin:4px;
  padding:7px;
  width:auto;
}


jquery

4
задан 08.09.2016, 03:12
4 ответа

Для твоего случая мне пришло в голову следующее, сначала иметь функцию, которая возьмется за то, чтобы сохранять в глобальном array tags, добавленные пользователем.

function agregar_tags(tag, arrtags){
  var index = -1;
  var resultado = control_tags(tag, arrtags);

  for(var i = 0; i < arrtags.length; i++) {
    if(arrtags[i] === tag) {
      index = i;
    }
  }

  if(index > -1) {
    arrtags[index] = tag;
  }else {
    arrtags.push(tag);
  }

  return resultado;

}

Так называемая функция "agregar_tags" получает как параметры: tag (tag, написанный пользователем, который хочет ввести информацию в компьютер) и arrtags (array глобально, что сохраняет tags, написанные пользователем). Эта функция берется за то, чтобы сохранять, не повторяя tags, написанных пользователем в глобальном array. Благодаря этой функции мы избегаем того, чтобы пользователь ввел информацию в компьютер tags повторенные. Предыдущая функция приспособила ее следующего примера: Единственный Array в javascript

Хороший, поскольку мы видим, внутри функции "agregar_tags" мы звоним в другой вызов "control_tags", эта берется за то, чтобы добавлять только tags, сохраняемые в базе данных, сравнивая, если tag находится внутри array, который сохраняет tags, полученные от базы данных.

function control_tags(needle, haystack) {
 var length = haystack.length;

 for(var i = 0; i < length; i++) {
    if(typeof haystack[i] == 'object') {
        if(arrayCompare(haystack[i], needle)) return true;
    } else {
        if(haystack[i] == needle) return true;
    }
 }

 return false;

}

control_tags возвратись true, если tag, введенный в компьютер пользователем находится в array tags, полученного от базы данных, иначе возвратись false, если tag не сохраняемых в базе данных. С этим мы избегаем того, чтобы пользователи ввели в компьютер tags, что не разрешенные. Функция control_tags очень полезная, потому что его один in_array PHP, но приспособленный к Javascript.

Следовательно должны быть созданы два arrays глобальные, один, который уже от ввода предохранял бы tags, полученные от базы данных и другого array, чтобы сохранять tags, добавленные пользователем. array, который сохраняет tags базы данных, остался бы так:

var arr_db = ["html", "css", "jquery", "javascript", "php"];
var usuario_tags = [];

И твой код tags остался бы так:

$("#tags input").on({
  focusout : function() {
    var txt = this.value.replace(/[^a-z0-9\+\-\.\#]/ig,''); // allowed characters
    // Aqui agregamos los tags escrito por el usuario y los cuales quiere agregar
    var control = agregar_tags(txt.toLowerCase(), usuario_tags);

    // Lo siguiente verifica que el tag ingresado sea de los permitidos en base de datos
    var verifica_tags = control_tags(txt.toLowerCase(), arr_db);


  // control debe retornar false con esto evitamos que se inserten tags repetidos
 // verifica_tags debe retornar true, esto quiere decir que el tag esta guardado en la base de datos
  if(txt && control == false && verifica_tags == true) {
    $("<span/>", 
    {
        text: txt.toLowerCase(), 
        insertBefore:this
    });


  }
   this.value = "";

},
keyup : function(ev) {
  // if: comma|enter (delimit more keyCodes with | pipe)
  if(/(188|13)/.test(ev.which)) $(this).focusout(); 
}

});

Как загружать tags базы данных в array arr_db? со мной случается из-за ajax, из стороны PHP ты делаешь соответствующую консультацию возвращаешь json, и в javascript ты это пробегаешь с for и с arr_db.push (returnedData [i]) сохраняешь tags в array.

Основной пример консультации на основе данных в PHP и возврата json со всеми сохраняемыми tags:

$servername = "localhost";
$username = "root";
$password = "";
$dbname = "tagsdb";

// Create connection
$conn = new mysqli($servername, $username, $password, $dbname);
// Check connection
if ($conn->connect_error) {
 die("Connection failed: " . $conn->connect_error);
} 

$sql = "SELECT nombre FROM tags";
$result = $conn->query($sql);
$arr = array();
$i = 0;

if ($result->num_rows > 0) {
  // output data of each row
  while($row = $result->fetch_assoc()) {
    $arr[$i] = strtolower($row['nombre']);
    $i++;
  }
} 

echo json_encode($arr);
$conn->close();

Пример с ajax, чтобы загружать tags базы данных в глобальном array:

  $.ajax({
    url: 'tags.php',
    success: function(result)
    {
        var returnedData = JSON.parse(result);
        var total = returnedData.length;

        for(var i = 0; i < total; i++){
            arr_db.push(returnedData[i]);
        }
     }
  });

В конце концов в следующем блоке ты должен добавлять следующее:

$('#tags').on('click', 'span', function() {
 $(this).remove(); 

 quitar_tags(usuario_tags, $(this).text());
});

quitar_tags - функция, которая берется за то, чтобы лишать себя tags глобального array, который сохраняет tags, выбранные пользователем, когда этот реализует действие снимания tag. Шрифт: Снимать элементы array

function quitar_tags(array, element) {
 const index = array.indexOf(element);
 array.splice(index, 1);
}

Я надеюсь, что этот путеводитель помогает тебе, и во все, кто сходили бы немного сходными. Привет!

6
ответ дан 24.11.2019, 13:31
  • 1
    На твоем сомнении, со мной случается посредством ajax. В tag.php ты производишь необходимую консультацию в базу данных и сохраняешь в json доступные tags. Этот json ты это возвращаешь в success ajax, и это пробегаешь с for, и из-за каждого tag ты это сохраняешь в глобальном array. Он та и #250; nica форма, что я произошел с собой, и # 243; quiz и # 225; s тебе приходит в голову что-то лучшее. Добавьте в моем ответе пример в PHP и tambi и # 233; n как он был бы в ajax. – Vanessa Marchelli 04.09.2016, 20:37
  • 2
    Aqu и # 237; я происхожу с тобой c и # 243; я говорю упорядоченный: jsfiddle.net/tftz375q – Vanessa Marchelli 05.09.2016, 03:37
  • 3
    Система функционирует очень довольно дружелюбная, хотя в и # 250; n отсутствие одни согрешило и # 241; подробно опиши не много что-то основное вам jquery я специализируюсь м и # 225; s nativamente в php/mysqli выдвинула новый вопрос о самом тема , но который лучше, который ud, которую он знает очень хорошо как эту выдвинутый c и # 243; я говорю и система надеялась, что ты можешь наблюдать вопрос и можешь помогать мне с peque и # 241; или проблема спасибо привет:) – Otto 17.09.2016, 22:51

Я сделал бы нечто похожее JS:

var tags = new Tags('#tags input','http://localhost/newTagAjax.php')

jQuery("#tags input").on('keydown', function(ev) {
    if(ev.which === 13) {
        tags.add()
    }
})

function Tags(id,addURL){
    this.id = id
    this.addURL = addURL
}

Tags.prototype.add = function () {
    var _this = this
    var newTag = $(_this.id).val()
    $.post(this.addURL, {tag:newTag}, function( data ) {

        if( data.res) {
            //Aquí colocas tu código JS si es correcto
        }
        //Podrías usar este plugin
        $.notify({message: data.message})
    },"json")

}

И PHP сделал бы нечто похожее:

if ( !empty($_POST['tag']) ) {
    //Una clase que debes crear
    $db = new DBConnect();
    $id_tag = $db->add($_POST['tag']);
    $res= array(
        'res' => true,
        'id' => $id_tag,
        'message' => 'Tag añadida a la DB'
    );
    echo json_encode($res);
    exit();
}
$res= array(
    'res' => false,
    'message' => 'Error al añadir el tag a la DB'
);
echo json_encode($res);
exit();
2
ответ дан 24.11.2019, 13:31

$(function(){// DOM ready
			// ::: TAGS BOX
  var arr_php = [ "COMIDA", "HAMBRE", "TENEDOR", "MORIR" ]; //ARRAY CARGADO CON PHP
  var arr_temp=[];
  $("#tags input").on({
    focusout : function() {
	  var txt = this.value.replace(/[^a-z0-9\+\-\.\#]/ig,'');
	  if(jQuery.inArray(txt, arr_php) !== -1){
	    if(jQuery.inArray(txt.toLowerCase(), arr_temp)=== -1){
		  $("<span/>", {text:txt.toLowerCase(), insertBefore:this});
		  arr_temp.push(txt.toLowerCase());
	    }
	  }
	  this.value = "";
	},
	keyup : function(ev){
		// if: comma|enter (delimit more keyCodes with | pipe)
	   	if(/(188|13)/.test(ev.which)){
	   		$(this).focusout();
	   	} 
	}
  });
  $('#tags').on('click', 'span', function() {
	$(this).remove(); 
  });

		});
<style>
      	#tags{
		  float:left;
		  border:1px solid #ccc;
		  padding:5px;
		  font-family:Arial;
		}
		#tags > span{
		  cursor:pointer;
		  display:block;
		  float:left;
		  color:#fff;
		  background:#789;
		  padding:5px;
		  padding-right:25px;
		  margin:4px;
		}
		#tags > span:hover{
		  opacity:0.7;
		}
		#tags > span:after{
		 position:absolute;
		 content:"×";
		 border:1px solid;
		 padding:2px 5px;
		 margin-left:3px;
		 font-size:11px;
		}
		#tags > input{
		  background:#eee;
		  border:0;
		  margin:4px;
		  padding:7px;
		  width:auto;
		}
    </style>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div id="tags">
	  <span>jquery</span>
	  <input type="text" value="" placeholder="Add a tag" />
	</div>

Сначала ты загружаешь контент array PHP, этот контент ты можешь извлекать это из базы данных с MySql

var arr_php = [<?php echo '"OK","COMIDA","HAMBRE","MORIR"'; ?>];
var arr_temp=[];

Entonces сейчас должен консультироваться, если вошедшее слово существует в array, загруженном с PHP if (jQuery.inArray (txt, arr_php)! ==-1)

В тебе cГіdigo ты заменяешь:

focusout : function() {
      var txt = this.value.replace(/[^a-z0-9\+\-\.\#]/ig,''); // allowed characters
      if(txt) $("<span/>", {text:txt.toLowerCase(), insertBefore:this});
      this.value = "";
    },

из-за:

focusout : function() {
      var txt = this.value.replace(/[^a-z0-9\+\-\.\#]/ig,'');
      if(jQuery.inArray(txt, arr_php) !== -1){
        if(jQuery.inArray(txt.toLowerCase(), arr_temp)=== -1){
          $("<span/>", {text:txt.toLowerCase(), insertBefore:this});
          arr_temp.push(txt.toLowerCase());
        }
      }
      this.value = "";
    },
1
ответ дан 24.11.2019, 13:31
  • 1
    Olvid и # 233; что не повторил слово! тогда – Gonzalo Jeria 08.09.2016, 17:40

Существуют много plugins для jQuery, чтобы добавлять этикетки к формам.

jQuery StackOverflow's автозавершил tagging plug-in like неудар в лунку tags?

Не если ты использовал какой-то framework, но я знаю какие-то, которые позволяют тебе добавлять контент к верным "зонам" в форме блоков. Twig например позволяет тебе делать что-то как:

<?= block 'inline_javascript' do ?>
<script src="..."></script>
<script>
;(function ($) {
    // ...
})(jQuery)
</script>
<? end ?>
# Después imprimes el contenido del bloque `inline_javascript`
<html>
    </head>
    </head>
</html>
<body>
    <?= yield('inline_javascript') ?>
</body>
</html>

Я не помню, так ли это это синтаксис.

Точка состоит в том, что в эти блоки ты мог бы включать твою договоренность разрешенных этикеток объявляя переменную в JS, или осуществлять helper, который печатал бы осуществление plugin полностью, только показывая ему возможно имя поля, разрешенных этикеток, и т.д.

Ты можешь последовательно преобразовывать твой объект в объект JSON, который ты можешь тратить с языка сценариев JavaScript:

<?php
$allowed = array('tag1', 'tag2', 'tag3', ...);
$allowedTags = json_encode($allowed);
?>

Придите, откуда он мстит договоренности tags, уже будьте базы данных, или откуда он был, ты можешь последовательно преобразовывать договоренность в JSON и помещать контент переменной $allowedTags (объект JSON) в переменной языка сценариев JavaScript.

У тебя должна быть специальная забота с латинскими символами, например. Также манипулировать правильно кавычками ключей объекта JSON.

json_encode

0
ответ дан 24.11.2019, 13:31