How to pass a variable through .filter using jquery

Question

I've managed to get a table from another page into a variable called res.

I need to pass this variable through a filter for search.

I'm getting the table row that corresponds by using .parents().

This filter works when the table is on the same page as the jQuery, but not when using $.get().

Below is my approach:

$.get('oncalltable.html', function(res) {

    var d = new Date();

    var month = d.getMonth()+1;
    var day = d.getDate();
    var year = d.getFullYear();

    var oncalldate = ((''+month).length<2 ? '0' : '') + month + '/' +
        ((''+day).length<2 ? '0' : '') + day + '/' + year % 100;

    var search = oncalldate;

    var todayoncall = $("span").filter(function() {
        return $(this).text() == search;
    }).parents('tr');

    console.log(oncalldate, res, todayoncall);

    $('.test span').append(todayoncall);

});

And what isn't working, did you check that the network request actually goes through? — adeneo
– adeneo, Commented Sep 27, 2016 at 20:17
this is different in the context of the .filter() function compared to the outer function. Are expecting the this from $.get? — Spencer Wieczorek
– Spencer Wieczorek, Commented Sep 27, 2016 at 20:18
Are there existing elements within document which have text which is equal to search variable? Can you include text value of search and html of span elements at Question? What is purpose of filtering all span elements, then appending existing span element to .test span? element? — guest271314
– guest271314, Commented Sep 27, 2016 at 20:21
What's missing here is a proper explanation of what you expect this code to do. Also we know nothing about what the page structure looks like...or the response structure — charlietfl
– charlietfl, Commented Sep 27, 2016 at 20:23

LinuxDisciple · Accepted Answer · 2022-09-23 21:22:14Z

2

JQuery selectors work against the DOM. oncalltable.html isn't in DOM, it's just text inside a variable that happens to resemble HTML.

I'm guessing that you expect your $("span") selector to see the contents of oncalltable.html. It won't because the <span> you're looking for (inside oncalltable.html) isn't in DOM.

If (and only if) you are supremely confident that the data you get in oncalltable.html is now and always will be completely trustworthy, you can add it to your DOM by loading that html into your page.

One way to do that would be to assign the contents of 'res' to the .innerHTML of some existing page element. If you had (or decided to make) a hidden div to hold your data while it's parsed:

<div id="whereResGoes" style="display:none"></div>

then in the function you pass to $.get (just above the part where you use the $('span') selector), run

$('#whereResGoes').html(res);

Now it's loaded into your DOM and your $('span') selector can see it.

Note that since this approach makes oncalltable.html part of your page, it's like letting the author of oncalltable.html write anything they want on your page. If that page is ever compromised, yours will be too.

edited Sep 23, 2022 at 21:22

answered Sep 27, 2016 at 20:33

LinuxDisciple

2,39818 silver badges22 bronze badges

Sign up to request clarification or add additional context in comments.

1 Comment

nastri83 Over a year ago

THANK YOU! This is exactly the comment I needed to give me a good understanding of what jquery is all about.

Collectives™ on Stack Overflow

How to pass a variable through .filter using jquery

1 Answer 1

1 Comment

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

1 Comment

Your Answer

Sign up or log in

Post as a guest

Related