JQuery TokenInput searches for spaces - jquery-tokeninput

I am using JQuery TokenInput instead of auto search. If I press space bar multiple times, then by using back space, remove all spaces and in result it shows me a list which contains all values of that field.
How can I restrict on search for spaces?
I written like this:
$("#org_id").tokenInput("/org/search_org_by_token_input.json",{
crossDomain: false,
tokenLimit: 1,
minChars:1,
theme: 'facebook',
});

You would need to go in to the library code, and modify the .keydown part of var input_box. (Line 276 in my version.)
There is a huge switch statement which deals with all the special keys, you'll want to add a case for KEY.SPACE. (It's already included in the enum, so you can just use that option straight off.)
If you just want to ignore all spaces altogether, then you could add something like the following. If you're looking for different functionality (such as only ignoring spaces as a first input character) then obviously you'll need to develop it further)
case KEY.SPACE:
event.stopPropagation();
event.preventDefault();
break;
The above is only theoretical/untested and may need debugging!

Related

How to select from a selection box with a variable in the name?

I am having trouble using selecting from this select element.
<select name="vehicle_attrs[position_count]" class="mb1"><option>Position / Quantity</option><option>Front</option><option>Rear</option></select>
I have tried
select('Front', :from=>'mb1')
select('Front', :from=>'vehicle_attrs[position_count]')
select('Front', :from=>'vehicle_attrs[1]')
All of them result in a can not find selection box error
I've never liked how restrictive Capybara's concept of a 'locator' is (i.e. must have a name/id/label), but if you dig into the source code, those helpful methods like select, click_on, and fill_in are just wrappers for find and some native method of Element, which takes arbitrary CSS, and works in almost all situations. In this case, you could use:
find('[name="vehicle_attrs[position_count]"]').find('option', text: 'Front').select_option
Since dropdowns often have multiple similar options, where one is a substring of the other, you might consider using an exact string match, like
find('[name="vehicle_attrs[position_count]"]').find('option', text: /\AFront\z/).select_option
From the docs for select - https://www.rubydoc.info/github/teamcapybara/capybara/Capybara/Node/Actions#select-instance_method - we can see that the from option takes "The id, Capybara.test_id atrtribute, name or label of the select box".
Neither 'mb1' or 'vehicle_attrs[1]' are any of those so they would be expected to fail.
'vehicle_attrs[position_count]' is the name so assuming the box is actually visible on the page (not replaced with a JS driven select widget, etc), that should work. If it doesn't, then edit your question and add the full exact error message you get when trying to use it. Of course if there is only one select box on the page with an option of 'Front' then you don't need to specify the from option at all and can just do
select 'Front'

How to add auto-complete Sublime Text 3

I would like to add custom auto-complete key bindings much like built-in:
Example: html+tab auto-completes the Doctype Block.
I tried adding html custom key binding: type c + o + l + tab to generate <div class="col-">
Preferences > Key Bindings > Default (OSX).sublime-keymap -- User
{"keys": ["c+o+l+tab"], "command": "insert_snippet", "args": {"contents": "<div class=\"col-$0\">"}},
However, two issues:
the new key binding overrides all other auto completes
the initial col or characters remains in front of the
generated tag. col<div class="col-">
What is the correct way to add this type of key binding?
The correct way to do something like this is to use either snippets or completions. Although there are some differences, generally speaking they both work the same way in the end, and which one you choose depends on how many such items you want to create and how complex you want them to be.
Using a snippet, you would select Tools > Developer > New Snippet... from the menu and fill out the snippet template, then save it as a sublime-snippet file in the location that Sublime defaults to (which is your User package).
For example, that might look like the following based on the example in your question:
<snippet>
<content><![CDATA[
<div class="col-$0">
]]></content>
<description>Insert DIV with column class</description>
<tabTrigger>col</tabTrigger>
<scope>text.html</scope>
</snippet>
Snippets are XML formatted, and everything between ![CDATA[ and ]] is inserted into the buffer (don't remove the CDATA even if you think you don't need it; Sublime will ignore the snippet if you do).
The tabTrigger specifies the text that you want to be the trigger for the snippet, the scope says what sort of files the snippet should trigger in, and the description will be displayed next to the snippet in the auto-completions panel.
In a snippet, the tabTrigger, scope and description are all optional. If you don't specify a tabTrigger you can only expand the snippet from the Command Palette or via the insert_snippet command (for example in a key binding). Without a scope the snippet applies everywhere, and without description it has no description in the panel.
If you have many such items that you want to add snippets for, you can also use completions instead. These are stored in JSON files with an extension of sublime-completions and should be saved in your User package (use Preferences > Browse Packages... if you don't know where that is.
An example of such a file would be:
{
"scope": "text.html",
"completions": [
{ "trigger": "col\tInsert DIV with column class", "contents": "<div class=\"col-$0\">" },
]
}
In this format, the trigger is always the text to trigger and the description (still optional) is separated from the trigger by a \t character in the trigger key.
In completions you only specify the scope once at the top instead of every time, but there are some functional differences between completions and snippets.
There can only be one snippet per sublime-snippet file, but a sublime-completions file can contain many completions in a single file; the completions key is an array so you can place more than one completion in the same file.
Completions are JSON, so contents that are multi line or contain JSON specific characters such as a " character are harder to enter; completions are better for shorter sequences while snippets are better for more complex things.
When autocomplete triggers, if there is a completion and a snippet that could be autocompleted, snipptets always "win" and are inserted, whereas completions cycle. That means that for example in this particular example you need to press Tab twice because col is also the name of a tag.
Snippets automatically appear in the command palette (when they apply) but completions do not. In the command palette, Snippets appear as commands like Snippet: Something, where Something is the description if it exists and the name of the file if it does not.
In either case, you can make the snippet/completion apply only in certain types of files by applying a scope; to determine the appropriate scope, position the cursor in a file at the appropriate place and select Tools > Developer > Show Scope Name...; the more of the displayed scope you use the more specific it becomes. Generally just the top level such as text.html is all that's needed unless you're doing something special.

Error-labels of q-field (in combination with q-input) when using Quasar Framework

I have two questions regarding error-labels of q-field (in combination with q-input) when using Quasar Framework:
When the error-label shows it moves the button below it further
down. How can I solve this?
When used in combination with vuelidate (as recommended for
validation) I would like to show the applicable validation error(s).
So instead of just showing: error-label="Please type a valid name" I would like to show the (multiple) actual validation errors vuelidate
finds, so e.g. more in line with: "Name must be longer then 4
characters and no numericals". How would I do that using the
error-label quasar provides?
Try <q-component :content-css="{minWidth: '80vw', minHeight:
'80vh'}"> (you should set a minimum width and/or height to avoid
this behavior)
Check this: http://forum.quasar-framework.org/topic/2263/dynamic-error-message/4

Sublime Text 2, faster alternative to find and replace regex?

$_POST['daily_limit'];
$whatever = $_POST['smoke'];
$_POST['soup'] + $_POST['cake'];
to
$this->input->post('daily_limit');
$whatever = $this->input->post('smoke');
$this->input->post('soup') + $this->input->post('cake');
In this example, is there any faster way to switch from $_POST[] to $this->input->post() without writing up a regular expression find and replace? I don't care if it takes multiple steps. Writing the regex for this (find: \$_POST\[(.*?)\] replace: \$this->input->post\($1\)) takes longer than changing them all manually (maybe I'm just not good at regex). Any ideas?
I'm making a brash assumption here, that you have only one variable within each pair of brackets and that the variables only contain alphanumeric characters. ['soup'+'bacon'] will break this trick, as will ['soup-with-bacon'].
With your cursor, highlight an instance of $_POST[ - nothing else.
Hit Alt+F3 if you're on Windows/Linux (Cmd+ShiftG in Mac?)
Try to scroll through and see if everything that's selected is everything you want to replace.
Type $this->input->post( - nothing else.
Press → to move all cursors to the right of the first quote.
Press Ctrl+→ (this is the only remotely wtfh4xxy part of the process, and only if you're not used to navigating by word with the cursor) to navigate over the variable.
Press → twice to move all cursors to the right of the next quote.
Replace the ]with a ).
#nnnn I did a variation of your version to remove the wtfh4xxy part.
select:$_POST
altf3
type: $this->input->post(
ctrlshiftm
ctrlx
ctrlshiftm
ctrlv
type: )
Sublime text ftw!

Deleting entire function definition in Vim

I've been trying Vim for any text editing work for almost a week now. I want to know the fastest way to select a C function definition.
For example, if I have a function like this:
void helloworlds( int num )
{
int n;
for ( n = 0; n < num; ++n ) {
printf( "Hello World!\n" );
}
}
How would I be able to delete the whole definition including the function name?
As is common in Vim, there are a bunch of ways!
Note that the first two solutions depend on an absence of blank lines.
If your cursor is on the line with the function name, try d}. It will delete everything to the next block (i.e. your function body).
Within the function body itself, dap will delete the 'paragraph'.
You can delete a curly brace block with da}. (If you like this syntax, I recommend Tim Pope's fantastic surround.vim, which adds more features with a similar feel).
You could also try using regular expressions to delete until the next far left-indented closing curly brace: d/^}Enter
]] and [[ move to the next/previous first-column curly brace (equivalent to using / and ? with that regex I mentioned above. Combine with the d motion, and you acheive the same effect. In addons like Python-mode, these operators are redefined to mean exactly what you're looking for: move from function to function.
How to delete the whole block, header included
If you're on the header/name, or the line before the block, da} should do the trick.
If you're below a block, you can also make use of the handy 'offset' feature of a Vim search. d?^{?-1 will delete backwards to one line before the first occurrence of a first-column opening curly brace. This command's a bit tricky to type. Maybe you could make a <leader> shortcut out of it.
Plugins
I don't do much C programming in Vim, but there are surely plugins to help with such a thing. Try Vim Scripts or their mirror at GitHub.
To delete an entire function, including its definition, such as:
function tick() {
// ...
}
Move to the line with the function name.
Move the cursor to the opening brace, f{ should do it, or simply $.
Press V%d (Visual line, move to matching pair, delete)
If your functions look like this:
function tick()
{
// ...
}
Move to the line with the function name.
Press J (join the current line with line bellow. This also puts your cursor at the last character on the resulting line, {, just the one we need for the next command.)
Press V%d (Visual line, move to matching pair, delete.)
or
Move to the line with the function name.
Press V[Down]%d (Visual line, move one line down, move to matching pair, delete.)
If you are willing to install plugins vim-textobj-function will give you vif for Visual select Inside Function and vaf for Visual select A Function.
daf will delete the function, both the line with the signature and the function body ({})
The text object defined by this plugin are more specific and they don't rely on the function body being a contiguous block of text or { being placed at the first character on the line.
The drawback is that you depend on an external plugin.
You can use this shortcut to delete not only the function, also the lines between curly braces, i.e the code between if-else statements,while,for loops ,etc.
Press Shitf + v [Will get you in visual Mode] at the curly brace start/end.
Then Press ] + } i.e ] + Shitf ] - If you are in start brace.
Then Press [ + { i.e [ + Shitf [ - If you are in end brace.
Then DEL to delete the lines selected.
The simplest and most direct way way is as follows (works anywhere inside function):
v enter visual mode
{ move to first brace in function (may have to press more than once)
o exchange cursor from top to bottom of selection
} extend selection to bottom of function
d delete selected text
The complete command sequence would be v{o}d. Note that you can do other operations besides delete the same way. For example, to copy the function, use y (yank) instead of d.
Use this simple way
1.Go to the function definition
2.dd - delete function definition
3.d -start delete operation
4.shift+5(%) - delete the lines between { to }
If your function were separated by the blank lines, just type:
dip
which means "delete inner paragraph".
Another way is to go to the line of the start of your function and hit: Vj% (or V%% if your style puts the opening brace on the same line). This puts you into Visual-Line mode and the percent takes you to the matching closing brace. In the second style, the first % takes you to the opening brace on the line that you selected and the second to its matching closing brace.
Also works for parentheses, brackets, C-style multi-line comments and preprocessor directives.
See the manual for more info.
Pre-condition: be somewhere inside the function.
Go to the previous closing curly bracket on the first line using
[]
Then delete down to the next closing curly bracket on the first line using
d][
Most posted methods have a downside or two. Usually, when working withing a class definition of some object oriented language, you might not have an empty line after the function body, because many code formatters put the closing braces of last method and class on consecutive lines. Also, you might have annotations on top of the function. To make matters worse, there might be empty lines within your function body. Additionally you'd prefer a method that works with the cursor anywhere within the function, because having to move it to a specific line or worse, character, takes valuable time. Imagine something like
public class Test {
/* ... */
#Test
public void testStuff() {
// given
doSetup();
// when
doSomething();
// then
assertSomething();
}
}
In this scenario, vap won't do you any good, since it stops at the first empty line within your function. v{o} is out for the same reason. va{V is better but doesn't catch the annotation on top of the method. So what I would do in the most general case is va{o{. va{ selects the whole function body (caveat: if your cursor is within a nested block, for instance an inner if statement, then you'll only get that block), o puts the cursor to the beginning of the selection and { selects the whole paragraph prepending your selection. This means you'll get the function definition, all annotations and doc comments.
the most easy way I found is:
Get to the line where the function starts and do this: ^^vf{% to mark the entire function and then whatever you like.
^^ - start of the line
v - start visual mode
f - jump to the next search character
{ - this is the search character
% - jump to the closing brackets
This is also very logical after you have used it a few times.
non-visual way:
d/^}/e
... delete by searching for } at line beining, including it for deletion.
without /e (not mentioned in above answers), solution is incomplete.
with /e - searching goes to end of match, so closing bracket is included, and command is well for yanking too:
y/^}/e
if you use neovim version :>0.5
the modern way is to use treesitter and build your model, then you can be selected or yanked or deleted...
Tree-sitter is a parser generator tool and an incremental parsing library. It can build a concrete syntax tree for a source file and efficiently update the syntax tree as the source file is edited
I suggested this video on youtube to learn how to use treesitter to build your model : Let's create a Neovim plugin using Treesitter and Lua
I tried all the top answers here, but none of them works except the one by Nick which suggests to press f{ to get to the opening curly brace. Then V%d to delete the whole function.
Note that, the whole function gets yanked, so you can paste it elsewhere. I come across this use-case frequently, especially when moving if blocks inside another.
I use this map. It work for me
"delete function definition
"only support function body surround by {}
nnoremap <LEADER>df {v/{<cr>%d