Wrapping A Selection With Text?
Jun 11, 2011
I am working on code to wrap BBCodes around a user selection, then leave the selection selected for possibly adding more BBCodes around the same selection.My problem is that there seems to be several different ways to do it and I can't figure out which one is "the best".Now, I can't use the "standard" way of doing this because I am working with TinyMCE. I know there are countless examples on how to do this with textareas... that is NOT what I need.TinyMCE can give me a selection RANGE, a selection NODE or a selection OBJECT. Note that if I use TinyMCE's range, it internally "normalizes" the range to be a standard W3C range, regardless of browser.I've created a new range, extracted the selection from the user's range, created elements for the open and close BBCode, inserted the elements into the range and finally set the user's selection to the new range. Works fine.
I also tried taking the selection node (which is an element), then simply used "innerHTML" to add the opening and closing tags, then set the node to the modified node. Works fine.I've also used the editor's built in "selection.getContent()" and "selection.setContent()" calls and THIS also works.I've even tried using the DOM "surroundContents()" function, then used a regex to change the < and > into [ and ]. Freaky... but that works too.So, my dilemma is... which method should I use???To recap, here's what I want (blue represents selected text):
This is a test sentence. (user selected some text)
This is a test sentence. (text is wrapped and remains selected).
This is a test sentence. (user clicked another bbcode button).
[code]....
View 6 Replies
ADVERTISEMENT
Jun 16, 2006
I'm trying to 'wrap tags' around text in a text box.
<script language=javascript>
function insertFauxTags(fauxTag, e, endFauxTag)
{
var e = document.frmAddNewForum.txtTopicMessage.selected;
document.frmAddNewForum.txtTopicMessage.Value += fauxTag + e + endFauxTag;
}
</script>
And my form:
<form runat="server" id="frmAddNewForum">
<asp:textbox id="txtTopicMessage" runat="server" cssclass="formtext" rows="5" textmode="MultiLine" width="95%" style="width:95%"></asp:textbox>
</form>
And here's how I'm calling the function:
<a href="javascript:insertFauxTags('[p]' + e + '[/p]')"><img src="http://www.<%=strSiteName%>/images/parabutton.gif" border="0" alt="Paragraph" /></a>
When I run this in FF I get 'e' is not defined - any ideas?
View 1 Replies
View Related
Oct 13, 2011
I found this code on some web site which actually works on my current Safari browser. I will be grateful if anyone out there with IE version 8 or less can verify it working as well.
Basically I wanted to highlight some text with mouse drag, and have that piece of text wrapped with [high] at the beginning and [/high] at the end.
[Code]...
View 1 Replies
View Related
Sep 7, 2011
I am building an e-learning lesson in Lectora that will be deployed to a SCROM compatible learning management system. The lesson is converted into HTML before that happens. My table of contents is around 100 pixels wide but some of the page names are longer than that and do not display fully when viewed in a browser.What I am trying to do is this:The page name for this page is very, very long and I can't see it all. Blah blahWould becomeThe page name for this page is very,
View 1 Replies
View Related
May 2, 2007
I've got a form with a textarea box, currently you can just type a message in the box and submit it, then it is added to a mysql database and shows up on a page I made for people to view staff memos.
I've been asked to add formatting options like bold, italic, underline etc. Unfortunately me and javascript have never really met so I'm quite stumped. I can handle the form processing with PHP converting [b] to <strong> etc myself but I need help with the actual user interface.
View 1 Replies
View Related
Aug 26, 2009
I've got an unordered lists. I need to make the numbers larger (ordered lists numbers) and keep the text in the list at the same size. So what I was assuming I need to do is make the <li> font-size larger (the size I want the unordered list number to be), then wrap the text with a <span> and make the <span> smaller. I'm using a CMS and since the client will be modifying the text in the CMS, I can't exactly tell them to put <span> text, blah, blah</span> in the unordered lists as they won't figure that out. So how would I write the jQuery to wrap the text in the unordered lists with a span? Currently the output is like so:
<ol>
<li>Item One</li>
<li>Item Two</li>
</ol>
[Code]....
View 1 Replies
View Related
Apr 21, 2011
Here's a sample form:
Code:
<form action="#" method="post">
Name:<br />
[code]...
View 3 Replies
View Related
Apr 21, 2011
Here's a sample form:
Code:
<form action="#" method="post">
Name:<br />
<input type="text" name="name" value="your name" /><br />
[Code].....
When you tab to a text input, the value gets highlighted. How can it be disabled?
View 7 Replies
View Related
Apr 21, 2011
Here's a sample form:
<form action="#" method="post">
Name:<br />
<input type="text" name="name" value="your name" /><br />
[code]....
View 1 Replies
View Related
May 14, 2009
I have a function that will add text to the end of my text box. I want to be able to have the text added where it is currently selected.
My current code is :
View 1 Replies
View Related
Mar 27, 2010
im trying to get the selection of a text with the javascript function : window.getSelection();.
The problem is that the result is not like i hope. For example with a structure like this:
<div class="one" id="one">
Im one div
<strong class="two" id="two"> this is strong </strong>
Rest of div
[Code]....
View 1 Replies
View Related
Sep 25, 2005
Can anyone give me a Javascript snippet that will get the currently selected
text in a TEXTAREA element? The code I have only works in IE.
View 1 Replies
View Related
Oct 13, 2011
I made up a little test program to grab the mouse X and Y coordinates and plan to use it to allow users to resize a window.
Anyway, the problem I'm having is that in MSIE-8, the mouse down and movement causes text to be selected (which I don't want).
Here's is a screenshot from MSIE:
[URL]
And here is the test program live online: [URL]
Notice that the text in the box is selected... I don't want that to happen.
Of course, it works just fine in Firefox, but not MSIE.
View 4 Replies
View Related
Sep 25, 2010
Is there a way to display text from selecting checkboxes such that different combinations have different texts?
View 2 Replies
View Related
Feb 21, 2007
I'm trying to disable the text selection and print-key functions on a couple page of my web site using the code below:
View 4 Replies
View Related
Nov 12, 2010
I want to set selection on HTML input type=text.
Here's the code for FF and Chrome:
<input type=text value="01234567890" id=1>
<input type=submit onClick="selectIt()" >
<script>
selectIt=function (){
[Code].....
View 2 Replies
View Related
Sep 18, 2009
I am trying to get/set only text of list only element text value. But for some reason I can not select it in clear way. List something like:
<ul>
<li id="myid"> Here text that I want to modify
<ul>
<li id="dfdf">i don't want modify this</li>
<li id="dfdf">i don't want modify this</li>
[Code]...
View 1 Replies
View Related
Apr 15, 2010
If you have an anchor and apply the button widget, text selection in the button is still possible.
View 1 Replies
View Related
May 1, 2009
I have the following code I picked up which tries to fill in a text field with data depending on a user's menu item selection. I place this code in the header:
Code:
var colors = new Array();
colors["apple"] = "red";
colors["grape"] = "purple";
colors["milk"] = "white";
colors["cheese"] = "yellow";
colors["chicken"] = "white";
colors["beef"] = "red"; .....
var groups = new Array();
groups["apple"] = "fruit";
groups["grape"] = "fruit";
groups["milk"] = "diary";
groups["cheese"] = "diary";
groups["chicken"] = "meat";
groups["beef"] = "meat";
function printColorAndGroup(){
var value = document.getElementByName('food').options[document.getElementByName('food').selectedIndex].value;
document.getElementByName('food_group').value = groups[text];
document.getElementByName('food_color').value = colors[text];
}
I then use the following html in the body:
Code:
Food:
<select name="food" onchange="printColorAndGroup()">
<option>apple</option>
<option>grape</option>
<option>milk</option>
<option>cheese</option>
<option>chicken</option>
<option>beef</option>
</select>
Group:
<input type="text" name="food_group">
Color:
<input type="text" name="food_color">
But when I run this nothing happens...
Here's the page [URL]. None of the code above is colored... looks like I'm using the wrong tags here. Which tags should I use to post this stuff correctly?
View 12 Replies
View Related
Jun 16, 2009
I have 2 example/test pages of the issue I'm experiencing. For now, I'm just trying to get it to work in a standards-compliant browser, so view in something other than ie:
[URL]
If you click and drag the orange bar up or down, it works fine on the first page. However, on the 2nd page, if you click the orange bar and drag down too fast, it starts selecting text and then the bar gets all wacky.
My suspicion is that the bar gets messed up because the text is being selected. That occurs because if you scroll too fast, the cursor goes off the orange slider bar and starts selecting. If you scroll very slowly so that the cursor doesn't go off the bar it seems to scroll fine.
I've tried everything I can think of to stop the text from being selected, but I'm not 100% sure if that's the cause of the problem or just a symptom of something else (maybe bubbling or something?). I tried returning false on every mouse event on the lower panel, tried creating an absolutely-positioned mask above the text in the lower panel, tried removing all text from the lower panel, tried stopPropagation(), etc., but nothing seems to work.
If I set the mousedown/over/move on the lower panel to return false, it prevents selecting text normally by clicking the mouse & dragging, but it will STILL select the text if I click on the slider bar and drag down.
View 8 Replies
View Related
Oct 23, 2009
I'm attempting to display the output of the radio selection into the textbox.
For example, if the user selects 0-15 then display "Your age group is 0-15 years" in the text area.
i get the basic logic. i just dont understand how to display the value in the textbox. heres what i have so far if it will clarify my issue. code...
View 3 Replies
View Related
Jun 24, 2011
how to properly add some text content before and after a user's selection?I am working with the TinyMCE editor, and I can get the following from it:
* User's selection as a W3C compatible range
* User's selection as a browser selection object
* User's selection as a node (element) that encompasses the user's selection
I also need the user's selection to remain selected after being wrapped.I've looked all over the web and could find nothing (except running into my OWN previous questions about this).Here's an example of what I'm trying to do:
[URL]
First line is original text, second line a part is selected, third line the selection is wrapped and the selection remains selected.
View 4 Replies
View Related
Mar 25, 2011
I have a page on which I have 2 dropdowns. Both are similar. I have a piece of code that whill make a textbox appear if we select "list Box" as the option in the drop down. But for some reason, the first dropdown works fine, but for the second dropdown, the textbox is always there on page load. The code that I am presenting can be copied as a HTML page and you will know what I am referring to.
<html>
<script type="text/javascript">
function showfield(name){
if(name=='lstbox')document.getElementById('div1').style.display="block";
else document.getElementById('div1').style.display="none";
}
function hidefield() {
[Code]...
View 2 Replies
View Related
Jan 20, 2011
Basically I'm making an order form that updates the Total Text Box at the bottom of the page depending upon which selection is made from the drop down box in the form,
View 3 Replies
View Related
May 2, 2011
Is there anything out there that allows for a diagonal and vertical text capture in javascript or jQuery? I was not successful in finding anything. I have a game similar to word find that I've developed, but I need to be able to capture text vertically and diagonally. Otherwise, the only solution will be for me to do a by-click basis to capture items on the screen. I found the script below which handles horizontal capturing:
<script type="text/javascript">
document.body.style.cursor="url(3DArrow.cur), crosshair" ;
if (!window.Kolich){
Kolich = {};
} Kolich.Selector = {};
Kolich.Selector.getSelected = function(){
var t = '';
if (window.getSelection){
t = window.getSelection();
}else if(document.getSelection){
t = document.getSelection();
}else if(document.selection){
t = document.selection.createRange().text;
}return t;
}Kolich.Selector.mouseup = function(){
var st = Kolich.Selector.getSelected();
sel_text=st.replace(/s/gi,"");
if(st!=''){
alert("You selected:"+sel_text);
}}
$(document).ready(function(){
$(document).bind("mouseup", Kolich.Selector.mouseup);});
</script>
View 8 Replies
View Related
Apr 12, 2011
I have a Javascript function that allows the display of a textbox upon selecting an option from a dropdown menu. In my case when a user selects listbox as the option, the text box appears. I want the same thing to happen when another option (checkbox) is selected. when I repeat the JAVAscript code, the first textbox(listbox's textbox) appears irrespective of which option(listbox, checkbox) I select. I want to be able to appear/disappear only the respective textbox. Here is my code.
<html>
<script type="text/javascript" >
function showfield(name){
if(name=='lstbox')document.getElementById('div1').style.display="block";
else document.getElementById('div1').style.display="none";
}
function hidefield() {
[Code]....
View 2 Replies
View Related
