1

我有一个使用 jQuery 和 AJAX 填充输入字段的表单。当我从动态填充的下拉列表中选择选项时，我无法img更改 URL 。src

JavaScript：

$(document).ready(function(){
    $("#id").change(function(){
        $.ajax({
            url     : 'get_driver_data2.php',
            type    : 'POST',
            dataType: 'json',
            data    : $('#ContactTrucks').serialize(),
            success: function( data ) {
                   for(var id in data) {        
                          $(id).val( data[id] );
                   }
            }
        });
    });
});

PHP：

$id_selected = $_POST['id']; // Selected  Id
$query  = "SELECT * from admin_dispatch_records where id = '$id_selected' AND     driver LIKE '%$username%'";
$result = mysqli_query($dbcon, $query);
while ($row = mysqli_fetch_array($result, MYSQLI_ASSOC)) {
    $eta = $row['eta'];
    $time = $row['dispatch_time'];
    $date = $row['dispatch_date'];
    $name = $row['name'];
    $phone = $row['phone'];
    $vehicleyear = $row['vehicleyear'];
    $color = $row['color'];
    $make = $row['make'];
    $model = $row['model'];
    $vin = $row['vin'];
    $plate = $row['plate'];
    $mileage = $row['mileage'];
    $pickup = $row['pickup'];
    $dropoff = $row['dropoff'];
    $price = $row['price'];
    $invoice = $row['invoice'];
    $cash = $row['cash'];
    $credit = $row['credit'];
    $check = $row['check'];
    $po = $row['po'];
    $billed = $row['billed'];
    $need_to_bill = $row['need_to_bill'];
    $getphoto = $row['image_path'];
}

$arr = array( 'input#eta' => $eta, 'input#dispatch_time' => $time, 'input#dispatch_date' => $date, 'input#name' => $name, 'input#phone' => $phone, 'input#vehicleyear' => $vehicleyear, 'input#color' => $color, 'input#make' => $make, 'input#model' => $model, 'input#vin' => $vin, 'input#plate' => $plate, 'input#mileage' => $mileage, 'textarea#pickup' => $pickup, 'textarea#dropoff' => $dropoff, 'input#price' => $price, 'input#invoice' => $invoice, 'input#cash' => $cash, 'input#credit' => $credit, 'input#check' => $check, 'input#po' => $po, 'input#billed' => $billed, 'input#need_to_bill' => $need_to_bill, 'image#image_path' => $getphoto);
echo json_encode($arr);

一些HTML：

<td>
<img id="image_path" src="????" />
</td>
</tr>
</table>

<p><strong>
<input type="submit" value="Complete Dispatch">
</strong></p>

src当我更改选择框时，如何使用来自 AJAX 调用的数据库值填充？填充所有其他数据并正确返回字符串。我已经通过放置一个输入框并包含input#image_path => $getphoto. img标签的语法与inputor不同textarea吗？我尝试过包含 PHP 内联并将其分配src给$getphoto没有运气。我希望使用 AJAX 传递的数据创建一个隐藏的输入字段，然后获取该数据并将其设为 var，但也无法弄清楚。

4

3 回答 3

0

你的意思是

if (id=="image_path") $(id).attr("src", data[id] );
else $(id).val( data[id] );
于 2012-12-03T05:11:55.267 回答
0

您可以使用attr()以下方式进行更改src：

$(id).attr("src", data[id]);   // chnage the source of the img tag

在这种情况下，您可以在for循环中使用条件语句，如下所示：

if(id=="image_path"){
   $(id).attr("src", data[id]);
}else{
   $(id).val(data[id]);
}
于 2012-12-03T05:15:06.680 回答
0

src您的JavaScript没有设置<img>.

在你的for循环之后，你可以像这样从数组中提取数据：

$("#image_path").attr("src", data['image#image_path']);

或者，如果你想使用隐藏的<input>方法，那看起来像：

HTML：

<td>
<input type="hidden" id="image_path" value="default.png" />
<img id="photo" src="default.png" />
</td>

PHP：

$arr = array('input#eta' => $eta,
             ...
             'input#image_path' => $getphoto);

JavaScript：

$(document).ready(function(){
    $("#id").change(function(){
        $.ajax({
            url     : 'get_driver_data2.php',
            type    : 'POST',
            dataType: 'json',
            data    : $('#ContactTrucks').serialize(),
            success : function(data) {
                          for(var id in data) {        
                              $(id).val(data[id]);
                          }
                          $("#photo").attr("src", $("#image_path").val());
                      }
        });
    });
});
于 2012-12-03T05:18:37.253 回答