Id like to have a smiple html textarea that when clicked (i guess onFocused) will change its rows="1" property to rows="10." I am pretty sure this can be done with javascript, but im not sure how. Any help will be much appreciated.
<textarea rows="1" onclick="this.rows = '10';"></textarea>
If you want to increase number of rows when textarea is selected by another way for e.g. tabulator you should use onfocus instead of onclick, and if you wanna decrease rows when losing focus, you should use something like this onblur="if(this.value == '') this.rows = '1';" - Because when you once type text into the textarea, and click out of it, the textarea may shrink to 1 row and your text will be not readeable. This prevents this behavior - only shrink when textarea is empty.
Related
I use codeigniter with adminre template.
I use the checkbox class "custom-checkbox" that hides the input type="checkbox" and show a box styled with css.
When I trie to pass the focus to that control with the tab key, it doesn't get the focus.
I think the problem is that the focus goes to the input element and not to the box styled.
If I put the tabindex into the span or div where the checkbox is, it receives the focus but if I press the space key to check it, it doesn't work.
Any idea will be received gratefully!
I hope my explanation is clear enough, the english is not my native language :-(
Thanks
Is there a simple way to have a default text in the textbox using jQueryUI's autocomplete ?
I have tried using data-placeholder but it doesn't seem to work.
I have searched online, and people suggest using the textbox value to display the text, and clear it on focus. But then I would need to change the font style just for the default text, and check onKeyUp when the text is manually erased etc...
Is there no easier way to do this ? or am I missing something ?
A lot of people will use a span that is positioned to be over the text box. When the text box gets focus then you hide the span. When the text box blurs and has a value, you don't show it. If it doesn't have a value then you can show it again.
You can style the span however you want independently of the text box so you would not have to change the font style on the text box itself. You would have to subscribe to the focus and blur events, but it would be much easier if you created a jQuery plugin to do this. In fact, I'm sure there are ones that already exist that do this.
For the JqueryUI tag-it widget, I'd like to completely prevent the new extra text entry field from appearing. I'm pre-populating with existing tags, and I'd just like to allow people to delete tags but not enter them.
I can make the new field read-only, but the field remains visible in IE and in both IE and Firefox clicking in the area of the widget causes the cursor to focus on that field.
What I'd like to do is get rid of the extra input field altogether.
There doesn't seem to be a tagit property for this associated with the .tagit() method. Is there something else I can do to prevent the extra field from being created?
Thanks,
doug
Try this:
$('#tagit').tagit({
//options
}).ready(function() {
$(this).find('.tagit-new').css('height', '13px').empty();
});
Using firebug we can see that the input field created by tagit is in a li element with class tagit-new. We need to set the height otherwise the tag container will squash to a slither when the last tag is deleted, and then we can empty() this to get rid of the tag input field.
I have this case where I set a current item from a list and I need to use a textarea to edit that element's value.
Because of some constraints I have to use a keyup event but I don't think that's a problem.
Check this fiddle: http://jsfiddle.net/terebentina/Euj2C/
click on first/second buttons - it works, it changes the text in the textarea to the value of each element.
change the text in the textarea to something
click on the first/second buttons again - the textarea is not updated anymore. If you look in console, you can see that it switches between the elements, it's just that the textarea is not updated anymore.
Any suggestions? this is driving me nuts!
I know there is a better way modifying your directive to do this but as a quick fix for now you can try binding your textarea to a ngModel value that is just a copy of the current text in the selected element:
<textarea keyup="" ng-model="keyupText"></textarea>
With this in as your current function:
$scope.current = function(idx) {
$scope.current_element = $scope.elements[idx];
$scope.keyupText = $scope.current_element.value;
console.log('current is', $scope.current_element.value);
}
See this fiddle for an example.
I want to make text area, where always is pre written text, and that piece of text is located at the end, and it wouldn't be possible to delete. For example, you write answer here, and at the end, right side of cursor, is text "This is end of my answer".
And when you POST it, it displays your written text and "This is end of my answer" at the end.
I know, that I can attach this text easily after posting it, but it must be displayed, and anyone could see it.
I need javascript/jQuery solution.
Thanks!
The text to the right side of the cursor, that moves as you type is really annoying and zero-usable. However, if you want something like that I would suggest putting a background image on the textarea with the text you want. It will be static and none will be able to edit it, and at the same time will always see it.
<input class="myinput" name="myinput" type="text" value="Text_Ends_Here" /></input>
$("input[name=myinput]").click(function()
{
var currentValue = $(this).val();
currentValue = currentValue.replace("Text_Ends_Here", "");
$(this).val(currentValue);
}
);
$("input[name=myinput]").focusout(function()
{
var currentValue = $(this).val();
$(this).val(currentValue + ' Text_Ends_Here');
}
);
http://jsfiddle.net/gXvLB/95/
You can position the required text over textarea using positioning.