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 8 of 8
  1. #1
    Regular Coder
    Join Date
    May 2005
    Posts
    235
    Thanks
    0
    Thanked 0 Times in 0 Posts

    bbcode only half working, can you help clear a few things up?

    I am trying to include bbcode on a Blog script I am working on. So far I have been able to create (with a lot of help from google and this sites search ) an array of buttons that open the required pop up for entering the bbcode text. And sure enough whatever I type in appears in its [B] brackets. But when I come to view the post it actually shows the bbcode tags and the contained text is un changed.
    This has made me wonder if I am missing something. What takes care of the bbcode being displayed ? is it the browser, or do I need some script somewhere to translate the bbcode to html ?

    What I have so far is
    javascript
    <script type="text/javascript">function bbcode(code){
    document.edit.text_art.value+="["+code+"]"+prompt("Enter your text please:")+"[/"+code+"]"
    }
    function bbUrl(){
    document.edit.text_art.value+=""+prompt("Text of link:")+""
    }
    </script>
    and the html for the buttons is

    Code:
    <a href="javascript://" onclick="bbcode('b')">
    <img src="../img/bold.gif" alt="bold" width="30" height="20" border="0" title="bold" /></a>
    
    <a href="javascript://" onclick="bbcode('i')">
    <img src="../img/italic.gif" alt="italic" width="30" height="20" border="0" title="italic" /></a>
    Crowds
    PHP magpie | And President Of The Marmalade Atkins Fan Club | Crowds Design

  • #2
    Senior Coder
    Join Date
    Feb 2006
    Location
    USA
    Posts
    1,013
    Thanks
    0
    Thanked 0 Times in 0 Posts
    You need to write a server-side script to convert the bbcode to X/HTML.

    Regular Expressions are often used to do that.

    Why do you want to use prompt() anyway? Why not allow users to select text and then add the bbcode around the selected text?

    http://www.sitepoint.com/forums/showthread.php?t=296023
    How can I manipulate the selection and the caret in an input type="text" element in Mozilla browsers and IE/Win?
    http://www.alexking.org/blog/2003/06...ng-javascript/
    http://www.massless.org/mozedit/
    http://parentnode.org/javascript/wor...rsor-position/
    Learn CSS. | SSI | PHP includes | X/HTML Validator | CSS validator | Dynamic Site Solutions
    Java != JavaScript && JScript != JavaScript
    Design/program for Firefox (and/or Opera), apply fixes for IE, not the other way around.

  • #3
    Regular Coder
    Join Date
    May 2005
    Posts
    235
    Thanks
    0
    Thanked 0 Times in 0 Posts
    Thanks for the links Kravvitz. Some usefull reading there, and plenty of things to try.

    I see your point about selecting the text. And I suppose end users would likely be more used to this method from use of word proccesors.

    Can you point me in the right direction (links or other) with regards to the server side script I would need to create ? I am moderatly familiar with PHP... that is to say I am a code magpie, I steal bits to see how they work... and to line my nest

    Thanks again
    Crowds
    PHP magpie | And President Of The Marmalade Atkins Fan Club | Crowds Design

  • #4
    Senior Coder
    Join Date
    Feb 2006
    Location
    USA
    Posts
    1,013
    Thanks
    0
    Thanked 0 Times in 0 Posts
    You're welcome

    Not only are they more used to it, it makes it easier to use.

    Check these out: http://www.google.com/search?q=php+bbcode+%7Eparser
    Learn CSS. | SSI | PHP includes | X/HTML Validator | CSS validator | Dynamic Site Solutions
    Java != JavaScript && JScript != JavaScript
    Design/program for Firefox (and/or Opera), apply fixes for IE, not the other way around.

  • #5
    Regular Coder
    Join Date
    May 2005
    Posts
    235
    Thanks
    0
    Thanked 0 Times in 0 Posts
    Thats fantastic, plenty of options. I even found one with the ability to insert HTML special charecters.

    Thanks Kravvitz,
    Just what I need

    Crowds
    PHP magpie | And President Of The Marmalade Atkins Fan Club | Crowds Design

  • #6
    Regular Coder
    Join Date
    May 2005
    Posts
    235
    Thanks
    0
    Thanked 0 Times in 0 Posts
    Well, things are looking good. I have found a parse script that is easy to modify and add to. But I have one slight issue. I know this really needs to be addressed in the php area but as it pertains to this thread....
    The parse script I have only converts any bbcode from the text that is fetched from a mysql query, but not the other way round. This is fine (afaik) but when I view any text that has been submmited I get a <br/> for every instance in which I have started a new line via a 'return'.
    What can I add to still have the break function but not display ?

    Here is the script (credited to Louai Munajim)
    PHP Code:
    function bb2html($text)
    {
      
    $bbcode = array("<"">",
                    
    "[list]""[*]""[/list]"
                    
    "[img]""[/img]"
                    
    "[b]""[/b]"
                    
    "[u]""[/u]"
                    
    "[i]""[/i]",
                    
    '[color="'"[/color]",
                    
    "[size=\"""[/size]",
                    
    '[url="'"[/url]",
                    
    "[mail=\"""[/mail]",
                    
    "[code]""[/code]",
                    
    "[quote]""[/quote]",
                    
    '"]');
      
    $htmlcode = array("&lt;""&gt;",
                    
    "<ul>""<li>""</ul>"
                    
    "<img src=\"""\">"
                    
    "<b>""</b>"
                    
    "<u>""</u>"
                    
    "<i>""</i>",
                    
    "<span style=\"color:""</span>",
                    
    "<span style=\"font-size:""</span>",
                    
    '<a href="'"</a>",
                    
    "<a href=\"mailto:""</a>",
                    
    "<code>""</code>",
                    
    "<br><br><small>Quote:</small><br><table class=quote><tr><td>""</td></tr></table>",
                    
    '">');
      
    $newtext str_replace($bbcode$htmlcode$text);
      
    $newtext nl2br($newtext);//second pass
      
    return $newtext

    Oh and this is the javascript functions I am using.
    Code:
    <script language="JavaScript" type="text/javascript">
    var clientInfo = navigator.userAgent.toLowerCase();
    var isIE = ( clientInfo.indexOf("msie") != -1 );
    var isWin = ( (clientInfo.indexOf("win")!=-1) || (clientInfo.indexOf("16bit") != -1) );
    
    function createBBtag( openerTag , closerTag , areaId ) {
    	if(isIE && isWin) {
    		createBBtag_IE( openerTag , closerTag , areaId );
    	}
    	else {
    		createBBtag_nav( openerTag , closerTag , areaId );
    	}
    	return;
    }
    
    function createBBtag_IE( openerTag , closerTag , areaId ) {
    	var txtArea = document.getElementById( areaId );
    	var aSelection = document.selection.createRange().text;
    	var range = txtArea.createTextRange();
    
    	if(aSelection) {
    		document.selection.createRange().text = openerTag + aSelection + closerTag;
    		txtArea.focus();
    		range.move('textedit');
    		range.select();
    	}
    	else {
    		var oldStringLength = range.text.length + openerTag.length;
    		txtArea.value += openerTag + closerTag;
    		txtArea.focus();
    		range.move('character',oldStringLength);
    		range.collapse(false);
    		range.select();
    	}
    	return;
    }
    
    function createBBtag_nav( openerTag , closerTag , areaId ) {
    	var txtArea = document.getElementById( areaId );
    	if (txtArea.selectionEnd && (txtArea.selectionEnd - txtArea.selectionStart > 0) ) {
    		var preString = (txtArea.value).substring(0,txtArea.selectionStart);
    		var newString = openerTag + (txtArea.value).substring(txtArea.selectionStart,txtArea.selectionEnd) + closerTag;
    		var postString = (txtArea.value).substring(txtArea.selectionEnd);
    		txtArea.value = preString + newString + postString;
    		txtArea.focus();
    	}
    	else {
    		var offset = txtArea.selectionStart;
    		var preString = (txtArea.value).substring(0,offset);
    		var newString = openerTag + closerTag;
    		var postString = (txtArea.value).substring(offset);
    		txtArea.value = preString + newString + postString;
    		txtArea.selectionStart = offset + openerTag.length;
    		txtArea.selectionEnd = offset + openerTag.length;
    		txtArea.focus();
    	}
    	return;
    }
    
    <a href="javascript:createBBtag('','','txtA')"><strong><img src="inc/bbcode/img/bold.gif" alt="B" width="20" height="20" border="0" /></strong></a>
    </script>
    Cheers

    Crowds
    PHP magpie | And President Of The Marmalade Atkins Fan Club | Crowds Design

  • #7
    New Coder
    Join Date
    Dec 2005
    Posts
    32
    Thanks
    0
    Thanked 0 Times in 0 Posts
    Yeah, thats what I use. It works real good too

  • #8
    Regular Coder
    Join Date
    May 2005
    Posts
    235
    Thanks
    0
    Thanked 0 Times in 0 Posts
    Its ok I have sorted it.
    I had this line in the page that fetches the text from mysql
    PHP Code:
        $message nl2br($message); 
    So along with the bbcode parse file...
    PHP Code:
    $newtext nl2br($newtext);//second pass 
    It was fouling it up. Dont know how, not experienced enough. But I imagine it was converting it then converting it back...

    Oh well, sorted know
    PHP magpie | And President Of The Marmalade Atkins Fan Club | Crowds Design


  •  

    Posting Permissions

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