join this

Ive got some code (previously helped out in EE), which looks for a named div, and then each class inside:-
$("#divTransactions .clsTransactionRow").each( function(_index, _value ) {  

Open in new window


Which works, great, however Im trying to upgrade it already to make the code work better, what Im trying to do is get the values of 3 divs inside each of the returned from the working each command, however I don't know how to comine this and the div value, so like:-
$(this).("#txtTransDate").text()

Open in new window


After reading some code, I thought I could use find instead:-
$(this).find("#txtTransDate").text()

Open in new window


So something like
      $("#divTransactions .clsTransactionRow").each( function(_index, _value ) {
            var varDate = $(this).find("#txtTransDate").text().toLowerCase().indexOf($("#txtTransDate").val().toLowerCase());
      });

Open in new window


Im not sure where to go or serch for to sort my issue :-S
tonelm54Asked:
Who is Participating?

Improve company productivity with a Business Account.Sign Up

x
 
leakim971Connect With a Mentor PluritechnicianCommented:
yes, we had TransText instead TransTrans
updated : http://jsfiddle.net/bjbLL/2/
0
 
leakim971PluritechnicianCommented:
do you understand << ID must be unique in a document >> ?
0
 
tonelm54Author Commented:
Sorry, its not an ID, don't know why I put that :-S they are classes.


What Im looking to do is pull the value of the class txtTransDate in each of the returned from the each command, so something like:-
      $("#divTransactions .clsTransactionRow").each( function(_index, _value ) {
            var varDate = $(this).find(".txtTransDate").text().toLowerCase().indexOf($("#txtTransDate").val().toLowerCase());
      }); 

Open in new window



Whats its pulling from is something like:-
<div id="divTransactions">
      <div id="row56" class="clsTransactionRow">
            <div class="txtTransDate">2012-12-24</div>
            <div class="txtTransText">DB Payment</div>
            <div class="txtTransStatus">Cleared</div>
      </div>
      <div id="row57" class="clsTransactionRow">
            <div class="txtTransDate">2012-12-23</div>
            <div class="txtTransText">CC Payment</div>
            <div class="txtTransStatus">Held</div>
      </div>
      <div id="row58" class="clsTransactionRow">
            <div class="txtTransDate">2012-12-22</div>
            <div class="txtTransText">Standing Order</div>
            <div class="txtTransStatus">Disputed</div>
      </div>
<div>

Open in new window


Sorry for my mistake
0
Get your problem seen by more experts

Be seen. Boost your question’s priority for more expert views and faster solutions

 
leakim971PluritechnicianCommented:
to pull it to what/where/in?
0
 
tonelm54Author Commented:
What I'm trying to do is filter a list of Divs, from 3 text boxes. So I have 3 text boxes which when the filter is fired it searches the divs for a match and then shows or hides them.

My more complex code is:-
    function filterTransactions() {
      $("#divTransactions .clsTransactionRow").each( function(_index, _value ) {
          if (($(this).(".txtTransDate").text().toLowerCase().indexOf( $("#txtTransDate").val().toLowerCase()) <= 0 )||
                ($(this).(".txtTransTrans").text().toLowerCase().indexOf( $("#txtTransTrans").val().toLowerCase()) <= 0 )||
                ($(this).(".txtTransAmount").text().toLowerCase().indexOf( $("#txtTransAmount").val().toLowerCase()) <= 0 )) {
              $(this).show();
          } else {
              $(this).hide();
          }
      });
    }

Open in new window


So with the 3 textboxes:-
          <input id="txtTransDate" class="clsTransactionSearchTextBox" style="width:50px; font-size:10px;" />
          <input id="txtTransTrans" class="clsTransactionSearchTextBox" style="width:400px; font-size:10px;" />
          <input id="txtTransAmount" class="clsTransactionSearchTextBox" style="width:50px; font-size:10px;" />

Open in new window


And then set the textboxes to fire the filter on keyup:-
	$(document).ready(function () {
                        $('#txtTransDate').keyup(function() { filterTransactions(); });
                        $('#txtTransTrans').keyup(function() { filterTransactions(); });
                        $('#txtTransAmount').keyup(function() { filterTransactions(); });
	});

Open in new window


There is a lot many more lines, however just to debug, Ive put 3 rows in:-
<div id="divTransactions">
      <div id="row56" class="clsTransactionRow">
            <div class="txtTransDate">2012-12-24</div>
            <div class="txtTransText">DB Payment</div>
            <div class="txtTransStatus">Cleared</div>
      </div>
      <div id="row57" class="clsTransactionRow">
            <div class="txtTransDate">2012-12-23</div>
            <div class="txtTransText">CC Payment</div>
            <div class="txtTransStatus">Held</div>
      </div>
      <div id="row58" class="clsTransactionRow">
            <div class="txtTransDate">2012-12-22</div>
            <div class="txtTransText">Standing Order</div>
            <div class="txtTransStatus">Disputed</div>
      </div>
<div>

Open in new window


So, to give you an idea, if I was to enter 'standing' into the textbox #txtTransTrans, I would like #row56 and #row57 to hide, and only #row58 to show. However my code runs, but doesn't hide anything.

Any ideas?
0
 
tonelm54Author Commented:
I believe my problem is with the line section:-
$(this).(".txtTransDate").text().

Open in new window


But haven't a clue on how to fix it
0
 
leakim971PluritechnicianCommented:
yes, this is an input, you must use .val() instead text() to get the value

You've only one field with txtTransDate ID so you can use :
$("#txtTransDate").val()
0
 
leakim971PluritechnicianCommented:
forget my last comment, I was talking aboput the filters, you're already using # for the ID so it's fine,

the answer of your question is :
$(".txtTransDate", this)
0
 
tonelm54Author Commented:
Ok, I agree and again apologise (very tires trying to sort this out, I will go to bed after this). The textboxes are txt, but I should have put the divs as cls in my comments above.

Ive put the code on jsFiddle to show whats going ok, and hopefully you will see what Im trying to do:-
http://jsfiddle.net/Zq2F9/

Thank you for taking the time to try and help, and to put up with my mistakes
0
 
leakim971PluritechnicianCommented:
check this : http://jsfiddle.net/bjbLL/
    function filterTransactions() {
      $("#divTransactions .clsTransactionRow").hide();
      $("#divTransactions .clsTransactionRow").each( function(_index, _value ) {
        var t1 = ($(".txtTransDate", this).text().toLowerCase().indexOf( $("#txtTransDate").val().toLowerCase()) >= 0 ) && $("#txtTransDate").val()!="";
        var t2 = ($(".txtTransTrans", this).text().toLowerCase().indexOf( $("#txtTransTrans").val().toLowerCase()) >= 0 ) && $("#txtTransTrans").val()!="";
        var t3 = ($(".txtTransAmount", this).text().toLowerCase().indexOf( $("#txtTransAmount").val().toLowerCase()) >= 0 ) && $("#txtTransAmount").val()!="";
        if (t1||t2||t3) $(this).show();
      });
    }

	$(document).ready(function () {
    $('#txtTransDate, #txtTransTrans, #txtTransAmount').keyup(filterTransactions);
	});

Open in new window

0
 
tonelm54Author Commented:
Ok, sorry I missed the comment
forget my last comment, I was talking aboput the filters, you're already using # for the ID so it's fine,

the answer of your question is :
$(".txtTransDate", this)

Ive changed jsFiddle, but its still not having it :-(
http://jsfiddle.net/Zq2F9/1/
0
 
leakim971PluritechnicianCommented:
0
 
tonelm54Author Commented:
http://jsfiddle.net/bjbLL/

With that, if you enter "db" in the search it hides all the rows and doesn't show the DB row
0
 
tonelm54Author Commented:
Thank you soo much for your help
0
Question has a verified solution.

Are you are experiencing a similar issue? Get a personalized answer when you ask a related question.

Have a better answer? Share it in a comment.

All Courses

From novice to tech pro — start learning today.