Question

我花了整个周末的时间看教程，并发布了一些问题，试图锻炼如何做到这一点，而没有任何运气。

我正在处理一个加载Bootstrap模态的脚本，该模态包含根据s Json结果的结果自动填充的形式。该表格允许用户编辑显示的记录并保存。我要完成最后一件事。加载的记录包含图像的名称，我需要以表格形式显示该图像。

调用数据的代码：

success:function(data) {
    var result = JSON.stringify(data);
    result = JSON.parse(result);
    console.log("DATA", result );
    $('#Editrecordid').val(result[0]);
    $('#Editpromotionname').val(result[1]);
    $('#Editboard').val(result[2]);
    //$('#board option[value=(.+ result[2] +.]').prop('selected', true);
    $('#Editscreenlocation').val(result[3]);
    if(result[4] == 'L') {
       $('#Editorientation').val('Landscape');
    } else {
       $('#Editorientation').val('Portrait');
    }

    // THE VAR BELOW CONTAINS THE PATH TO THE IMAGE FILE ON THE SERVER
    var imagepath = '../../../../signage/promotion_images/'+ result[15] +'/'+ result[2] +'/'+ result[5];
    console.log("Image path", imagepath);
    // I END UP THE THE BELOW DIV ID POPULATED WITH THE PATH AND IMAGE NAME
    $('#Editpromotionimage').val(imagepath);

    $('#Editmediatype').val(result[6]);
    $('#fromdate').val(result[7]);
    $('#fromtimeh').val(result[8]);
    $('#fromtimem').val(result[9]);
    $('#todate').val(result[10]);
    $('#totimeh').val(result[11]);
    $('#totimem').val(result[12]);
    $('#displaywidth').val(result[13]);
    editw = result[13];
    console.log("editw",editw);
    $('#displayheight').val(result[14]);
    edith = result[14];
    console.log("edith",edith);

    $('#insert').val("Update");
    $('#Editlandscape0').hide();
$('#edit_data_Modal_2').modal("show");
}

如果我临时有一个文本框，其格式为：

<input type="text" class="timetext" name="EditImagePath" id="Editpromotionimage" value="">

显示正确的路径和文件名。

我的问题是如何显示实际图像？

在此先感谢您的帮助和时间。

Answer 1

您可以创建一个img标签并以这种方式将其附加，因此只需将img标签添加到要在模式中显示的位置即可。

<img id="Editpromotionimage" class="img-responsive">

然后使用jQuery：

$("#Editpromotionimage").attr("src",imagepath);

以引导模式显示图像，并动态填充表单

1 个答案: