I am using Extjs 4.2.1 with RowEditing plugin. I need to change the decimal separator from "." for ",". I used this code in the render event Viewport
Ext.util.Format.thousandSeparator = '.';
Ext.util.Format.decimalSeparator = ',';
Still in the grid to edit the column with the decimal separator NumberField editor continues with "." instead of the ",".
How to change decimal separator in RowEditing plugin?
I thought something like this link
Decimal precision in an EXTJS grid
Follow the column definition:
{
text : "Valor unitário",
dataIndex : 'valorUnitario',
flex : 1,
align : 'right',
menuDisabled : true,
editor : {
xtype : 'numberfield',
allowBlank : false,
minValue : 0,
forcePrecision : true,
decimalSeperator : ','
},
renderer : Ext.util.Format.numberRenderer('0.000,00')
}
it was a typo, sorry my mistake. Now is working perfectly
Related
I have a strange issue with jQuery ui-sortable. In my example I have multiple columns and in each column I have multiple sortable items.
I want to drag and drop in any column, sorting within one column is no problem.
I have two problems:
When dragging from one column to another column I need the destination column to auto scroll to the bottom.
Horizontal scroll does not auto scroll for the column on the very right side.
See my example
https://jsfiddle.net/maidanhcongtu/9ws2unLa/11/
var configuration2 = {
cursor : 'move',
placeholder : 'highlight',
dropOnEmpty : true,
connectWith : ".connectedSortable",
containment : "body",
};
$(".connectedSortable").sortable(configuration2).disableSelection();
Okay, I have found a solution to disable scrolling when you're no longer sorting in the original parent, so that the sortable item does not scroll the parent when dragging over another sortable.
I also made the sortable list you're sorting over auto scroll to the bottom.
Sorry, I changed your code up a bit because it's easier for me to keep track of things this way.
Also, I added ID's to each sortable list.
see updated fiddle: https://jsfiddle.net/Souleste/ktxeu35p/46/
$('li').addClass('item');
var y;
var og;
var n, nB, half;
$(".connectedSortable").sortable({
cursor : 'move',
placeholder : 'highlight',
dropOnEmpty : true,
connectWith : ".connectedSortable",
containment : "body",
items: '.item',
start: function(event,ui) {
og = $(this).closest('.connectedSortable');
},
over: function(event,ui) {
n = $(this).closest('.connectedSortable');
nB = n.outerHeight(true) + n.position().top;
half = nB / 2;
},
sort: function(event,ui) {
console.log(half);
if ( n.attr('id') != og.attr('id') ) {
og.sortable( "option", "scroll", false );
if (event.pageY > half) {
n.scrollTop(n.scrollTop() + 5);
} else if (event.pageY < half) {
n.scrollTop(n.scrollTop() - 5);
}
} else {
og.sortable( "option", "scroll", true );
}
}
});
I am trying to put button with fieldLebel. Both are coming fine but fieldLabel appearing on top of Button. How to make it horizontal alignment.
My code :
var dButton = new Ext.SplitButton({
text: "Before",
id:"B4"
fieldLabel: "Expiry Date",
width : 150,
scope: this,
labelAlign:'left',
disabled : false
}
I am trying to achieve by style but no luck.
Try to use the labelStyle property inside your SplitButton config.
I am using jQgrid version 4.6.0 (Free version) and trying to edit the height of textbox which gets rendered when we set editable: true in Column model. I want the textbox height to fit into complete grid cell.
Here the width of rendered textbox is fine and fits in the cell but how can I increase the height of textbox?
Trying to achieve:-
There are some trick which you can use. You can editoptions in the column defined something like
editoptions: { style: "height:40px;" }
It will set style attribute on the textbox creating during editing. I think that the trick will work for any editing mode which you will use.
UPDATED: One can do the following in case of usage cell editing:
afterEditCell: function (rowid, cellname, value, iRow, iCol) {
var tr = this.rows[iRow], h = $(tr).height(),
$input = $(tr.cells[iCol]).find("input"),
delta = $input.outerHeight() - $input.height();
$input.height(h - delta);
}
Inside of the most callbacks this will be initialized to the DOM of the <table> element (see here), which supports rows property to quick access to the row by rowIndex and the row (<tr>) supports cells array which can be used to get the cell by cell index. The rest of the code should be clear I hope.
Has anyone managed to create a button in TinyMCE 4 that will increment the font size of the selected text by, say, 1px?
The problem I'm having is getting ahold of the selected text, whether it's in a span already or not.
I'm willing to modify the TinyMCE source.
Thanks for any ideas.
You don't need to modify the source code, you can create a plugin.
Here is the documentation of how to create a plugin for TinyMCE:
http://www.tinymce.com/wiki.php/Tutorials:Creating_a_plugin
based on that you can create your own button (see working example)
here is part of the code:
var currentFontSize = new Number($(tinyMCE.activeEditor.selection.getNode()).css('font-size').replace('px','')); //remove the px part
currentFontSize = currentFontSize + 1; //increase font by one
tinymce.activeEditor.formatter.register('mycustomformat', {
inline : 'span',
styles : {'font-size' : currentFontSize + 'px'} //this is the font size incremented by one
});
tinymce.activeEditor.formatter.apply('mycustomformat'); //apply the format to the selected text
I have a grid panel in ExtJS 4 with the following features:
extend : 'Ext.grid.Panel',
multiSelect: true,
alias : 'widget.negativeMoviesView',
frame : true,
autoScroll : true,
height: 690,
renderTo: Ext.getBody(),
store : 'NegativeMovieStore',
columns : [{
header : 'Name',
dataIndex : 'name',
flex : 1
}]
multiSelect is set to true, and if I check in firebug it is in fact true and the selectionMode is MULTI, however it only allows me to select one row at a time. What am I doing wrong?
As sha pointed out. The multiSelect option only enables the grid to have multiple selections by making use of the Shift or Ctrl keys to select a batch or add to the selection in the same way a native application allows.
If you are looking for single click to add/remove from the selection you can use the simpleSelect or selModel property to achieve this.
This will enable single click to add/remove from the selection
simpleSelect: true
This will render an extra column which will let you check the rows you wish to select.
selModel: Ext.create('Ext.selection.CheckboxModel')
Demo for ExtJs 4.0
Demo for ExtJs 4.1