Question

我需要使用jquery发布我的td标签的这些值作为这个可编辑的表。我不确定这里的问题是脚本还是td标签？目前我的var_dump（$ _ POST）没有返回任何值。

见下面的代码，td标签大约有10行：

<h2><u>Edit</u></h2>
<form action="ajax/name.php" name="edit_template_form" id="edit_template_form" method="post">
    <?php print "<table border=\"1\" class=\"editableTable\">
    <tr>
    <th>Template Name</th>
    <th>Template Description</th>
    </tr>";
        foreach($res as $row){ 
            $temp_description = $row['template_description'];
        echo "<tr>";
        echo "<td id=\"edit_name\" name=\"edit_name\">". $row['template_name']. "</td>";
        echo "<td id=\"edit_template\" name=\"edit_template\">". nl2br($temp_description). "</td>";
        echo "<tr/>"; 
        } 
    print "</table>"; ?>
</form>
<div id="template_edit"></div>

name.php

var_dump($_POST);

if (isset($_POST['edit_template'])) {
$template_edit = $db->escape($_POST['edit_template']);

$user = $db->escape($user);
$db->update('templates', array('template_description' => $template_edit), 'AND userID="'.$user.'"');

echo $_POST['edit_template'];
}


if (isset($_POST['edit_name'])) {   
$template_name = $db->escape($_POST['edit_name']);

$user = $db->escape($user);
$db->update('templates', array('template_name' => $template_name), 'AND userID="'.$user.'"');

echo $_POST['edit_name'];
}

的script.js

$(function () {
$("td").dblclick(function () {

    var OriginalContent = $(this).text();

    $(this).addClass("cellEditing");
    $(this).html("<input type='text' value='" + OriginalContent + "' />");
    $(this).children().first().focus();

        $(this).children().first().keypress(function (e) {
            if (e.which == 13) {

            //POST values
            var edit_template = $('#edit_template').val();
            var edit_name = $('#edit_name').val();

                $.post('ajax/name.php', {edit_name: edit_name, edit_template: edit_template}, function(data) {
                        $('div#template_edit').text(data);
                        });  

                var newContent = $(this).val();

              $(this).parent().text(newContent);
              $(this).parent().removeClass("cellEditing");
            }
    });

$(this).children().first().blur(function(){
    $(this).parent().text(OriginalContent);
    $(this).parent().removeClass("cellEditing");
});
});

}）;

Answer 1

第一期：独特的ids

您的HTML中不能有相同ID的倍数 - 这是无效代码，会在您的代码中提供不一致和/或不正确的结果。

要解决此问题，请将<td>元素上的ID更改为类：

echo "<td class=\"edit_name\" name=\"edit_name\">". $row['template_name']. "</td>";
echo "<td class=\"edit_template\" name=\"edit_template\">". nl2br($temp_description). "</td>";

第二期：没有发布价值

您正在<input>中创建<td>，然后获取<td>的值，然后将<td>的内容替换为值<input> <td>。

这里有三个问题：

.text()元素没有值 - 您应该使用.val()来抓取其内容而不是<td>。
您这样做不正常 - 当您抓取<input>包含<td>但没有文字的内容时。
在你的keydown事件处理程序（this）中替换<input>引用的$(this).children().first().keypress(function (e) { if (e.which == 13) { var newContent = $(this).val(); var $parent = $(this).parent(); $parent.text(newContent); $parent.removeClass("cellEditing"); //POST values var edit_template = $parent.closest("tr").find(".edit_template").text(); var edit_name = $parent.closest("tr").find(".edit_name").text(); $.post('ajax/name.php', {edit_name: edit_name, edit_template: edit_template}, function(data) { $('#template_edit').text(data); }); } });元素的内容后，不再与DOM有任何关系，所以你必须存储对另一个元素（例如，父元素）的引用来执行DOM操作。

因此在script.js中进行以下更改：

div

注意我还从$.post回调 - #id中的选择器中删除了element#id，因为jQuery中的选择器比{{1}}更快，而且id应该是唯一的DOM。

Answer 2

更改代码的顺序......

var newContent = $(this).val();
$(this).parent().text(newContent);
$(this).parent().removeClass("cellEditing");

var edit_template = $('#edit_template').text(); //here is not val, is text...
var edit_name = $('#edit_name').text(); //here is not val, is text...

//POST values
$.post('ajax/name.php', {edit_name: edit_name, edit_template: edit_template}, function(data) {
   $('div#template_edit').text(data);
 });

Answer 3

我认为你的问题在这里：

$.post('ajax/name.php', {edit_name: edit_name, edit_template: edit_template}

edit_name和edit_template被用作本地变量和数据密钥。

我会尝试：

$(this).children().first().keypress(function (e) {
        if (e.which == 13) {

            $.post('ajax/name.php', {edit_name: $('#edit_name').val(), edit_template:  $('#edit_template').val(), function(data) {
                    $('div#template_edit').text(data);
                    });  

            var newContent = $(this).val();

          $(this).parent().text(newContent);
          $(this).parent().removeClass("cellEditing");
        }
});

注意：这是在黑暗中刺伤，完全未经测试!!

如果html中的元素ID不唯一，您也会遇到问题。

我也会考虑在这里某处关联你数据库中的ID。

如何获取标签的发布值

3 个答案:

第一期：独特的ids

第二期：没有发布价值