Question

我对以下事情有点失落。我有这段代码，

Fleet.php

function sendData(nr) {
var data = $("#myform" + nr).serialize();

console.log(data);

$("#myForm" + nr).submit(function(event){
    event.preventDefault();
});

jQuery.ajax({
    url: "inc/FleetData.php",
    datatype: "html",
    type: "POST",
    data: data,
    success:function(data)
    {
        if(data) {
            //$("#fleet").load(window.location + " #fleet");
            $('#fleet').html(data);
            //alert(data);
        } else {
            //$("#fleet").load(window.location + " #container");
            //alert("Something is wrong with the update of the collor. Please notify an admin");
            //alert(data);
        }
    }
});
}

表格

<div class="rTablecell" style="background-color: #'.$row['train_row_color'].'";>
                <form method="post" action="" id="myform' . ++$i . '" onchange="sendData('.$i.');"/>
                    <input type="hidden" name="update" value="update" />
                    <input type="text" name="value" value="'.$row['train_name'].'">
                    <input type="hidden" name="field" value="train_name"/>
                    <input type="hidden" name="id" value="'.$row['id'].'">
                </form>
            </div>

现在我第一次更改它会将值发布到fleetData.php的值，然后它将加载div。之后我可以更改值，但不会将数据发送到fleetData.php，这只发生在文本字段而不是选择字段。

编辑：选择字段

<form method="post" action="" id="myform' . ++$i . '">
                <input type="hidden" name="update" value="update" />
                <select class="test" name="value" onchange="sendData('.$i.');" style="background-color: #'.$row['train_row_color'].';"> 
                <option value="" style="background-color: #ffffff"'; if($row['train_row_color'] == "") { echo 'selected'; } echo '></option>
                <option value="ff0000" style="background-color: #ff0000"'; if($row['train_row_color'] == "ff0000") { echo 'selected'; } echo '>Red</option>
                <option value="3000ff" style="background-color: #3000ff"'; if($row['train_row_color'] == "3000ff") { echo 'selected'; } echo '>Blue</option>
                <option value="36ff00" style="background-color: #36ff00"'; if($row['train_row_color'] == "36ff00") { echo 'selected'; } echo '>Green</option>
                <option value="e400ff" style="background-color: #e400ff"'; if($row['train_row_color'] == "e400ff") { echo 'selected'; } echo '>Purple</option>
                <option value="fff000" style="background-color: #fff000"'; if($row['train_row_color'] == "fff000") { echo 'selected'; } echo '>Yellow</option>
                <input type="hidden" name="field" value="train_row_color" />
                <input type="hidden" name="id" value="'.$row['id'].'" />
                </select>
                </form>

Answer 1

一些事情，你应该做一个事件监听器而不是内联脚本，你应该改为class而不是id，你应该删除input字段select：

# Might also be less code to do this once in a function
function setSelected($value,$is)
{
    return ($value == $is)? ' selected="selected"' : '';
}

?>
<form method="post" action="" class="myform">
    <input type="hidden" name="update" value="update" />
    <input type="hidden" name="field" value="train_row_color" />
    <input type="hidden" name="id" value="<?php echo $row['id'] ?>" />
    <select class="test" name="value" style="background-color: #<?php echo $row['train_row_color'] ?>">
        <option value="" style="background-color: #ffffff"<?php echo setSelected($row['train_row_color'],"") ?>><?php echo $row['train_row_color'] ?></option>
        <?php foreach(['ff000'=>'Red','3000ff'=>'Blue','36ff00'=>'Green','e400ff'=>'Purple','fff000'=>'Yellow'] as $key => $value): ?>
        <option value="<?php echo $key ?>" style="background-color: #ff0000"<?php echo setSelected($row['train_row_color'],$key) ?>><?php echo $value ?></option>
        <?php endforeach ?>
    </select>
    <input type="submit" name="SAVE" value="SAVE" />
</form>


<script>
$(function(){
    // Listen for both change and submit
    $('.myform').on('change submit',function(e){
        e.preventDefault();
        var data = $(this).serialize();

        $.ajax({
            url: "test.php",
            type: "POST",
            data: data,
            success:function(response) {
                if(response) {
                    //$("#fleet").load(window.location + " #fleet");
                    $('#fleet').html(data);
                    //alert(data);
                } else {
                    //$("#fleet").load(window.location + " #container");
                    //alert("Something is wrong with the update of the collor. Please notify an admin");
                    //alert(data);
                }
            }
        });
    });
});
</script>

Answer 2

Probem解决了。我没有关闭我的表格

<form method="post" action="" class="myform' . ++$i . '>

而不是

<form method="post" action="" class="myform' . ++$i . '">

我的坏。

谢谢大家的时间。我会看一下@Rasclatt给我的选项。

Answer 3

使用echo或打印将值设置或绑定到文本字段

<input type="text" name="value" value="<?php echo $row['train_name']; ?>">
<input type="hidden" name="field" value="train_name"/>
<input type="hidden" name="id" value="<?php echo $row['id']; ?>">

更新textfield时jQuery ajax无法再次更改textfield

3 个答案: