We Keep Coding

How to resolve unicode issue with javascript length?

I have angular tooltip for character counter but here i am facing some issues when user copy paste text and add some ascii characters that are not aligned with the java and orcale length when we post the data to the backend, Lets say if user have # in the text it will count lenght as 1 but backend side it will count as 4 because of the way oracle and java works with bytes.
So i am trying to resolve two issues.
1- when i paste text it character counter should count same unicode as java ?
2- It should not remove characters from the text ?
main.html
<textarea rows="2" class="form-control"
ng-model="processDTO.processStatementText"
name="processStatement" id="processStatement"
placeholder="Process Statement" maxlength="4000" required
data-tooltip-html-unsafe="<div>{{4000 - processDTO.processStatementText.length}} characters left</div>"
tooltip-trigger="{{{true: 'focus', false: 'never'}[processDTO.processStatementText.length >= 0 || processDTO.processStatementText.length == null ]}}"
tooltip-placement="top" tooltip-class="bluefill">
</textarea>
main.txt
2. Upload Template Header – Risk Causal and Impact comments are color coded as mandatory but they are optional. Similary the Originating Source System Process/Risk/control ID
3. In the upload template, for any of the multi value fields, I use an invalid delimiter ‘:’, Eg: 13:7 , for some reason this changes the cell format to time format and thereafter I am not able to give any single values, its always converted to time format. Not sure if this is a training issue, but want to put it on the table to see if it requires any fix at all
4. In Upload, for the grid field length validations, the filter doesn’t works on Row Number and Max Allowed columns. ~!##$%^&*()_+|}{:"?><,./';[]\=-0987654321`
5. ERH All levels added in the View End to End ERH screen – Sort and Filter doesn’t works, After clicking on this field, none of the other filter/sort works on the page. Also the sort indicator(black triangle) is not visible, I believe the column width needs to be adjusted.
6. The Risk/Control reference id is seen on the Process Search grids, but when I search by Risk/Control, I don’t see the corresponding control/risk grid having the ref id column however tool tip has it
7. The label change “Originating Source System Process/Risk/Control ID”"

Simplest way to filter a table with js

I have here a website I work at, and I have tried something like:
$(".camera").parent().hide();
$(".treicamere").parent().hide();
To display only apartments with 2 rooms. I know its not the best way to do that, so I'm wondering if there's a better way to sort them. Website is made in Wordpress and heres a link. You can inspect element to check formatting:
http://www.sudpark.ro/apartamente/disponibilitate/

This is gonna be nasty. You ready ? :)
First, give each p -the ones you use as buttons- same class e.g. p_camera. Then add them a custom attr to get the index of them like : data-index="1". After that youre set. This is your click function for filtering.
$("p.p_camera").on("click", function(){
$("#my-table tr").not(".cf").not(":has(td[colspan=10])").hide()
.find("td:eq(1):contains('"+ $(this).attr("data-index") +"')").parent().show();
});
FIDDLE
I can explain anything if there's something you dont understand

Since this is a Wordpress site, you may consider using a table plugin that does exactly that, like Tabulizer for Wordpress that will allow you to filter your table rows based on column values. You can add search filter on specific columns, with different types of search filters (input box, select box) and search methods (contains, exact match, starts with, numeric range,etc) Here some ideas:
Create a column filter for the number of rooms. The visitor will
select from a drop-down list the desired number of rooms
(Nr.Camere). Same with number of balconies.
Create a column filter for the square meters. The visitor can find all apartments greater than 50 square meterr, less than 100 square meters or between 50 and 100 square meters.
You can also combine filtering with sorting controls.
Here is a demo http://www.tabulizer.com/index.php/support-menu/tabulizer-tips/63-sort-second-row

Getting start and end of selected text from tinyMCE

I have configured the tinyMCE editor with a custom context menu. When I right-click on any word in the editor, the chosen word gets highlighted. I am able to get the selected text with editor.selection.getContent().
How do I get the start and end points of the selected text within the entire text that is currently in the tinyMCE editor? I tried editor.selection.getStart() and getEnd(), but that has not yielded enough results.
My task is to take the start and end indices and get the previous word with it. I am currently using tinymce-3.5.10.

You will need to use
var range = editor.selection.getRng()
to get a range. You can get the start- and end-container using
range.startContainer
range.endContainer

Div Inner Text Selection using Javascript (with keyboard?)

My goal is to create a caret browsing extension in google chrome. I have hit a wall with text selection. I've found that I can select the contents of a div:
range = document.createRange();
referenceNode = document.getElementsByTagName("div").item(0);
range.selectNode(referenceNode);
I can also select child elements using range.setStart(referenceNode,offest) and range.setEnd(referenceNode,offset) where offset is the number of child nodes to skip/include in the selection.
Unfortunately, I have no idea how to select individual characters within a div. This behavior is, ofcourse, available for textareas and input textfields. I'm hoping for a legit javascript solution that I missed, but a hack-around suggestion using DOM manipulation of one form or another is also acceptable.
It is important that the solution allow for caret-browsing like behavior. For example, given the starting position as an offset from some location, and the ending position as an offset from the same location, display the selection in position on the screen and allow for copying the selection.
Thank you for your time.
Best Regards,
Lotus

I don't know if this is hack or not but it is working.
(I just made that) Try demo: http://derek1906.site50.net/experiment/selection/
You can put a <span></span> around the individual characters that you want to select and then you just select the <span> and Wa-la, you selected the words you want!

Table header sorting changes the position of rows

I have an html table like this below:
name number contractid
sebastian 01 aea123
sab 02 aea534
jack 03 are152
My problem is when I click on the name the name column is sorting in alphabetical order and the position of rows is same its fine. But when I click on the column again the rows change their position, like below. (The first row will be moved to the empty space and second row is moved to first place.)
name number contractid
sebastian 01 aea123
sab 02 aea534
jack 03 are152
Is there any solution for reducing this change in position? Any CSS and Javascript properties I can do/set for preventing this kind of jumping?

Two options exist, either:
Remove the empty row altogether and style your Html so that the space that is getting lost is created using css. This will give you more desirable formatting along with cleaner html and you won't rely on the html.
Insert the extra row as th rather than tr as in http://jsfiddle.net/6kczk/
I'd say option one is most sane if you can get a reasonable look, since if you have no borders all you need is some extra spacing.
Given a lack of specifics, I'm just using educated guesswork here. Whether option two would work depends on the sorting code and the assumptions made. If it assumes the first row is always the column header or gets confused when it finds extra rows of headers then it will be unlikely to work.