jquery - 使用 ajax 将数据传递到 Bootstrap 模式时为空白

标签 jquery ajax twitter-bootstrap codeigniter

我需要帮助在 Codeigniter 中使用 ajax 将数据传递到模式 Bootstrap

当我将数据传递到模态时,模态 Bootstrap 有空白输入。我知道我的 ajax 工作,因为如果我传递静态数据,模式就会显示它。但如果我从 GET 传递数据,模态输入总是空白

我是 ajax 新手,所以我认为我的 JSON 解析是错误的。

型号:

public function getEditContent($table,$field,$key)
{
    return $this->db->get_where($table, array($field => $key))->result();
}

Controller :

public function Test()
{
    $this->load->library('Datatables');

    $this->_header();
    $this->load->view('Front/v_test',$data);
    $this->_footer();
}

public function testdata()
{
    $data['result'] = $this->Model->getEditContent('arsip','idsurat','1');
    echo json_encode($data);
}

查看:

<div class="col-xs-12 col-sm-12">
	<!-- Button HTML (to Trigger Modal) -->
	<a href="javascript:void(0)" onclick="openModal()">
		<span class="glyphicon glyphicon-pencil"></span></a>
</div>

<!-- Modal HTML -->
<div id="form-content" class="modal fade">
	<div class="modal-dialog">
		<div class="modal-content">
			<div class="modal-header">
				<a class="close" data-dismiss="modal">×</a>
				<h3>Input Data Surat Keluar</h3>
			</div>
			<div class="modal-body">
				<?php echo form_open('Tambah/insert_suratkeluar'); ?>
				<div class="form-group">
					<label for="inputEmail">No Surat</label>
					<input type="text" class="form-control" name="nosurat" placeholder="No Surat" id="nosurat">
				</div>
				<div class="form-group">
					<label for="tglkirim">Tanggal Kirim</label>
					<div class='input-group date' id='datetimepicker1'>
						<input type='text' class="form-control" name="tglkirim" placeholder="Masukkan Tanggal Kirim" />
						<span class="input-group-addon">
							<span class="glyphicon glyphicon-calendar"></span>
						</span>
					</div>
				</div>
				<script type="text/javascript">
					$(function ()
						{
							$('#datetimepicker1').datetimepicker(
								{
									format: 'YYYY/MM/DD'
								});
						});
				</script>
				<div class="form-group">
					<label for="inputPassword">Alamat</label>
					<input type="text" class="form-control" name="alamat" placeholder="Alamat" id="alamat" value="">
				</div>
				<div class="form-group">
					<label for="notelp">No Telp</label>
					<input type="text" class="form-control" name="notelp" placeholder="No Telp" value="">
				</div>
				<div class="form-group">
					<label for="inputPassword">Email</label>
					<input type="email" class="form-control" name="email" placeholder="Email" value="">
				</div>
				<div class="form-group">
					<label for="inputPassword">Nama Perusahaan</label>
					<input type="text" class="form-control" name="nmusaha" placeholder="Nama Perusahaan" value="">
				</div>
				<div class="form-group">
					<label for="inputPassword">Deskripsi</label>
					<input type="text" class="form-control" name="deskripsi" placeholder="Deskripsi" value="">
				</div>
				<div class="modal-footer">
					<button type="submit" class="btn btn-primary">Submit</button>
					<a href="#" class="btn" data-dismiss="modal">Cancel</a>
				</div>
				<?php echo form_close(); ?>
			</div>
		</div>
	</div>
</div>

Jquery:

function openModal()
{
    $.ajax(
        {
            url:"testdata/",
            type : 'GET',
            dataType : 'json',
            success:function (result)
            {
                $('#nosurat').val(result.nosurat);
                $('#alamat').val("Test Alamat");
                $('#form-content').modal('show');
            },

        });

}

我在 firebug 中得到 JSON :

enter image description here

最佳答案

如果您检查响应,则会返回由数组的属性 result 组成的对象。因此,您可以通过传递适当的 key 来达到想要的值:

$('#nosurat').val(result[0].nosurat);

关于jquery - 使用 ajax 将数据传递到 Bootstrap 模式时为空白,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/33583335/

相关文章:

javascript - 脚本未在 templateurl 中运行

javascript - 绘制元素边框(动画)

javascript - 应用屏蔽后如何解决 IE11 上的输入闪烁问题?

javascript - CSS 设置 Bootstrap 项目处于事件状态

javascript - jQuery - 如何将新数据附加到充满 "position: absolute"框的 div

javascript - addEventListener ("popstate") 不触发 .document

ajax - Grails:每次 ajax 调用时发送缓存头的最佳方式

php - Ajax Php Mysql 在插入数据时检索确认

css - 为什么 Bootstrap 不把 div 放在一起?

jquery - twitter bootstrap 示例博客显示事件 : nav a