Hello and welcome to our community! Is this your first visit?
Register
Enjoy an ad free experience by logging in. Not a member yet? Register.
Results 1 to 14 of 14
  1. #1
    New Coder
    Join Date
    Jan 2005
    Posts
    33
    Thanks
    0
    Thanked 0 Times in 0 Posts

    Angry Editing forms to be compatible for display in webpages

    Hi all,

    i have a problem. Basically i need to post information via a form to an access database and then this information will be displayed in a webpage later on.

    Here is the example of the text i will use for the example.

    MENU CONTROLS
    Directional Pad Highlight Menu Items/Cycle Choices
    Left Thumbstick Highlight Menu Items/Cycle Choices
    A Button Select/Next Screen
    B Button Return to Previous Screen

    Now if i paste this into a form, it wont recognise the carraige returns or bold charachters and it will be displayed in a webpage like this:

    MENU CONTROLSDirectional Pad Highlight Menu Items/Cycle ChoicesLeft Thumbstick Highlight Menu Items/Cycle ChoicesA Button Select/Next Screen B Button Return to Previous Screen

    This is not what i want as presentation is important so i have found the following script that recognises the return carraiges. Heres the script:

    <SCRIPT LANGUAGE="JavaScript">
    <!-- Begin
    function ConvertBR(input) {
    // Converts carriage returns
    // to <BR> for display in HTML

    var output = "";
    for (var i = 0; i < input.length; i++) {
    if ((input.charCodeAt(i) == 13) && (input.charCodeAt(i + 1) == 10)) {
    i++;
    output += "<BR>";
    } else {
    output += input.charAt(i);
    }
    }
    return output;
    }
    // End -->


    This script can be seen in action at this page click here

    This is how it displays after applying the above code:

    MENU CONTROLS
    Directional Pad Highlight Menu Items/Cycle Choices
    Left Thumbstick Highlight Menu Items/Cycle Choices
    A Button Select/Next Screen
    B Button Return to Previous Screen


    Now this is great but it dosent recognise the characters in bold. Maybe using .indexOf to find it or something or is this possible.

    If its not possible has anyone any suggestions how i could do this as i would be copying and pasting a large document so it would be a big inconvienience to have to alter all the code manually to display the bold words.

    Any help or ideas would be greatly appreciated

    Thanks
    Paul

  • #2
    New Coder
    Join Date
    Jan 2005
    Posts
    33
    Thanks
    0
    Thanked 0 Times in 0 Posts

    Smile Can this not be done

    Hello,

    Is there nobody out there that can give me a helpful hint or point me in the right direction. I was thinking that maybe i done something wrong in posting because nobody has replied.

    Maybe its because it cant be done and if it cant be done does anyone know how to do the next best thing, which would be to highlight a piece of text in the field and click on a button which will automatically put the highliighted text in bold brackets, more or less exactly the same as you do here when posting a message, you highlight the text and click the bold button.

    I would really appreciated ANY help
    Thanks
    Paul

  • #3
    Regular Coder
    Join Date
    Jun 2002
    Location
    Edinburgh, UK
    Posts
    402
    Thanks
    2
    Thanked 1 Time in 1 Post
    How exactly are you making the text bold in the DB? If you're using <b></b> then is it printing the tags as well as the text? If not just trying adding the <b></b> tags around the text you want bold and see what happens.

    Let me know

    p.s. Do you have access to server-side languages such as PHP or ASP?
    Rich

    "An expert is a person who has made all the mistakes that can be made in a very narrow field."

  • #4
    New Coder
    Join Date
    Jan 2005
    Posts
    33
    Thanks
    0
    Thanked 0 Times in 0 Posts

    Smile Thanks for the reply

    Yes, im using server side javascript and asp with access as my database. If you goto http://www.athlonemovies.com/arman/a....asp?GameID=26

    Youll see an example of the way the code is entered. Heres a quick example aswell.

    I paste this into the first textbox on the webpage and it comes out like this

    MENU CONTROLS
    Directional Pad Highlight Menu Items/Cycle Choices

    It then edits the carraige returns in the 2nd box like this:

    MENU CONTROLS<BR>Directional Pad Highlight Menu Items/Cycle Choices<BR>

    This is the information that will be added to the database to make it display correctly in a webpage but i also want it to recognise the bold words and edit them like this:

    <b>MENU CONTROLS</b><BR><b>Directional Pad</b>Highlight Menu Items/Cycle Choices<BR>Left Thumbstick Highlight Menu Items/Cycle Choices

    The problem is when you copy and paste bold into a form it dosent recognise the bold words. Please bear in mind that there could be several pages of words to filter through so to add the <b> tags manually would be a major headache, i would at least hope to be able to highlight the word and click on a button which would automatically wrap it in opening and closing <b> tags but ideally if the bold words could automatically be recognised similar to they way the return carraige is recognised then this would be smashing.

    Thanks for replying and i hope you can help
    Cheers
    Paul

  • #5
    Regular Coder
    Join Date
    Jun 2002
    Location
    Edinburgh, UK
    Posts
    402
    Thanks
    2
    Thanked 1 Time in 1 Post
    Okay the problem is the fact that the carriage return is a recognised character in most character sets, but BOLD is formatting and is only present in the application that is using it. Copying the text, as you said only copies the text, not the formatting.

    It is possible to create a button to put in the <b></b> tags around the selected text; I've had one before.

    The basic principal of the button function would be to split the contents of the field into three, before selected, selected and after selected. Then all you do is write the contents of the field as:

    field.value = before_selected + "<b>" + selected + "</b>" + after_selected;

    The only thing I'm not sure of is how to work out the position of the selected text.

    I'll have a go at writing a function, if this what you want.
    Rich

    "An expert is a person who has made all the mistakes that can be made in a very narrow field."

  • #6
    Regular Coder
    Join Date
    Jun 2002
    Location
    Edinburgh, UK
    Posts
    402
    Thanks
    2
    Thanked 1 Time in 1 Post
    I've written a function that will put the bold tags around the selected text or wherever the cursor is:

    Code:
    <html>
    <head>
    <title>Testing</title>
    <script>
    function bold() {
    	field = document.getElementById('code');
    	startPos = field.selectionStart;
    	endPos = field.selectionEnd;
    	before = field.value.substr(0, startPos);
    	selected = field.value.substr(field.selectionStart, (field.selectionEnd - field.selectionStart));
    	after = field.value.substr(field.selectionEnd, (field.value.length - field.selectionEnd));
    	field.value = before + "<b>" + selected + "</b>" + after;
    }
    </script>
    </head>
    
    <body>
    <input type="button" value="Bold" onclick="javascript:bold()">
    <textarea id="code" name="code"></textarea>
    </body>
    </html>
    Last edited by Badman3k; 01-10-2005 at 09:10 PM. Reason: Ooops left the debug alerts in :)
    Rich

    "An expert is a person who has made all the mistakes that can be made in a very narrow field."

  • #7
    New Coder
    Join Date
    Jan 2005
    Posts
    33
    Thanks
    0
    Thanked 0 Times in 0 Posts

    Thumbs up Button Function

    BADMAN,

    Thanks so much for all your help. I really appreciate it and would be very grateful if you would have a go at the function. Or even of you know of a good site where i might find it, ive tried loads of places but i cant find anything on it

    Thanks ever so much
    Paul

  • #8
    Regular Coder
    Join Date
    Jun 2002
    Location
    Edinburgh, UK
    Posts
    402
    Thanks
    2
    Thanked 1 Time in 1 Post
    See above
    Rich

    "An expert is a person who has made all the mistakes that can be made in a very narrow field."

  • #9
    New Coder
    Join Date
    Jan 2005
    Posts
    33
    Thanks
    0
    Thanked 0 Times in 0 Posts

    Thumbs up Wow

    BADMAN,

    That was quick, you must have posted the function at the same moment, i sent my email, Thanks very much i will try it out now.

    Also is there anywhere i can vote for you to show my appreciation or is that available on this site

  • #10
    Regular Coder
    Join Date
    Jun 2002
    Location
    Edinburgh, UK
    Posts
    402
    Thanks
    2
    Thanked 1 Time in 1 Post
    I do try and be as quick as possible lol

    I'd be happy with the fact that it works and you're happy. You can't vote for me as such, however you can nominate users as helpful members here.
    Rich

    "An expert is a person who has made all the mistakes that can be made in a very narrow field."

  • #11
    New Coder
    Join Date
    Jan 2005
    Posts
    33
    Thanks
    0
    Thanked 0 Times in 0 Posts

    Thumbs up I Posted a thank you at that link

    I tried that and i had a problem. Its not bolding the words, its more than likely something i done wrong, the only thing i changed in the code was this:

    field = document.getElementById('message');

    i changed it from code to message because the field im using is called message. Is this right?

    You can go to this link to see the problem, the start and end points are coming up undefined?

    http://www.athlonemovies.com/arman/a....asp?GameID=26

    Hope you can help

  • #12
    Regular Coder
    Join Date
    Jun 2002
    Location
    Edinburgh, UK
    Posts
    402
    Thanks
    2
    Thanked 1 Time in 1 Post
    That was in fact my fault, I only tested it in Firefox and you've used it in IE probably. However this should work better and is suitable for both IE and FF:

    Code:
    <html>
    <head>
    <title>Testing</title>
    <script>
    function bold() {
    	field = document.getElementById('message');
    	doc = document.selection;
    	if (document.all){
    		vs = '#$%^%$#';
    		tr = document.selection.createRange();
    		selected = tr.text;
    		tr.text = vs;
    		fb = field.value.split(vs);
    		tr.moveStart('character',-vs.length);
    		tr.text = selected;
    		before = fb[0];
    		after = fb[1];
    		}
    	else{
    		before = field.value.substr(0, field.selectionStart);
    		selected = field.value.substr(field.selectionStart, (field.selectionEnd - field.selectionStart));
    		after = field.value.substr(field.selectionEnd, (field.value.length - field.selectionEnd));
    	}	
    	field.value = before + "<b>" + selected + "</b>" + after;
    }
    </script>
    </head>
    
    <body>
    <input type="button" value="Bold" onclick="javascript:bold()">
    <textarea id="message" name="message"></textarea>
    </body>
    </html>
    Sorry about that
    Rich

    "An expert is a person who has made all the mistakes that can be made in a very narrow field."

  • #13
    New Coder
    Join Date
    Jan 2005
    Posts
    33
    Thanks
    0
    Thanked 0 Times in 0 Posts

    Smile

    Thats spot on now, It works perfect. Your a star

    Thanks
    Paul

  • #14
    Regular Coder
    Join Date
    Jun 2002
    Location
    Edinburgh, UK
    Posts
    402
    Thanks
    2
    Thanked 1 Time in 1 Post
    Anytime
    Rich

    "An expert is a person who has made all the mistakes that can be made in a very narrow field."


  •  

    Posting Permissions

    • You may not post new threads
    • You may not post replies
    • You may not post attachments
    • You may not edit your posts
    •