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 7 of 7
  1. #1
    New Coder
    Join Date
    Jul 2009
    Posts
    72
    Thanks
    1
    Thanked 0 Times in 0 Posts

    Replace text in string with multiple choices?

    I'm trying to create a script which allows me to replace text or html tags in realtime. Here is what I got so far.

    PHP Code:
    $str '<b>Hey!</b> This is a <b>test!</b>';

    echo 
    '<div id="strDiv">';
    echo 
    $str;
    echo 
    '</div>'
    Code:
    $('#rbtn').click(function() {
    	$('#strDiv').each(function() {
    		var from = '<b>',
            	text = $(this).html().replace(from, '');
            $(this).html(text);
        });
    });
    This works if I only have one replace to work with, and by the way... It. only replaces the first <b> and I want it to replace all <b> tags in the string!

    I want to make an multiple selectbox with some options to replace from the string like this:
    PHP Code:
    <select name="test" multiple="multiple">
        <option><?=htmlentities('<b>');?></option>
        <option>Hey</option>
        <option>This</option>
        <option>!</option>
    </select>
    So if I hit the first option it would remove/replace all incidents of this option in the string. If I deselect it again I want it to reinsert it into the string again.

    I'm a bit stuck and need some help. Please....

    Thanks in advance ;-)

  • #2
    Regular Coder Amphiluke's Avatar
    Join Date
    Jul 2009
    Posts
    312
    Thanks
    3
    Thanked 89 Times in 89 Posts
    You may use regular expressions to replace all the occurrences of a substring from the target string.

    Code:
    $('#rbtn').click(function() {
        var from = /<\/?b>/gi,
            div = $("#strDiv");
        div.html(div.html().replace(from, ""));
    });
    I am still learning English

  • #3
    New Coder
    Join Date
    Jul 2009
    Posts
    72
    Thanks
    1
    Thanked 0 Times in 0 Posts
    Quote Originally Posted by Amphiluke View Post
    You may use regular expressions to replace all the occurrences of a substring from the target string.

    Code:
    $('#rbtn').click(function() {
        var from = /<\/?b>/gi,
            div = $("#strDiv");
        div.html(div.html().replace(from, ""));
    });
    Well the issue is that the options in the select box would be html tags found in the string like this:
    PHP Code:
    $results preg_match_all('~<([^/][^>]*?)>~'$str$arr); 
    $arr array_unique($arr[1]);
        
    foreach(
    $arr as $arr1=>$value){
        echo 
    '<option value="">'.htmlentities('<'.$value.'>').'</option>';


  • #4
    Regular Coder Amphiluke's Avatar
    Join Date
    Jul 2009
    Posts
    312
    Thanks
    3
    Thanked 89 Times in 89 Posts
    Maybe I don't catch the problem, but why not go over all the options in the select box and pass the target string through the series of RE?
    Something like this:
    Code:
    <form id="texts" method="get" action="#">
        <select id="tags" name="test" multiple="multiple"> 
        <option>&lt;b&gt;</option> 
        <option>&lt;i&gt;</option> 
        <option>&lt;u&gt;</option> 
        <option>&lt;q&gt;</option> 
        </select>
        <input type="button" value="go!" onclick="foo();"/>
     </form>
    
     <script type="text/javascript">
        function foo() {
            var s = "dj j<i>___</i>rie<b>er</b> dr<q>fdf</q> rjs<u>uuu</u>",
                sel = document.getElementById("tags"),
                re;
            for (var i = 0, len = sel.options.length; i < len; i++) {
                if (sel.options[i].selected) {
                    re = new RegExp(sel.options[i].text.replace("<", "<\\/?"), "gi");
                    s = s.replace(re, "");
                }
            }
            alert(s);
        }
     </script>
    I am still learning English

  • #5
    New Coder
    Join Date
    Jul 2009
    Posts
    72
    Thanks
    1
    Thanked 0 Times in 0 Posts
    Quote Originally Posted by Amphiluke View Post
    Maybe I don't catch the problem, but why not go over all the options in the select box and pass the target string through the series of RE?
    Now that is getting close. But one problem still? Lets say the text has a html tag like this:

    <div id="mytest">lkhkjh</div>

    Then it doesnt get executed... Any ideas?

  • #6
    Regular Coder Amphiluke's Avatar
    Join Date
    Jul 2009
    Posts
    312
    Thanks
    3
    Thanked 89 Times in 89 Posts
    In that case one only needs to improve slightly the regular expression
    Code:
    <form id="texts" method="get" action="#">
        <select id="tags" name="test" multiple="multiple"> 
        <option>&lt;b&gt;</option> 
        <option>&lt;i&gt;</option> 
        <option>&lt;u&gt;</option> 
        <option>&lt;q&gt;</option> 
        </select>
        <input type="button" value="go!" onclick="foo();"/>
     </form>
    
     <script type="text/javascript">
        function foo() {
            var s = "dj j<i class='class'>___</i>rie<b id='id'>er</b> dr<q title='title'>fdf</q> rjs<u>uuu</u>",
                sel = document.getElementById("tags"),
                re;
            for (var i = 0, len = sel.options.length; i < len; i++) {
                if (sel.options[i].selected) {
                    re = new RegExp(sel.options[i].text.replace("<", "<\\/?").replace(">", "[^>]*?>"), "gi");
                    s = s.replace(re, "");
                }
            }
            alert(s);
        }
    </script>
    I am still learning English

  • Users who have thanked Amphiluke for this post:

    jmansa (11-17-2011)

  • #7
    New Coder
    Join Date
    Jul 2009
    Posts
    72
    Thanks
    1
    Thanked 0 Times in 0 Posts
    Quote Originally Posted by Amphiluke View Post
    In that case one only needs to improve slightly the regular expression
    Oh yes... Thanks, now I only need to figure out how to make this jQuery and update teh text in realtime and not as alerts... Thanks though :-)


  •  

    Posting Permissions

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