x 动态上的可编辑值更改不起作用
Posted
技术标签:
【中文标题】x 动态上的可编辑值更改不起作用【英文标题】:x editable value change on dynamically not working 【发布时间】:2014-11-21 00:25:42 【问题描述】:我已经为引导应用程序使用 x 可编辑文件。现在我有一种情况,我需要通过单击按钮更改跨度上的值。值正在更改,但是如果我单击该 x 可编辑跨度,则在文本框中填充上一个值 这是我的示例代码
<head>
<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1" />
<meta charset="utf-8" />
<title>Patient portal</title>
<meta name="description" content="3 styles with inline editable feature" />
<meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0" />
<link rel="stylesheet" href="assets/css/bootstrap-editable.css" />
</head>
<body ><!-- #section:basics/navbar.layout -->
<div>
<span class="editable" id="city"> intial value </span>
<button id="change">change value</button>
</div>
<script type="text/javascript">
window.jQuery || document.write("<script src='assets/js/jquery.min.js'>"+"<"+"/script>");
</script>
<script src="assets/js/bootstrap.min.js"></script>
<script src="assets/js/x-editable/bootstrap-editable.min.js"></script>
<script src="assets/js/x-editable/ace-editable.min.js"></script>
<!-- inline scripts related to this page -->
<script type="text/javascript">
$( document ).ready(function()
$.fn.editable.defaults.mode = 'inline';
$.fn.editableform.loading = "<div class='editableform-loading'><i class='ace-icon fa fa-spinner fa-spin fa-2x light-blue'></i></div>";
$.fn.editableform.buttons = '<button type="submit" class="btn btn-info editable-submit"><i class="ace-icon fa fa-check"></i></button>'+
'<button type="button" class="btn editable-cancel"><i class="ace-icon fa fa-times"></i></button>';
$('#city').editable(
type: 'text',
name: 'FirstName',
title: 'enter First Name',
validate: function(value)
if($.trim(value) == '')
return ' First Name is required';
else if($.trim(value).length>30)
return 'Only 50 charateres are allowed';
);
$('#change').click(function()
$('#city').text("changed value")
);
)
</script>
</body>
这里首先使用“初始值”填充城市跨度,当我单击该跨度时,将出现一个带有值“初始值”的文本框,然后如果我单击更改按钮,跨度值将更改为“更改值” '。然后如果我再次单击跨度文本框显示以前的值'初始值'。我该如何解决这个问题,任何帮助将不胜感激
这是 jfiddle 链接jfiddle
【问题讨论】:
@divakar 我添加了 jfiddle 链接 【参考方案1】:要为 x 可编辑对象设置新值,您必须调用其方法 setValue
。
Documentation Here
演示:JSFiddle
例子:
$('#change').click(function()
$('#city').editable('setValue',"changed value");
);
【讨论】:
【参考方案2】:这是您的解决方案。您只需要在更改的按钮单击上设置值。您只需在“#change”按钮的单击中添加此行$('#city').editable('setValue', "changed value", true);
。有关更多详细信息,请参阅我的 jsfiddle 代码:http://jsfiddle.net/smvora_4u/epf7frz4/
【讨论】:
以上是关于x 动态上的可编辑值更改不起作用的主要内容,如果未能解决你的问题,请参考以下文章