Hi, I am trying to create a little JavaScript WYSIWYG editor much like the one I'm using to write this thread right now. I have almost enough knowledge of the language to create one. My only question is, how can I retrieve and edit the text a user has selected? For example, in this WYSIWYG editor that I'm using you can select text and make it a hyperlink. How can I modify the text that a user selects?
Thank you.
9  1888  gits 5,390
Expert Mod 4TB
hi ...
have a look here ... may be that helps :)
kind regards
hi ...
have a look here ... may be that helps :)
kind regards
Thanks for the help, but that page isn't completed, and I already knew how to retrieve the text a user has selected, I just need to know how to change it. I don't mean just edit a variable storing the selection, I mean actually changing the text that was selected on the page.
Thanks though! :D
gits 5,390
Expert Mod 4TB
change to what?
kind regards
change to what?
kind regards
Say that a simple page looks like this (forget the WYSIWYG thing): -
<body>
-
<p>I am a simple page</p>
-
<button id="changeSelected">Change selected text</button>
-
</body>
-
And the user selects/highlights "I am" in the first <p> and then clicks the button, and the text that they selected is changed to like "I am not", making the generated source look like this: -
<body>
-
<p>I am not a simple page</p>
-
<button id="changeSelected">Change selected text</button>
-
</body>
-
How can I change the text on the page that a user has selected.
The reason I'm asking this is because say that in the WYSIWYG editor, somebody selects text and clicks the bold button. I then want the JavaScript to store the selected text in a variable, add <strong> tags around it, and then replace the selected text with new bolded text.
I hope I'm making myself clear...
gits 5,390
Expert Mod 4TB
this are two different things but you may handle them the same way if you wish:
1. editing the selected text:
idea is to replace the selected text with the edited text ... identify the start and the end of the range, remove the characters here from range start to end and insert the new text
2. add tags:
idea is ... identify the start and the end of the range (same as above) but simply add the respective tag-text to the current text at the range start and end positions
kind regards
this are two different things but you may handle them the same way if you wish:
1. editing the selected text:
idea is to replace the selected text with the edited text ... identify the start and the end of the range, remove the characters here from range start to end and insert the new text
2. add tags:
idea is ... identify the start and the end of the range (same as above) but simply add the respective tag-text to the current text at the range start and end positions
kind regards
Okay I went ahead and made the range and used a for loop to list its properties. Now I found startOffset and endOffset in Firefox... How can I replace only the text between those two values? I can imagine string.replace but that doesn't allow you to specify a start and end point. Substring does but you do not edit anything, just returns a value. What function should I use?
Kind regards (hehe)
gits 5,390
Expert Mod 4TB
the substring method should do it :) - var text = 'foo bar foobar';
-
var new_selected = 'newbar';
-
var new_text = text.substr(0, 4) + new_selected + text.substr(7, text.length);
-
now you could replace the entire text of the html node with new_text ...
kind regards
the substring method should do it :)
- var text = 'foo bar foobar';
-
var new_selected = 'newbar';
-
var new_text = text.substr(0, 4) + new_selected + text.substr(7, text.length);
-
now you could replace the entire text of the html node with new_text ...
kind regards
Oh duh :) Never thought of that XD
Happy new year :)
gits 5,390
Expert Mod 4TB
happy new year to you too ;) ... post back to the forum in case you have more questions ...
kind regards
Sign in to post your reply or Sign up for a free account.
Similar topics
by: Peter Gorelczenko |
last post by:
Good Morning,
I'm running Alpha 4.1 on Linux. I'm new to MySql but familliar with othe=
r=20
databases. I set up a user with "Create Temporary Tables" permissions. =
That=20
user can create...
|
by: Lannsjo |
last post by:
I need to change my primary key column type from smallint to int.
I have tried:
ALTER TABLE livegroup MODIFY id INT UNSIGNED NOT NULL AUTO_INCREMENT;
But get an error message certainly since my...
|
by: M A Srinivas |
last post by:
I have the following requirement
I am creating a login and database user 'test' on a database with dbo
role .
I want to remove create table , alter table permisions to this user.
I am able to...
|
by: David Housman |
last post by:
Hi,
I'm trying to write a function check if a column exists on a table, and
creates it if it doesn't. The line that the query analyzer is citing
is noted. It seems unhappy taking variables in...
|
by: ezra epstein |
last post by:
I'm trying to keep a user around but make it invalid. E.g., by setting the
valid until to be a time in the past. I've tried this:
alter user pw_config valid until 'Jan 31 2001';
and this:
...
|
by: RamaKrishna Narla |
last post by:
In MS SQL Server, I have the following tables with some data in it.
create table table1 (
column1 varchar(32),
column2 int not null,
column10 varchar(255),
.....
primary key (column1,...
|
by: James |
last post by:
To alter 1 column to a unique key,
ALTER TABLE user MODIFY COLUMN id INT NOT NULL UNIQUE;
But how to set combination of 2 columns as a unique key?
Individual keys are not unique, but...
|
by: noddy |
last post by:
I have a button
<input type="button" value="Get data">
When it is clicked a database is accessed and the data is eventually
displayed on the screen.
While the data is being retrieved the...
|
by: Rahul B |
last post by:
Hi,
I have a user UCLDEV1 which is a part of staff and a
group(db2schemagrp1) to which i have not given any permissions.
The authorizations of that user are shown as
db2 =get authorizations...
|
by: jcatubay |
last post by:
I'm trying to change the password for a user in my C# apps and I want to do it dynamically. I tried using this command "ALTER USER :USER_NAME IDENTIFIED BY :NEW_PASSWORD" and I'm passing values for...
|
by: Charles Arthur |
last post by:
How do i turn on java script on a villaon, callus and itel keypad mobile phone
|
by: emmanuelkatto |
last post by:
Hi All, I am Emmanuel katto from Uganda. I want to ask what challenges you've faced while migrating a website to cloud.
Please let me know.
Thanks!
Emmanuel
|
by: BarryA |
last post by:
What are the essential steps and strategies outlined in the Data Structures and Algorithms (DSA) roadmap for aspiring data scientists? How can individuals effectively utilize this roadmap to progress...
|
by: nemocccc |
last post by:
hello, everyone, I want to develop a software for my android phone for daily needs, any suggestions?
|
by: Sonnysonu |
last post by:
This is the data of csv file
1 2 3
1 2 3
1 2 3
1 2 3
2 3
2 3
3
the lengths should be different i have to store the data by column-wise with in the specific length.
suppose the i have to...
|
by: marktang |
last post by:
ONU (Optical Network Unit) is one of the key components for providing high-speed Internet services. Its primary function is to act as an endpoint device located at the user's premises. However,...
|
by: jinu1996 |
last post by:
In today's digital age, having a compelling online presence is paramount for businesses aiming to thrive in a competitive landscape. At the heart of this digital strategy lies an intricately woven...
|
by: tracyyun |
last post by:
Dear forum friends,
With the development of smart home technology, a variety of wireless communication protocols have appeared on the market, such as Zigbee, Z-Wave, Wi-Fi, Bluetooth, etc. Each...
|
by: agi2029 |
last post by:
Let's talk about the concept of autonomous AI software engineers and no-code agents. These AIs are designed to manage the entire lifecycle of a software development project—planning, coding, testing,...
| |
