保存jQuery标签——输入为php数组。

I am using jQuery Tag-it! to create a "Skills" input form for my users. I have the UI of tag-it working, but I cannot get the user input into a PHP array. I am trying to serialize this array and save it to a mysql database for displaying later, but I can't even get the data into an array.

我用的是jQuery标签!为我的用户创建一个“技能”输入表单。我有tagit工作的UI，但我无法将用户输入输入到PHP数组中。我正在尝试序列化这个数组，并将其保存到mysql数据库中，以便稍后显示，但我甚至无法将数据放入数组中。

Here is the javascript initializing tag-it:

这里是javascript初始化标记:

$('#skills').tagit({     
    allowSpaces: true,
    placeholderText: "Separate skills with a comma please",
    autocomplete: true
});

Here is the HTML:

HTML:

<div>
    <label class="add_label">Skills: </label>
    <ul id="skills" style="width: 275px; margin-bottom: 8px;"></ul>
</div>

This is the javascript that creates the input field where the user input is supposed to be stored:

这是创建输入字段的javascript，用户输入应该存储在这里:

if (!this.options.singleField) {
       var escapedValue = label.html();
       tag.append('<input type="hidden" style="display:none;" value="' + escapedValue + '" name="' + this.options.fieldName + '" />');
}

And this is the PHP which gets the user input -- this is the part that is not working. I cannot retrieve ANY data from the form:

这是PHP，它获取用户输入，这是不工作的部分。我无法从表格中检索任何数据:

$skillsArr = $link->real_escape_string($_POST['skills']);

When I do submit the form, the mysqli query executes and in the database I see "N;" where the serialized array should be.

当我提交表单时，mysqli查询会执行，在数据库中我看到的是“N”，在这里序列化的数组应该是这样的。

How can I get the jQuery Tag-it values into a PHP array that I can serialize and save to a mysql database?

如何将jQuery tagit值放入到一个PHP数组中，我可以将其序列化并保存到mysql数据库中?

2 个解决方案

#1

The problem is that tag-it will by default send the post request with data like this:

问题是，tagit将会默认以这样的数据发送post请求:

tags=foo&tags=bar&tags=blah

PHP will interpret that by making $_POST['tag'] ='blah'. For PHP to handle it like an array the post data needs to look like:

PHP将通过$_POST['tag'] ='blah'来解释这一点。对于PHP，要像数组一样处理post数据，需要如下所示:

tags[]=foo&tags[]=bar&tags[]=blah

The easiest way to solve this is just by changing the fieldName parameter when you setup tag-it, such as:

解决这一问题的最简单方法是在设置标记时更改fieldName参数，例如:

$('.taglist').tagit({
    allowSpaces: true,
    placeholderText: 'add new tag here...',
    fieldName: 'tags[]'
});

By simply changing the name to include the [] then it'll be interprested as you want by PHP and be an array.

只需将名称更改为包含[]，就可以根据PHP的需要对其进行解释，并成为一个数组。

Alternatively, if you're not able to adjust that you could always process the raw PHP data to get the tags as an array, like:

或者，如果您无法调整，您可以始终处理原始的PHP数据以将标记作为数组来获取，比如:

$query = array();
foreach (explode('&', file_get_contents('php://input')) as $kv) {
    list($k, $v) = explode('=', $kv);
    $k = urldecode($k);
    $v = urldecode($v);
    if (!isset($query[$k])) {
        $query[$k] = $v;
    } else {
        if (is_array($query[$k])) {
            $query[$k][] = $v;
        } else {
            $query[$k] = array($query[$k], $v);
        }
    }
}

Now $query['tags'] will be an array as expected.

现在$query['tags']将是一个预期的数组。

NB: If only one tag is sent then it'll end up being a string with the above code, so just make sure you cast it as an array if the result is going in a loop or something:

NB:如果只发送了一个标签，那么它就会变成一个带上面代码的字符串，所以如果结果是循环的，那么就一定要把它转换成一个数组。

foreach((array)$query['tags'] as $tag) ...

#2

I found it easier to just do all the queries on the backend (php/mysqli).

我发现在后台执行所有查询(php/mysqli)比较容易。

That way the only thing I needed in my jQuery autocomplete was:

这样，我在jQuery autocomplete中唯一需要的就是:

<script>
$(document).ready(function(){
  $("#tagit").tagit({
    autocomplete: {
   source: "ajax-search.php",
}
  });
});
</script>

I just defined the source of the file. You can add the delimiter, etc to this as you want (I just modded the source instead).

我刚刚定义了文件的源文件。您可以添加分隔符，如您想要的那样(我只是将源代码改为)。

But the primary function is from the php file, which returns a JSON encoded result.

但是主函数来自php文件，它返回一个JSON编码的结果。

<?php
include("dbconnect.php"); //Including our DB Connection file

    if ( !isset($_REQUEST['term'])) //if there's no search, exit
  exit;

    $keyword = trim($_REQUEST['term']);
    $keyword = mysqli_real_escape_string($db, $keyword);
    $query = "SELECT * FROM animals WHERE english LIKE '%$keyword%' LIMIT 10";
    $result = mysqli_query($db, $query); //Run the Query

    $data = array(); //initialize array

    if ($result && mysqli_num_rows($result)){
   while($row = mysqli_fetch_assoc($result)){
      $data[] = array(
        'id' => $row['row_id'],
    'label' => $row['english'], //This is the 'live return of the search
    'value' => $row['eng_dir'], //The value returned. Not needed if you're returning the label
    'latin' => $row['latin'] //Another result (you can add more)
       );
    }
     }
    echo json_encode($data);
    flush();
  ?>

Then inside the tag-it.js file you can select what you want to push as a tag:

然后在标记。js文件你可以选择你想要推送的标签:

if (this.options.availableTags || this.options.tagSource || this.options.autocomplete.source) {
   var autocompleteOptions = {
   select: function(event, ui) {
     that.createTag(ui.item.id); //pushes the ID
 that.createTag(ui.item.value); //pushes the value
     that.createTag(ui.item.label); //pushes the label
     that.createTag(ui.item.latin); //pushes the extra variable
 // Preventing the tag input to be updated with the chosen value.
 return false;
    }
   };
  $.extend(autocompleteOptions, this.options.autocomplete);

The code above will return 4 instances of the same tag depending on your result.

上面的代码将根据您的结果返回相同标记的4个实例。

#1