标签: x-editable

X可编辑选择从MVC控制器加载的值

我在使用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)

asp.net-mvc jquery json x-editable

5
推荐指数
1
解决办法
3642
查看次数

动态字段上的jQuery x-editable插件?

我制作了一个脚本,可以在点击按钮时添加动态输入,并使用相应的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)

jquery input dynamic x-editable

5
推荐指数
1
解决办法
5192
查看次数

是否可以提交隐藏字段并使用x-editable控制其值?

在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)

hidden field submit x-editable

5
推荐指数
1
解决办法
1858
查看次数

对新添加的td应用x-editable

我有一个字段表,我可以通过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)

jquery edit-in-place django-templates x-editable

5
推荐指数
1
解决办法
6113
查看次数

x-editable,如何在字符串为空时显示特定值?

我试图在字段为空或空(字符串)时显示默认值,并使用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),则不会显示数据值.我想知道如果字符串为空(例如,除了它为空)之外还有一种方法仍然显示默认数据值.

javascript x-editable

5
推荐指数
1
解决办法
6118
查看次数

为什么x-editable-rails gem抛出一个错误:未定义的方法`xeditable?'?

我安装了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)

ruby methods ruby-on-rails x-editable

5
推荐指数
1
解决办法
1619
查看次数

X-Editable:将事件附加到数据更改

如何将事件附加到使用XEditable完成的字段中的任何数据更改?如果没有,是否有任何其他插件允许这种行为?

jquery x-editable

5
推荐指数
2
解决办法
1万
查看次数

为x-editable字段取十进制输入

我正在使用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相当新.

jquery twitter-bootstrap x-editable

5
推荐指数
1
解决办法
8913
查看次数

在Bootstrap X-editable中添加加载程序图像/文本

在发出更新请求时,如何将加载程序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)

html ajax jquery twitter-bootstrap x-editable

5
推荐指数
1
解决办法
1429
查看次数

带有角度JS的可编辑文本就像普通链接一样

你能帮助我在这里做错吗?

我使用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)

javascript angularjs x-editable

5
推荐指数
1
解决办法
1093
查看次数