CODEWITHSUNDEEP
javascriptjquery
Robert
Robert

Reputation: 812

Exacly search in javascript

How I can search text in javascript only if is match perfectly. For example I have this structure:

<ul class="item-options">
    <li>First Item</li>
    <li>item Name</li>
    <li>product 1</li>
    <li>Item Description</li>
    <li>product description</li>
    <li>Additional Info</li>
    <li>Red</li>
    <li>Color</li>
    <li>Red</li>
</ul>

<ul class="item-options">
    <li>Second Item</li>
    <li>item Name Blue</li>
    <li>product 2</li>
    <li>Item Description</li>
    <li>product2 description</li>
    <li>Additional Info</li>
    <li>-----</li>
    <li>Color</li>
    <li>Blue</li>
</ul>

<ul class="item-options">
    <li>Third Item</li>
    <li>item Name Purple</li>
    <li>product 3</li>
    <li>Item Description</li>
    <li>-------</li>
    <li>Additional Info</li>
    <li>-----</li>
    <li>Color</li>
    <li>------</li>
</ul>

For example I want to check if the text item Name exist in the page then if the item Name text exist remove associated children. So for the first item Name I need to remove only the color: 

<li>Color</li>
<li>Red</li>

Then if item Name Blue text exist I need to remove associated children

<li>Additional Info</li>
<li>-----</li>

and if the third item Name Purple text exist then remove associated children:

<li>Item Description</li>
<li>-------</li>
<li>Additional Info</li>
<li>-----</li>
<li>Color</li>
<li>------</li>

I create this script but for example the name Color is deleted everywhere. Even if in the item Name or in item Name Purple must remain there. I think the problem is because the first product have the name item Name and in the second product the name is start with item Name Purple.

<script type="text/javascript">
    jQuery(document).ready(function() {
         if (jQuery('.items-class li:contains("item Name")').length > 0)
          { 
           var parent = jQuery('.items-class');
           var children = jQuery('.items-class').find("li");
           jQuery(children).each(function(i,e){
            if(~jQuery(e).text().indexOf("item Name Blue")){

                jQuery(parent).find('li:contains("Additional Info")').html('');  
                jQuery(parent).find('li:contains("-----")').html('');
            }
             if(~jQuery(e).text().indexOf("item Name Purple")){
                jQuery(parent).find('li:contains("Item Description")').html('');  
                jQuery(parent).find('li:contains("-------")').html('');

                jQuery(parent).find('li:contains("Additional Info")').html('');  
                jQuery(parent).find('li:contains("-----")').html('');

                jQuery(parent).find('li:contains("Color")').html('');  
                jQuery(parent).find('li:contains("-----")').html('');
            }
           else if(~jQuery(e).text().indexOf("item Name")){
                jQuery(parent).find('li:contains("Color")').html('');  
                jQuery(parent).find('li:contains("Red")').html('');
            }
          });
         }   
    });
</script>

Upvotes: 0

Views: 79

Answers (2)

JonSG
JonSG

Reputation: 13197

the removeAdditionalInfo() function below and:

removeAdditionalInfo("item Name");
removeAdditionalInfo("item Name Blue");
removeAdditionalInfo("item Name Purple");

will remove the additional info items.

Upvotes: 0

JonSG
JonSG

Reputation: 13197

I'm not exactly sure what you are asking, but I hope this helps.

function removeAdditionalInfo(searchCriteria){
    var interestingTagSelector = "ul.item-options > li";
    var additionInfoHeader = "Additional Info";
    var getFilter = function(criteria){
        return function(index, item){ return (item.innerHTML === criteria); };
    };

    // find the potentially interesting li tags
    $(interestingTagSelector)

        // filter out those that are not in fact interesting
        .filter(getFilter(searchCriteria))

        // get siblings following an interesting li tag
        .nextAll()

        // ignore those not starting the additional info section
        .filter(getFilter(additionInfoHeader))

        // get siblings following the AddInfo header
        .nextAll()

        // removed them
        .remove();
}

removeAdditionalInfo("item Name");

Upvotes: 1

Related Questions