jquery - Search through a list of items to find a specific item with content in a specific attribute -

-

i have list of items. in each li custom attribute called data-index.

i want search through items , find each item specific string present in attribute.

i'm including whole thing here. suggestions? headed in right direction?

my expectation if search bg19 i'll 1 report in console.log. i'm getting 10 each time.

<!doctype html> <html> <head>     <meta charset="utf-8">     <meta http-equiv="x-ua-compatible" content="ie=edge">     <title>a selectable list</title>     <script src="http://cdnjs.cloudflare.com/ajax/libs/jquery/2.1.0/jquery.min.js" ></script>     <style>         .hidden {              display:none;         }          .show {              display:block;         }     </style>     <script>         $(document).ready(function() {             $('#id-submit').on('click', $(this), function() {                 var userid = $('#user-id').val();                 $('#user-app-list').children('li').attr('data-index', userid).each(function() {                     console.log('here go');                 });                 event.preventdefault();             });         });     </script> </head> <body>     <h3>to select library, enter id number , click submit.</h3>     <form>         <input type="text" value="" placeholder="enter id here" id="user-id">         <input type="submit" value="submit" id="id-submit">     </form>     <ul id="user-app-list">         <li data-index="cd123 cd124 cd125 bg12 bg19 bg20" class="hidden">             <h3><a href="http://apple.com">apple</a></h3>         </li>         <li data-index="cd127 cd128 cd130 bg12" class="hidden">             <h3><a href="http://amazon.com">amazon</a></h3>         </li>         <li data-index="cd121 cd119 cd125 bg12" class="hidden">             <h3><a href="http://google.com">google</a></h3>         </li>         <li data-index="cd123 cd124 cd125 bg12 bg20" class="hidden">             <h3><a href="http://youtube.com">youtube</a></h3>         </li>         <li data-index="cd123 cd124 cd125 bg12 bg20" class="hidden">             <h3><a href="http://vimeo.com">vimeo</a></h3>         </li>         <li data-index="cd127 cd127 cd120 bg12 bg20" class="hidden">             <h3><a href="http://ebay.com">ebay</a></h3>         </li>         <li data-index="cd127 cd119 cd118 bg12 bg20" class="hidden">             <h3><a href="http://craigslist.org">craigslist</a></h3>         </li>         <li data-index="cd128 cd127 cd130 bg12 bg20" class="hidden">             <h3><a href="http://inside.com">inside</a></h3>         </li>         <li data-index="cd129 cd119" class="hidden">             <h3><a href="http://cnn.com">cnn</a></h3>         </li>         <li data-index="cd130 cd118 cd125 bg12 bg20" class="hidden">             <h3><a href="http://bbc.com">bbc</a></h3>         </li>     </ul>      <p>test of following: cd118, cd119, cd120, cd121, cd123, cd124, cd125, cd127, cd128, cd129, cd130, bg12, bg19, bg20</p> </body> </html>

you need use attribute contains word selector $('#user-app-list').children('li[data-index~="'+userid+'"]').

attribute contains word selector

selects elements have specified attribute value containing given word, delimited spaces.

$(document).ready(function () {     $('#id-submit').on('click', $(this), function () {         var userid = $('#user-id').val();         $('#user-app-list').children('li').hide().filter('[data-index~="' + userid + '"]').show();         event.preventdefault();     }); });

demo: fiddle

what doing set value of data-index attribute


Comments

Post a Comment

Popular posts from this blog

java - WrongTypeOfReturnValue exception thrown when unit testing using mockito -

-
my test list<person> mylist; @test public void testisvalidperson() { mylist = new arraylist<person>(); mylist.add(new person("tom")); when(persondao.get(person)).thenreturn(mylist); when((persondao.get(person)).isempty()).thenreturn(false);//------exception thrown boolean result = service.isvalid("tom"); assertfalse(result); } method tested: public boolean isvalid(string person){ persondao = new persondao(); person personobj = new person(person); return (persondao.get(person).isempty())?false : true; } exception thrown: org.mockito.exceptions.misusing.wrongtypeofreturnvalue: boolean cannot returned get() get() should return list *** if you're unsure why you're getting above error read on. due nature of syntax above problem might occur because: 1. exception *might* occur in wrongly written multi-threaded tests. please refer mockito faq on limitations of concurrency testing. 2. sp
Read more

php - Magento - Deleted Base url key -

-
i working on cleaning url: http://mydomain.com/shop/shop/deals i going through settings in configuration tab in admin panel on magento , change secure , unsecure base urls remove first base url "shop" web page read: http://mydomain.com/shop/deals so changed unsecure base urls mydomain.com/shop mydomain.com , secure 12.345.67.89/shop 12.345.67.89. wrong thing do. i cannot reload page or admin console. how access these files through ftp , change correctly there?? when make changes in admin panel changes made in database not in file. have make changes in database. 1.go database , select core_config_data table under table find web/unsecure/base_url , web/secure/base_url . make changes here. don't forget clear cache in var/cache folder
Read more

android - How to disable Button if EditText is empty ? -

-
i have edittext , button in application. when button clicked,the text entered in edittext added listview. i want disable button if edittext empty.how ? this code button click imagebutton imb=(imagebutton)findviewbyid(r.id.btn_send); imb.setonclicklistener(new onclicklistener() { @override public void onclick(view arg0) { edittext et = (edittext)findviewbyid(r.id.edittext1); string str = et.gettext().tostring(); web1.add(str); toast.maketext(shoutsingleprogram.this, "you entered...."+str, toast.length_short).show(); adapter1.notifydatasetchanged(); et.settext(""); } }); } how can ? edittext1.addtextchangedlistener(new textwatcher() { @override public void ontextchanged(charsequence s, int start, int before, in
Read more