Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

How can I filter data returned from jQuery?

jQuery code:

$(document).ready(function() {
  $('#s-results').load('get_report1.php').show();
  $('#search-btn').click(function(){ showValues(); });
  $(function() {
    $('form').bind('submit', function() { showValues(); return false; });
  });

  function showValues() { 
    $.post('get_report1.php', { name: form.name.value }, 
      function(result) {
        $('#s-results').html(result).show();
      }
    ); 
  }
});

HTML:

<form name = "form">
   <div>Enter name</div>
     <input type="text" name="name" id="fn" />
     <input type="submit" value="Search" id="search-btn" />
   <div>
      <input type="text" id="se2" name="search22">
   </div>
</form>
<div id = "s-results" style="height:50px;">
</div>

Up to this the script is running perfectly. Now I just want to filter the returned HTML from the above function again.

For implementing this I have tried this line of code:

$(result).filter('#se2');

under the function with the result parameter, but it is not working.

So how can the returned HTML code be filtered?

like image 976
Ankit Sharma Avatar asked Jul 27 '14 06:07

Ankit Sharma


1 Answers

You probably need find() instead of filter as you need to get the descendant whereas filter "Reduce the set of matched elements to those that match the selector or pass the function's test"

Live Demo

$(result).find('#se2');

If the #se is added in DOM then you can directly use the id selector

se = $('#se2');

I made another demo (as I am still waiting for your demo that is not working) to further elaborate how a string containing the html you have could be passed to jQuery function $() to search elements within it using find.

Live Demo

html = '<form name = "form"> \
   <div>Enter name</div> \
     <input type="text" name="name" id="fn" /> \
     <input type="submit" value="Search" id="search-btn" /> \
   <div> \
       <input type="text" id="se2" name="search22" value="se2"/> \
   </div> \
</form>\
<div id = "s-results" style="height:50px;"> \
</div> ';

alert($(html).find('#se2').val());  

Note You can further check the code working in the example above by using find wont work by using filter over this jsfiddle example

like image 56
Adil Avatar answered Sep 27 '22 19:09

Adil