我在使用x editable插件从服务器加载选择选项时遇到问题.选择选项中的数据显示为[对象对象]而不是实际选项.这是我的代码:
<a href="#" id ="status" data-name="group" data-type="select" data-source='@Url.Action("ProductGroups")' data-value="1" class="editable-click" title="Group">Operator</a>
Run Code Online (Sandbox Code Playgroud)
ProductGroups操作从控制器返回以下格式[{"value":1,"text":"Default"}]的 JSON响应.在控制器中,我正在这样做.
public JsonResult ProductGroups()
{
var list = new List<xEditableItem>();
foreach (var item in db.ProductGroups.ToList<ProductGroup>().OrderBy(r=> r.Name))
{
list.Add(new xEditableItem() { value = item.ID, text = item.Name });
}
return Json(list, JsonRequestBehavior.AllowGet);
}
public class xEditableItem { public int value {get;set;} public string text {get;set;} }
Run Code Online (Sandbox Code Playgroud)
我事件尝试手动传递选择选项,但结果是选择列表中的相同[对象对象].
<a href="#" id ="status" data-name="group" data-type="select" data-source='[{"value":1,"text":"Default"}]' data-value="1" class="editable-click" title="Group">Operator</a>
Run Code Online (Sandbox Code Playgroud) 我制作了一个脚本,可以在点击按钮时添加动态输入,并使用相应的x按钮删除不需要的输入.我需要在每个新创建的动态输入上添加x-editable插件.我正在使用x-editable,以这种方式,在x-editable弹出窗口中的选定选项上,右侧的输入获得与所选选项对应的值.
我已经使用静态元素进行了这项工作,但是使用动态元素我有很大的问题.首先,与所有html结构一起,使用其类名+动态字段数生成所有动态元素的类.确切地说,我正在使用配置的Fieldcount执行此操作:var FieldCount = 1;然后在生成html代码的部分中添加类似的内容class="privacy-dynamic'+ FieldCount +'".然后第一个动态元素在html代码中调用类privacy-dynamic2,第二个获取privacy-dynamic3,依此类推.
现在,我的第一个结论是我需要以某种方式为x-editable添加一个类似的选项,其中我将创建一个相同的脚本, + FieldCount +因此每个x-editable弹出窗口将对应于从左边的"结果输入"而不是一个弹出窗口所有动态输入.
我尝试以与生成html结构相同的方式生成x-editable脚本,但它没有用.傻傻的尝试,我知道,用脚本生成脚本,但我很绝望.
我真的不知道它是如何解决的,我是一个jquery菜鸟,我迷失了它.它能以某种方式解决吗?
下面是当前情况,其中第一个静态字段具有x-editable working,而动态字段具有相同的结构,可用于x-editable但没有脚本:http://jsfiddle.net/dzorz/QxMs7/
HTML:
<div class="container">
<input type="text" class="main_activity" id="main_activity" name="main_activity" placeholder="Main activity">
<div class="parentToDelegate">
<a href="#" id="privacy" class="privacy" data-type="select" data-pk="1" data-value="1" data-original-title="Select visibility">public</a>
<input type="text" id="privacy_result" class="privacy_result" value="1"/>
</div>
<div class="row">
<div id="InputsWrapper">
</div>
</div>
<div class="row">
<span id="AddMoreBox" class="btn btn-info pull-right"><i class="icon-plus"></i>Add More</span>
</div>
Run Code Online (Sandbox Code Playgroud)
脚本:
//x-editable
$('.privacy').editable({
showbuttons: …Run Code Online (Sandbox Code Playgroud) 在X-editable的文档中,我们可以创建一个新记录,但是如何编辑现有记录,并将其名称和电子邮件字段以及它的id = 1(此ID未更改)发布到后端?
<table>
<thead><th>id</th><th>name</th><td>email</th></thead>
<tbody?
<tr><td><span>1</span></td><td><span class='myeditable'>name</span></td><td><span class='myeditable'>email@example.com</span></td></tr>
</tbody>
</table>
$('.myeditable').editable({
type: input,
url: '/edituser'
});
$('#save-btn').click(function() {
$('.myeditable').editable('submit', {
url: '/edituser',
ajaxOptions: {
dataType: 'json' //assuming json response
},
success: function(data, config) {
if(data && data.id) { //record created, response like {"id": 2}
},
error: function(errors) {
}
});
});
Run Code Online (Sandbox Code Playgroud) 我有一个字段表,我可以通过JQuery动态添加表数据.问题是我添加的元素没有我为该组td设置的属性,直到我重新加载整个页面,我不知道必须触发什么才能采取新的操作.
这是我的代码:
#js file
function add_task() {
task_name = $("#task-name").val();
due_date = $("#task-due_date").val();
var new_task = $.ajax({
url: "/add_task/",
data: "task="+task_name+"&due_date="+due_date,
success: function(task_id){
get_task(task_id);
}
});
}
function get_task(task_id) {
$.ajax({
url: "/get_task/"+task_id+"/", //get the html from single_task.html
success: function(result){
$('#container').append(result);
$('#task-'+task_id).fadeIn(500);
}
});
}
#single_task.html
<tr id="task-{{task.id}}">
<td><div id="task">
<a href="#" data-type="text" data-pk="{{task.id}}" data- url="/update_task/{{task.id}}/" data-title="Enter task">{{ task.task }}</a>
</div></td>
<td>{{ task.initialized_at|age }}</td>
<td>{{ task.due_date }}</td>
<td>{{ task.done }}</td>
<td><button onclick="delete_task('{{task.id}}');" class="btn"> X </button></td>
Run Code Online (Sandbox Code Playgroud)
#index.html //place where to load …Run Code Online (Sandbox Code Playgroud) 我试图在字段为空或空(字符串)时显示默认值,并使用x-editable禁用编辑模式.当字段或字符串为null时,使用属性"data-value"可以很好地工作,例如:
<b><a id="location_name" data-type="text" data-title="Location name" data-placeholder="Location" data-emptytext="Location" data-value="Location">@Model.geoLocation.location_name</a></b> <br />
Run Code Online (Sandbox Code Playgroud)
但是,如果字符串为空(但不为null),则不会显示数据值.我想知道如果字符串为空(例如,除了它为空)之外还有一种方法仍然显示默认数据值.
我安装了gem x-editable for rails:
# x-editable
gem 'x-editable-rails'
Run Code Online (Sandbox Code Playgroud)
我将方法添加xeditable?到ActionController:
# Add a helper method to your controllers to indicate if x-editable should be enabled.
def xeditable?
true # Or something like current_user.xeditable?
end
Run Code Online (Sandbox Code Playgroud)
但仍然出现错误:
ActionView::Template::Error (undefined method `xeditable?' for #<#<Class:0x007f9012e30f68>:0x007f9012ee9e78>):
14:
15: .panel-body
16: /a.doc_title.editable id='doc_title_12345' data-name="doc[title]" data-title="Enter doc title" data-type="text" data-url='/docs/12345' href='#doc_title_12345' = doc.title
17: = editable doc, :title
18:
app/views/docs/_single_doc_in_accordion.html.slim:17:in `_app_views_docs__single_doc_in_accordion_html_slim__2506304306156466629_70128411437560'
app/views/docs/index.html.slim:52:in `_app_views_docs_index_html_slim___3263534966956214695_70128384677640'
Run Code Online (Sandbox Code Playgroud)
我应该在哪里定义方法xeditable?以便它开始工作?
这是application_controller.rb:
class ApplicationController < ActionController::Base …Run Code Online (Sandbox Code Playgroud) 如何将事件附加到使用XEditable完成的字段中的任何数据更改?如果没有,是否有任何其他插件允许这种行为?
我正在使用x-editable和bootstrap
我定义了以下html字段
<div class="form-group">
<label class="col-sm-4">Service Charges(%)</label>
<div class="col-sm-6 hoverEdit">
<a class="editableAccount" id="serviceTax"></a>
</div>
</div>
Run Code Online (Sandbox Code Playgroud)
我定义了以下脚本以使该字段可编辑
$('.editableAccount').editable({
type : 'number',
title : 'Enter New Value',
success : function(response, newValue) {
updateAccount(this.id, newValue);
}
});
Run Code Online (Sandbox Code Playgroud)
现在,当我尝试编辑字段并输入小数值时,我得到了这个

我想使这个字段可编辑,以便我可以输入十进制值.我在文档上看不到任何帮助.有人请在这里帮助我,我对html和javascript相当新.
在发出更新请求时,如何将加载程序gif放入X-editable?
这是我的代码:
$(document).ready(function() {
$('#username').editable();
});
<a href="#" id="username">superuser</a>
$('#username').editable({
type: 'text',
pk: 1,
url: '/post',
title: 'Enter username'
});
Run Code Online (Sandbox Code Playgroud) 你能帮助我在这里做错吗?
我使用xeditable和angular在我的一个表单中实现了一个带有角度js的可编辑标签,但奇怪的是可编辑标签就像一个普通的链接,我按照这个文档
https://vitalets.github.io/angular-xeditable/
这是我的相关HTML代码
<a href="#" editable-text="user.name">{{ user.name || "empty" }}</a>
Run Code Online (Sandbox Code Playgroud)
我插入角度js控制器和一切,我得到没有错误只是它像一个普通的链接.
编辑我的app.js看起来像
'use strict';
var App = angular.module('myApp', [
'ngResource',
'ngRoute',
'ngFileUpload',
'angularBootstrapNavTree',
'ngAnimate',
'angularUtils.directives.dirPagination',
"checklist-model",
'xeditable'
]);
//comment
App.config(['$routeProvider','paginationTemplateProvider', function($routeProvider,paginationTemplateProvider) {
......
}]);
App.run(['$rootScope','$location','$routeParams','$http','Attribut','Categorie','SsCategorieofcategorie','Produit','ConfigCategorie','editableOptions', function($rootScope, $location, $routeParams, $http, Attribut, Categorie,SsCategorieofcategorie,Produit,ConfigCategorie,editableOptions) {
editableOptions.theme = 'bs3';
........
}]);Run Code Online (Sandbox Code Playgroud)
而我的控制器:
'var strict';
App.controller('GenerationContenuController',['$scope', '$http','$interval','GenerationContenu','InputText','$timeout', function($scope, $http,$interval,GenerationContenu,InputText ,$timeout){
var self=this;
$scope.user = {
name: 'awesome user'
};
...
}]);Run Code Online (Sandbox Code Playgroud)
最后是html
<form id="msform" ng-controller="GenerationContenuController as ctrl" editable-form>
<!-- progressbar -->
<ul id="progressbar">
<li …Run Code Online (Sandbox Code Playgroud)x-editable ×10
jquery ×6
javascript ×2
ajax ×1
angularjs ×1
asp.net-mvc ×1
dynamic ×1
field ×1
hidden ×1
html ×1
input ×1
json ×1
methods ×1
ruby ×1
submit ×1